Android Example My CustomView template - with AddToParent

I think CustomViews are great addition to B4A, one of it's best features, and a fantastic way to increase productivity, reuse code, and add intelligence to the views we use.

The ability to add CustomViews in the designer is of great help.

But we often need to add a CustomView by code. I had a hard time trying to figure out how to do this by searching the forum. But I did it. So, I want to share this with others like me. I hope it helps someone.

I created a basic template to start my CustomViews that makes the process easier for me.

First I add a new project module, class, customview, and assign the name I want for the view. Ex: MyView.

Then, I erase all the default template and copy this code below to the custom view class.

You are ready to go!

Your CustomView is now working, but it does nothing. You can add it in the designer or by code to your layout.

Now you need to change the code as you want. Add your views to the base panel, add your subs, methods, event handlers, the features and the intelligence you need to your view.

Don´t be afraid to try, and feel free to ask.

Sub Class_Globals
    'don´t modify these lines
    Private EventName As String 
    Private CallBack As Object 
    Private mBase As Panel
    Private Parent As Panel
    Private MyActivity As Activity

    'Your global definitions goes here
    Dim bt1 As Button 'example
End Sub

'Don´t modify these lines
'Initialize Custom View - Used by Designer and by code via AddToParent
Public Sub Initialize (vCallback As Object, vEventName As String)
    CallBack = vCallback
    EventName = vEventName
End Sub

'Don't modify these lines - used by the Designer
Public Sub DesignerCreateView (Base As Panel, Lbl As Label, Props As Map)
    mBase = Base
    Parent = mBase.Parent
End Sub

'Don´t modify these lines - returns the base panel
Public Sub GetBase As Panel
    Return mBase
End Sub

'Don't modify these lines - used to add the CustomView by code
'use in your code: 
'    Dim MyView1 as MyView     '(MyView is the name of your CustomView)
'    Initialize(Me,"MyView1")
'    MyView1.AddToParent(Activity,0,0,width,height)
Public Sub AddToParent(vActivity As Activity, Left As Int, Top As Int, Width As Int, Height As Int)
    MyActivity = vActivity
    MyActivity.AddView(mBase,Left, Top, Width, Height)
End Sub

'Create your Custom View here
'Add your views to the base panel - mBase
Public Sub CreateView
    'example view code 
    mBase.Color = Colors.Transparent
End Sub

'add your subs, methods and event handlers here

Sub bt1_click 'example
    'these lines calls the activity sub to handle the event
    'you can change the string "_click" to the evennt you want
    'EventName will be changed to the name of the view in the designer
    'or to the name in Initialize - vEventName
    'if you want to pass data to the sub use Callsub2 or Callsub3
    If SubExists(CallBack,EventName & "_click") Then
        CallSub(CallBack,EventName & "_click")
    End If
End Sub

#region getters and setters

'CustomView basic dimensions
Sub getTop As Int
    Return mBase.Top
End Sub

Sub setTop(n As Int)
    mBase.Top = n 
End Sub

Sub getLeft As Int
    Return mBase.Left
End Sub

Sub setLeft(n As Int)
    mBase.Left = n 
End Sub

Sub getWidth As Int
    Return mBase.width
End Sub

Sub setWidth(n As Int)
    mBase.width = n 
End Sub

Sub getHeight As Int
    Return mBase.Height
End Sub

Sub setHeight(n As Int)
    mBase.Height = n 
End Sub

#end region


Licensed User
You should have had a look at the User's Guide.
Chapter 12.4 Custom views and more specific chapter 12.4.2 Adding a custom view by code.