Android Code Snippet [B4X] [XUI] Rectangle image with rounded corners

Discussion in 'Code Snippets' started by Erel, Nov 19, 2017.

  1. Erel

    Erel Administrator Staff Member Licensed User

    Code to create a rectangle image with rounded corners:

    [​IMG]

    Compatible with B4A, B4i and B4J. Depends on XUI library v1.47+.

    Code:
    Sub CreateRoundRectBitmap (Input As B4XBitmap, Radius As Float) As B4XBitmap
       
    Dim BorderColor As Int = xui.Color_Black
       
    Dim BorderWidth As Int = 4dip
       
    Dim c As B4XCanvas
       
    Dim xview As B4XView = xui.CreatePanel("")
       xview.SetLayoutAnimated(
    000, Input.Width, Input.Height)
       c.Initialize(xview)
       
    Dim path As B4XPath
       
    path.InitializeRoundedRect(c.TargetRect, Radius)
       c.ClipPath(
    path)
       c.DrawRect(c.TargetRect, BorderColor, 
    True, BorderWidth) 'border
       c.RemoveClip
       
    Dim r As B4XRect
       r.Initialize(BorderWidth, BorderWidth, c.TargetRect.Width - BorderWidth, c.TargetRect.Height - BorderWidth)
       
    path.InitializeRoundedRect(r, Radius - 0.7 * BorderWidth)
       c.ClipPath(
    path)
       c.DrawBitmap(Input, r)
       c.RemoveClip
       c.Invalidate
       
    Dim res As B4XBitmap = c.CreateBitmap
       c.Release
       
    Return res
    End Sub
    Usage example:
    Code:
    Dim img As B4XBitmap = xui.LoadBitmapResize(File.DirAssets, "image.png", ImageView1.Width, ImageView1.Height, True)
    ImageView1.SetBitmap(CreateRoundRectBitmap(img, 
    20dip)) 'ImageView1 type is set to B4XView
     
  2. Serinter

    Serinter Member Licensed User

    B4J CODE ERROR

    Code:
    Sub Process_Globals
        
    Private fx As JFX
        
    Private MainForm As Form
        
    Private ImageView1 As B4XView
        
    Dim xui As XUI
    End Sub

    Sub AppStart (Form1 As Form, Args() As String)
        MainForm = Form1
      
        
    Dim img As B4XBitmap = xui.LoadBitmapResize(File.DirAssets, "image.png", ImageView1.Width, ImageView1.Height, True)
        ImageView1.SetBitmap(CreateRoundRectBitmap(img, 
    20dip)) 'ImageView1 type is set to B4XView
      
        MainForm.RootPane.AddNode(ImageView1, 
    450,350,100,100)

        MainForm.Show
    End Sub


    Sub CreateRoundRectBitmap (Input As B4XBitmap, Radius As Float) As B4XBitmap
        
    Dim BorderColor As Int = xui.Color_Black
        
    Dim BorderWidth As Int = 4dip
        
    Dim c As B4XCanvas
        
    Dim xview As B4XView = xui.CreatePanel("")
        xview.SetLayoutAnimated(
    000, Input.Width, Input.Height)
        c.Initialize(xview)
        
    Dim path As B4XPath
        
    path.InitializeRoundedRect(c.TargetRect, Radius)
        c.ClipPath(
    path)
        c.DrawRect(c.TargetRect, BorderColor, 
    True, BorderWidth) 'border
        c.RemoveClip
        
    Dim r As B4XRect
        r.Initialize(BorderWidth, BorderWidth, c.TargetRect.Width - BorderWidth, c.TargetRect.Height - BorderWidth)
        
    path.InitializeRoundedRect(r, Radius - 0.7 * BorderWidth)
        c.ClipPath(
    path)
        c.DrawBitmap(Input, r)
        c.RemoveClip
        c.Invalidate
        
    Dim res As B4XBitmap = c.CreateBitmap
        c.Release
        
    Return res
      
    End Sub

    'Return true to allow the default exceptions handler to handle the uncaught exception.
    Sub Application_Error (Error As Exception, StackTrace As StringAs Boolean
        
    Return True
    End Sub
    ERROR!

    B4J Versión: 5.90
    Parseando código. (0.00s)
    Compilando código (0.15s)
    Compilado código de diseños (0.00s)
    Organizando librerías. (0.00s)
    Compilando el código Java generado. Error
    B4J line: 17
    ImageView1.SetBitmap(CreateRoundRectBitmap(img, 2
    javac 1.8.0_144
    src\b4j\example\main.java:93: error: package android.graphics does not exist
    _imageview1.SetBitmap((android.graphics.Bitmap)(_createroundrectbitmap(_img,(float) (anywheresoftware.b4a.keywords.Common.DipToCurrent((int) (20)))).getObject()));
    ^
    1 error

    Removing the "dip" text remains the same error.
    I've missed something??
     
    Last edited: Nov 19, 2017
  3. Erel

    Erel Administrator Staff Member Licensed User

    Looks like you have added the B4A version of XUI to B4J.

    There are three libraries:
    XUI - B4A
    jXUI - B4J
    iXUI - B4i
     
  4. Serinter

    Serinter Member Licensed User

    Upppps. My fault. I'm going to correct this. Thanks again and forgive my impatience!!!
     
    Last edited: Nov 19, 2017
  5. Serinter

    Serinter Member Licensed User

    Ok. I must be a perfect idiot... but I can't see how to put this to work!!!!
    Now a new error:

    Code:
    Sub Process_Globals
        
    Private fx As JFX
        
    Private MainForm As Form
        
    Private ImageView1 As B4XView
        
    Dim xui As XUI
    End Sub

    Sub AppStart (Form1 As Form, Args() As String)
        MainForm = Form1

        
    Dim img As B4XBitmap = xui.LoadBitmapResize(File.DirAssets, "image.png", ImageView1.Width, ImageView1.Height, True)
        ImageView1.SetBitmap(CreateRoundRectBitmap(img, 
    20dip)) 'ImageView1 type is set to B4XView

        MainForm.RootPane.AddNode(ImageView1, 
    450,350,100,100)

        MainForm.Show
    End Sub


    Sub CreateRoundRectBitmap (Input As B4XBitmap, Radius As Float) As B4XBitmap
        
    Dim BorderColor As Int = xui.Color_Black
        
    Dim BorderWidth As Int = 4dip
        
    Dim c As B4XCanvas
        
    Dim xview As B4XView = xui.CreatePanel("")
        xview.SetLayoutAnimated(
    000, Input.Width, Input.Height)
        c.Initialize(xview)
        
    Dim path As B4XPath
        
    path.InitializeRoundedRect(c.TargetRect, Radius)
        c.ClipPath(
    path)
        c.DrawRect(c.TargetRect, BorderColor, 
    True, BorderWidth) 'border
        c.RemoveClip
        
    Dim r As B4XRect
        r.Initialize(BorderWidth, BorderWidth, c.TargetRect.Width - BorderWidth, c.TargetRect.Height - BorderWidth)
        
    path.InitializeRoundedRect(r, Radius - 0.7 * BorderWidth)
        c.ClipPath(
    path)
        c.DrawBitmap(Input, r)
        c.RemoveClip
        c.Invalidate
        
    Dim res As B4XBitmap = c.CreateBitmap
        c.Release
        
    Return res

    End Sub

    'Return true to allow the default exceptions handler to handle the uncaught exception.
    Sub Application_Error (Error As Exception, StackTrace As StringAs Boolean
        
    Return True
    End Sub
    Ha ocurrido un error en la línea: 16 (Main)
    java.lang.RuntimeException: Object should first be initialized (B4XView).

    Any help, please!
    I'm obfuscated and I don't see where's my fault code. I'm getting crazy with this
     
  6. Erel

    Erel Administrator Staff Member Licensed User

    CreateRoundRectBitmap creates a bitmap. It doesn't return any view. You need to create the ImageView.

    I recommend you to add views with the designer. Create a new layout. Add an ImageView and then call MainForm.RootPane.LoadLayout(...).
    Remove the line that adds ImageView1 to RootPane.

    If you want to do it programmatically:
    Code:
    Dim iv As ImageView
    iv.Initialize(
    "")
    Dim b4xview As B4XView = iv
    MainForm.RootPane.AddNode(b4xview, ...)
    Dim img As B4XBitmap = ...
    b4xview.SetBitmap(CreateRoundRectBitmap(...))
     
    Last edited: Nov 20, 2017
    Procesor and Serinter like this.
  7. Serinter

    Serinter Member Licensed User

    Of course!!! What a silly and blind I was not seeing this!
    Thank you very much for the inconvenience Erel. You are a genious!!
     
Loading...
  1. This site uses cookies to help personalise content, tailor your experience and to keep you logged in if you register.
    By continuing to use this site, you are consenting to our use of cookies.
    Dismiss Notice