B4J Question CustomListView B4A to B4J

[trueboss323]

I'm trying to convert a B4A code of CustomListView to work with B4J. I need help please how to convert this code

Sub CreateListItem(Text As String, Text2 As String, Width As Int, Height As Int, Image As Bitmap) As Panel

Dim p as Panel
Dim mycheckboxes as List
Dim chk as Checkbox

   p.Initialize("")
   p.Color = Colors.Black
   Dim img1 As ImageView
   img1.Initialize("img1")
   img1.Gravity = Gravity.FILL
   img1.Bitmap = Image
  
   chk.Initialize("chk")
   mycheckboxes.Add(chk)
  
   Dim title as Label
   title.Initialize("")
   title.Gravity = Bit.Or(Gravity.CENTER_VERTICAL, Gravity.LEFT)
   title.Text = Text
   title.TextSize = 16
   title.TextColor = Colors.White
   Dim subtitle As Label
   subtitle.Initialize("")
   subtitle.Gravity = Bit.Or(Gravity.CENTER_VERTICAL, Gravity.BOTTOM)
   subtitle.Text = Text2
   subtitle.TextSize = 14
   subtitle.TextColor = Colors.White
   p.AddView(img1, 2dip, 2dip, 50dip, Height - 4dip) 'view #0

   p.AddView(title, 65dip, -7dip, 300dip, Height - 4dip) 'view #1
   p.AddView(subtitle, 66dip, -2dip, 300dip,Height - 4dip) 'view #1
   p.AddView(chk, 88%x, 2dip, 50dip, Height - 4dip) 'view #2
  
   Return p

End Sub

And then use it with:

Dim clv as CustomListView
      clv.Add(CreateListItem("Title","Subtitle", clv.AsView.Width, 50dip, LoadBitmap(File.DirAssets, "image.png")), 50dip, "")

 

[Erel]

Cross platform CustomListView: [B4X] [XUI] xCustomListView - cross platform CustomListView

The best solution is to create a layout file for the items (with anchors) and load it for each item.

 

[Knoppi]

in my version I assume that Text2 is the description of checkbox

' Library: CSSUtils
Sub CreateListItem(Text As String, Text2 As String, Width As Int, Height As Int, Picture As Image) As Pane

    Dim p As Pane
    Dim mycheckboxes As List
    mycheckboxes.Initialize
    Dim chk As CheckBox

    p.Initialize("")
    CSSUtils.SetBackgroundColor( p, fx.Colors.Black)
    Dim img1 As ImageView
    img1.Initialize("img1")
    CSSUtils.SetStyleProperty( img1, "fx-background-position", "center center")
    img1.SetImage( Picture)
  
    chk.Initialize("chk")
    chk.Alignment = "BOTTOM_LEFT"
    chk.TextColor = fx.Colors.White
    chk.TextSize = 14
    chk.Text = Text2
    mycheckboxes.Add(chk)

    Dim title As Label
    title.Initialize("")
    title.Alignment = "CENTER_LEFT"
    title.Text = Text
    title.TextSize = 16
    title.TextColor = fx.Colors.White

'    Dim subtitle As Label
'    subtitle.Initialize("")
'    subtitle.Alignment = "BOTTOM_CENTER"
'    subtitle.Text = Text2
'    subtitle.TextSize = 14
'    subtitle.TextColor = fx.Colors.White
  
    p.AddNode( img1, 2dip, 2dip, 50dip, Height -4dip)
  
    p.AddNode( title, 65dip, -7dip, 300dip, Height - 4dip) 'view #1
    'p.AddNode( subtitle, 66dip, -2dip, 300dip, Height - 4dip) 'view #1
    p.AddNode( chk, Width * 0.88, 2dip, 300dip, Height - 4dip) 'view #2
    
    Return p
End Sub

 

[trueboss323]

Cross platform CustomListView: [B4X] [XUI] xCustomListView - cross platform CustomListView

The best solution is to create a layout file for the items (with anchors) and load it for each item.

I have that library but I'm just trying to figure out how to migrate code from my old B4A project to the new CustomListView

in my version I assume that Text2 is the description of checkbox

Both Text1 and Text2 are in the form of labels I believe. The end result should look like this:

 

[Knoppi]

' Library: CSSUtils
Sub CreateListItem(Text As String, Text2 As String, Width As Int, Height As Int, Picture As Image) As Pane

    Dim p As Pane
    Dim mycheckboxes As List
    mycheckboxes.Initialize
    Dim chk As CheckBox

    p.Initialize("")
    CSSUtils.SetBackgroundColor( p, fx.Colors.Black)
    Dim img1 As ImageView
    img1.Initialize("img1")
    CSSUtils.SetStyleProperty( img1, "fx-background-position", "center center")
    img1.SetImage( Picture)
  
    chk.Initialize("chk")
    mycheckboxes.Add(chk)

    Dim title As Label
    title.Initialize("")
    title.Alignment = "CENTER_LEFT"
    title.Text = Text
    title.TextSize = 16
    title.TextColor = fx.Colors.White

    Dim subtitle As Label
    subtitle.Initialize("")
    subtitle.Alignment = "BOTTOM_LEFT"
    subtitle.Text = Text2
    subtitle.TextSize = 12
    subtitle.TextColor = fx.Colors.White
  
    p.AddNode( img1, 2dip, 2dip, 50dip, Height -4dip)
  
    p.AddNode( title, 65dip, -7dip,  Width -65dip -50dip, Height - 4dip) 'view #1
    p.AddNode( subtitle, 65dip, -2dip, Width -65dip -50dip, Height - 4dip) 'view #1
    p.AddNode( chk, Width-50dip, 2dip, 50dip, Height - 4dip) 'view #2
  
    Return p
End Sub

 

[trueboss323]

The layout works correctly but when I try to add multiple items , the text is garbled and it doesn't make a new Pane below it as expected. What am i doing wrong?

 

[Erel]

I have that library but I'm just trying to figure out how to migrate code from my old B4A project to the new CustomListView

You can just replace the old CustomListView with the new one.

It is very simple to create the layout you want with the designer.

 

[Knoppi]

change this line

Dim p As Pane

to

Dim p As AnchorPane

i tested it with standard listview

Sub AppStart (Form1 As Form, Args() As String)
    MainForm = Form1
    MainForm.Show
   
    Dim lv As ListView
    lv.Initialize( "lv")
    MainForm.RootPane.AddNode( lv, 0, 0, 300dip, MainForm.Height)

    For i=0 To 9
        lv.Items.Add( CreateListItem( "Text1 - "&i, "Text2", 300dip, 75dip, fx.LoadImage( File.DirAssets, "b4a-200.png")))
    Next
End Sub

 

[trueboss323]

I managed to get it working. Thank you very much!