Android Code Snippet [B4X] [XUI] Create a round image

Discussion in 'Code Snippets' started by Erel, Oct 17, 2017.

  1. Erel

    Erel Administrator Staff Member Licensed User

    This code snippet is based on XUI library and it is compatible with B4A, B4i and B4J.
    The input is a bitmap and the output is a round bitmap (with no distortions).

    [​IMG]

    Code:
    'xui is a global XUI variable.
    Sub CreateRoundBitmap (Input As B4XBitmap, Size As Int) As B4XBitmap
       
    If Input.Width <> Input.Height Then
         
    'if the image is not square then we crop it to be a square.
         Dim l As Int = Min(Input.Width, Input.Height)
         Input = Input.Crop(Input.Width / 
    2 - l / 2, Input.Height / 2 - l / 2, l, l)
       
    End If
       
    Dim c As B4XCanvas
       
    Dim xview As B4XView = xui.CreatePanel("")
       xview.SetLayoutAnimated(
    000, Size, Size)
       c.Initialize(xview)
       
    Dim path As B4XPath
       
    path.InitializeOval(c.TargetRect)
       c.ClipPath(
    path)
       c.DrawBitmap(Input, c.TargetRect)
       c.DrawCircle(c.TargetRect.CenterX, c.TargetRect.CenterY, c.TargetRect.Width / 
    2 - 2dip, xui.Color_White, False5dip'comment this line to remove the border
       c.RemoveClip
       c.Invalidate
       
    Dim res As B4XBitmap = c.CreateBitmap
       c.Release
       
    Return res
    End Sub
    Usage example:
    Code:
    'ImageView1 type is B4XView
    Dim img As B4XBitmap = xui.LoadBitmap(File.DirAssets, "myimage.jpg")
    ImageView1.SetBitmap(CreateRoundBitmap(img, ImageView1.Width))
    If you don't want to set the ImageView type to B4XView then you can do it locally:
    Code:
    Dim xIV As B4XView = ImageView1
    xIV.SetBitmap(CreateRoundBitmap(img, xIV .Width))
     
    Last edited: Oct 24, 2017
    Serinter, luke2012, Ed Brown and 10 others like this.
  2. Erel

    Erel Administrator Staff Member Licensed User

    Code updated.

    B4XCanvas.Release should be called when the canvas is no longer required.
     
  3. NJDude

    NJDude Expert Licensed User

    I don't understand this
    Code:
    'xui is a global XUI variable.
    xui is declared as what?
     
  4. stevel05

    stevel05 Expert Licensed User

  5. NJDude

    NJDude Expert Licensed User

    Well, I've read that, but then again that "xui" variable, what goes there?, in this line:
    Code:
    Dim xview As B4XView = xui.CreatePanel("")
    I get: "Undeclared variable xui", what am I missing? you declare that variable as what? that's my question.
     
  6. stevel05

    stevel05 Expert Licensed User

    If you have the library loaded you should have an Xui Class. So it would be Dim Xui As XUI
     
    Erel likes this.
  7. NJDude

    NJDude Expert Licensed User

    Ooooooohhh! I see, well, wasn't clear enough for me.

    I need a larger beer :D

    Thanks.
     
    KMatle and stevel05 like this.
  8. DonManfred

    DonManfred Expert Licensed User

    Try it without a beer :)
     
  9. NJDude

    NJDude Expert Licensed User

    Hell no!! it's the weekend, a beer is must.
     
    DonManfred likes this.
  10. Emme Developer

    Emme Developer Active Member Licensed User

    Sorry, maybe i don't understand something, but when i try this code i get an error on line:
    Code:
    Dim xview As B4XView = xui.CreatePanel("")
    Code:
    *** Service (starter) Create ***
    ** 
    Service (starter) Start **
    ** 
    Activity (main) Create, isFirst = true **
    ~w:
    1004,main,40
    ** 
    Activity (main) Resume **
    *** 
    Service (httputils2service) Create ***
    ** 
    Service (httputils2service) Start **
    ** 
    Activity (main) Pause, UserClosed = false **
    ** 
    Activity (presenter) Create, isFirst = true **
    ~w:
    1004,presenter,81
    ** 
    Activity (presenter) Resume **
    Presenter: Data refreshed
    AdminService: Twitter data received
    Presenter: Data refreshed
    utils_createroundbitmap (B4A line: 
    64)
    Dim xview As B4XView = xui.CreatePanel("")
    java.lang.NullPointerException: Attempt 
    to invoke virtual method 'java.lang.Object java.lang.ref.Reference.get()' on a null object reference
        at anywheresoftware.b4a.objects.B4XViewWrapper$XUI.CreatePanel(B4XViewWrapper.java:556)
        at b4a.example.utils._createroundbitmap(utils.java:
    160)
        at b4a.example.starter$ResumableSub_ShowCircleImage.resume(starter.java:
    952)
        at anywheresoftware.b4a.BA.checkAndRunWaitForEvent(BA.java:
    240)
        at anywheresoftware.b4a.BA.raiseEvent2(BA.java:
    180)
        at anywheresoftware.b4a.keywords.Common$
    11.run(Common.java:1151)
        at android.os.Handler.handleCallback(Handler.java:
    751)
        at android.os.Handler.dispatchMessage(Handler.java:
    95)
        at android.os.Looper.loop(Looper.java:
    154)
        at android.app.ActivityThread.main(ActivityThread.java:
    6776)
        at java.lang.reflect.Method.invoke(Native Method)
        at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:
    1520)
        at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:
    1410)
    utils_createroundbitmap (B4A line: 
    64)
    Dim xview As B4XView = xui.CreatePanel("")
    java.lang.NullPointerException: Attempt 
    to invoke virtual method 'java.lang.Object java.lang.ref.Reference.get()' on a null object reference
        at anywheresoftware.b4a.objects.B4XViewWrapper$XUI.CreatePanel(B4XViewWrapper.java:556)
        at b4a.example.utils._createroundbitmap(utils.java:
    160)
        at b4a.example.starter$ResumableSub_ShowCircleImage.resume(starter.java:
    952)
        at anywheresoftware.b4a.BA.checkAndRunWaitForEvent(BA.java:
    240)
        at anywheresoftware.b4a.BA.raiseEvent2(BA.java:
    180)
        at anywheresoftware.b4a.keywords.Common$
    11.run(Common.java:1151)
        at android.os.Handler.handleCallback(Handler.java:
    751)
        at android.os.Handler.dispatchMessage(Handler.java:
    95)
        at anywheresoftware.b4a.Msgbox.waitForMessage(
    Msgbox.java:231)
        at anywheresoftware.b4a.Msgbox.debugWait(
    Msgbox.java:190)
        at anywheresoftware.b4a.debug.Debug.wait(Debug.java:
    216)
        at anywheresoftware.b4a.debug.Debug.reachBP(Debug.java:
    362)
        at anywheresoftware.b4a.debug.Debug.ErrorCaught(Debug.java:
    148)
        at b4a.example.utils._createroundbitmap(utils.java:
    200)
        at b4a.example.starter$ResumableSub_ShowCircleImage.resume(starter.java:
    952)
        at anywheresoftware.b4a.BA.checkAndRunWaitForEvent(BA.java:
    240)
        at anywheresoftware.b4a.BA.raiseEvent2(BA.java:
    180)
        at anywheresoftware.b4a.keywords.Common$
    11.run(Common.java:1151)
        at android.os.Handler.handleCallback(Handler.java:
    751)
        at android.os.Handler.dispatchMessage(Handler.java:
    95)
        at android.os.Looper.loop(Looper.java:
    154)
        at android.app.ActivityThread.main(ActivityThread.java:
    6776)
        at java.lang.reflect.Method.invoke(Native Method)
        at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:
    1520)
        at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:
    1410)
    java.lang.RuntimeException: java.lang.RuntimeException: java.lang.NullPointerException: Attempt 
    to invoke virtual method 'java.lang.Object java.lang.ref.Reference.get()' on a null object reference
        at anywheresoftware.b4a.keywords.Common$11.run(Common.java:1154)
        at android.os.Handler.handleCallback(Handler.java:
    751)
        at android.os.Handler.dispatchMessage(Handler.java:
    95)
        at android.os.Looper.loop(Looper.java:
    154)
        at android.app.ActivityThread.main(ActivityThread.java:
    6776)
        at java.lang.reflect.Method.invoke(Native Method)
        at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:
    1520)
        at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:
    1410)
    Caused by: java.lang.RuntimeException: java.lang.NullPointerException: Attempt 
    to invoke virtual method 'java.lang.Object java.lang.ref.Reference.get()' on a null object reference
        at anywheresoftware.b4a.BA.raiseEvent2(BA.java:223)
        at anywheresoftware.b4a.keywords.Common$
    11.run(Common.java:1151)
        ... 
    7 more
    Caused by: java.lang.NullPointerException: Attempt 
    to invoke virtual method 'java.lang.Object java.lang.ref.Reference.get()' on a null object reference
        at anywheresoftware.b4a.objects.B4XViewWrapper$XUI.CreatePanel(B4XViewWrapper.java:556)
        at b4a.example.utils._createroundbitmap(utils.java:
    160)
        at b4a.example.starter$ResumableSub_ShowCircleImage.resume(starter.java:
    952)
        at anywheresoftware.b4a.BA.checkAndRunWaitForEvent(BA.java:
    240)
        at anywheresoftware.b4a.BA.raiseEvent2(BA.java:
    180)
        ... 
    8 more
    *** 
    Service (starter) Create ***
    ** 
    Service (starter) Start **
    ** 
    Activity (main) Create, isFirst = true **
    ~w:
    1004,main,40
    ** 
    Activity (main) Resume **
     
  11. Erel

    Erel Administrator Staff Member Licensed User

    You cannot call this code from a service context. Only from an Activity context. It can be in a code module but you can only call the sub from an Activity.
     
    Emme Developer likes this.
  12. Emme Developer

    Emme Developer Active Member Licensed User

    Ok thanks, tried in activity and it works. Is that wrote somewhere and i misread?
     
  13. Erel

    Erel Administrator Staff Member Licensed User

    It was missing. Will be added to XUI.CreatePanel.
     
    Emme Developer likes this.
  14. dieterp

    dieterp Active Member Licensed User

    I am trying to use the above example in a B4J project. When I run the line of code below I get an error "Object should first be initialized (B4XView)"

    Code:
    ImageView1.SetBitmap(CreateRoundBitmap(img, ImageView1.Width))
    How do I Initialize the ImageView1 object?
     
  15. Erel

    Erel Administrator Staff Member Licensed User

    It is up to you. What do you want to do with the round bitmap?
     
  16. dieterp

    dieterp Active Member Licensed User

    As a start i just want to see how the canvas stuff works in B4J. I have successfully implemented the imaging functions in the B4A and B4I apps, I was hoping this part would be an easy port but it looks like it might be a bit trickier.

    To summarize, I have an image that I want to be able to draw lines over. When I slide my finger on the screen of a smartphone that line then follows my finger. I achieve that in B4A and B4I using pnlxxx_Touch (Action As Int, X As Float, Y As Float). How would this be handled in a B4J pane? I also have functionality that when you click a 'Rotate' button, it rotates the image 90 degrees every time you click it.
     
  17. Erel

    Erel Administrator Staff Member Licensed User

    The "usage example" code snippet shows you how you can use the round bitmap. It has nothing to do with the drawing.

    You should start a new thread for this. Note that B4XCanvas is identical in B4A, B4i and B4J.
     
  18. dieterp

    dieterp Active Member Licensed User

    Thanks Erel. Let me play around with this a bit more and try wrap my head around it. I'll start a new thread if I can't get that going
     
  19. klaus

    klaus Expert Licensed User

    In B4J you need to handle the drawing in the Mouse_Pressed and Mouse_Moved event routines.
    There is no Touch event in B4J.
     
Loading...