Android Question [B4X] [SOLVED] xCustomListView Text Padding question

Andrew (Digitwell)

Well-Known Member
Licensed User
Longtime User
I'm using a customlistview to display formatted text using clv.AddTextItem
I use clv.getPanel to set the background to white.

1625748738734.png


The problem is that that the text is too close to the edges. Does anyone known a simple way to add some more padding to this text
I can add space to the top and button with blank lines but the left and right are the problems.

I could add a custom layout with a label, but then I would have to manage the height of the panel.

Thanks
 

Mahares

Expert
Licensed User
Longtime User
Does anyone known a simple way to add some more padding to this text
Maybe something like this:
B4X:
Dim j As Int
    For Each s As String In MyList
        clv1.AddTextItem(s, s)
        Dim Panel As B4XView = clv1.GetPanel(j)
        Dim lbl As B4XView =Panel.GetView(0)
        setPadding(lbl, 10, 10, 20, 5)
        j=j+1
    Next
Sub setPadding(v As View, Left As Int, Top As Int, Right As Int, Bottom As Int)
    Dim jo = v As JavaObject
    jo.RunMethod("setPadding", Array As Object(Left, Top, Right, Bottom))
End Sub
 
Upvote 0

Mahares

Expert
Licensed User
Longtime User
This creating padding but text is trimmed from below as panel height is not increased.
Hi Anand: The OP seems to have more trouble with the right and left padding, because he can add a blank line to the top and bottom, so something like this would work
B4X:
Dim j As Int
    For Each s As String In MyList
        clv1.AddTextItem(s, s)
        Dim Panel As B4XView = clv1.GetPanel(j)
        Dim lbl As B4XView =Panel.GetView(0)
        setPadding(lbl, 10dip, 0dip, 20dip, 0dip)
        j=j+1
    Next
 
Upvote 0

Alexander Stolte

Expert
Licensed User
Longtime User
The problem is that that the text is too close to the edges. Does anyone known a simple way to add some more padding to this text
not tested, but it should work.
B4X:
Dim xlbl_text as B4XView = CustomListView1.GetPanel(Index).GetView(0)
xlbl_text.Left = 5dip
xlbl_text.Width = xlbl_text.Width - 10dip
 
Upvote 0

AnandGupta

Expert
Licensed User
Longtime User
Hi Anand: The OP seems to have more trouble with the right and left padding, because he can add a blank line to the top and bottom, so something like this would work
Yes agree, no argument here.
Using extra blank lines gives top/bottom gap but a bit more than desired few dips.
p1.png

not tested, but it should work.
Your code works and result is as below,
p2.png

I was wondering, since we can adjust the label, can we not also adjust the panel height ?
I tried below but it did not work
B4X:
Panel.Height = Panel.Height + 20

Maybe some more code required for it.
 
Upvote 0

AnandGupta

Expert
Licensed User
Longtime User
not tested, but it should work.
Btw if there are longer text then the bottom text are cut off, see image (last line is " like Aldus PageMaker including versions of Lorem Ipsum. ")
p3.png

So I was thinking if we could also increase the panel height, then it may solve it.
 
Upvote 0

AnandGupta

Expert
Licensed User
Longtime User
Got it,

B4X:
CustomListView1.ResizeItem(0, Panel.Height + 15dip)

Hope this may help someone.
 
Upvote 0

Andrew (Digitwell)

Well-Known Member
Licensed User
Longtime User
Hi All,
Sorry been away for the weekend, your solutions work for Android, however I was looking for something cross platform, hence B4X in the title.

I found this on the forum:


So it looks like I will have to use a custom view instead.

I will add a wish.

Thanks for all your input.
 
Upvote 0

Alexander Stolte

Expert
Licensed User
Longtime User
So it looks like I will have to use a custom view instead.
thats easy.
  1. put a label on a form
  2. create a panel and load the form with the label on it
  3. calculate the height from the text
  4. resize the panel and the label
  5. add the panel to the xclv
 
Upvote 0

Alexander Stolte

Expert
Licensed User
Longtime User
calculate the height from the text
i'm using this code in some projects, to calculate the height of text.
It's important to add a gap from 2-4dip to the height.
 
Upvote 0

Andrew (Digitwell)

Well-Known Member
Licensed User
Longtime User
Got it working.

Created a custom view. Used the sizing code from xCustomListView. Bit rough and ready but does what I need.

1626094584438.png


ResizingTextComponent:
#DesignerProperty: Key: TextColor, DisplayName: Name Color, FieldType: Color, DefaultValue: 0xFF000000, Description: Text Colour
#DesignerProperty: Key: BackColor, DisplayName: Background Color, FieldType: Color, DefaultValue: 0xFFFFFFFF, Description: Background Color

Sub Class_Globals
    Private mEventName As String 'ignore
    Private mCallBack As Object 'ignore
    Public mBase As B4XView
    Private xui As XUI 'ignore
    Public Tag As Object
    
    Private tclr As Int
    Private bclr As Int
    Private mcorn As Int
    Private txt As Object
    Private tfnt As B4XFont

    Private lpad As Int
    Private rpad As Int
    Private tpad As Int
    Private bpad As Int

    Private mlbl As B4XView
    
End Sub

Public Sub Initialize (Callback As Object, EventName As String)
    mEventName = EventName
    mCallBack = Callback
End Sub

'Base type must be Object
Public Sub DesignerCreateView (Base As Object, lbl As Label, Props As Map)
    mBase = Base
    Tag = mBase.Tag
    mBase.Tag = Me
    mBase.Color = Colors.Transparent
    
    tclr = xui.PaintOrColorToColor(Props.Get("TextColor"))
    bclr = xui.PaintOrColorToColor(Props.Get("BackColor"))
    #if b4a
    tfnt = xui.CreateFont(lbl.Typeface,lbl.textsize)
    #else   
    tfnt = lbl.Font
    #End If

    txt  = ""
    
    lpad = 10dip
    rpad = 10dip
    tpad = 10dip
    bpad = 10dip
    mcorn = 0
    
    Private llbl As Label
    
    llbl.Initialize("lbl")
    #if b4i
    llbl.Multiline = True
    #end if   
    mlbl = llbl
    
    mBase.AddView(mlbl,lpad,tpad,mBase.Width-(lpad+rpad),mBase.Height-(tpad+bpad))
    
End Sub

Private Sub Base_Resize (Width As Double, Height As Double)
    mlbl.SetLayoutAnimated(0,lpad,tpad,mBase.Width-(lpad+rpad),mBase.Height-(tpad+bpad))
    draw
End Sub


public Sub setText(t As Object)
    txt = t
    draw
End Sub

public Sub setTextColor(clr As Int)
    tclr = clr
    draw
End Sub

public Sub SetBackColor(clr As Int)
    bclr = clr
    draw
End Sub


public Sub SetTextFont(fnt As B4XFont)
    tfnt = fnt
    draw
End Sub

public Sub SetPadding(l As Int, t As Int, r As Int, b As Int)
    lpad = l
    tpad = t
    rpad = r
    bpad = b
    draw
End Sub

public Sub SetCorners(c As Int)
    mcorn = c
    draw
End Sub

public Sub GetHeight As Int
    Return GetPerfectHeight
End Sub

private Sub draw
    If (mBase.IsInitialized And mlbl.IsInitialized) Then
        mBase.SetColorAndBorder(bclr,0dip,Colors.Transparent,mcorn)
        
        mBase.SetLayoutAnimated(0,0,0,mBase.Width,GetPerfectHeight)
        mlbl.SetLayoutAnimated(0,lpad,tpad,mBase.Width-(lpad+rpad),mBase.Height-(tpad+bpad))
    
        mlbl.Font = tfnt       
        mlbl.TextColor = tclr
        mlbl.Color = bclr
    
        XUIViewsUtils.SetTextOrCSBuilderToLabel(mlbl,txt)
        
    End If
End Sub



public Sub GetPerfectHeight As Int
    
    If mlbl.IsInitialized Then
        Private h As Int = (MeasureMultiTextHeight(mlbl, mBase.Width-(lpad+rpad), txt) + tpad + bpad)
'        Log("perfect height = "&h)
        Return h
    End If
'    Log("imperfect height = "&mBase.Height)
    Return mBase.Height
End Sub

Public Sub MeasureMultiTextHeight(lbl As Label, width As Int, text As Object) As Int
    #if b4a
    Private su As StringUtils
    Return su.MeasureMultilineTextHeight(lbl, text)
    #else if b4i
    Dim plbl As Label
    plbl.Initialize("")
    plbl.Width = width
    plbl.Multiline = True
    XUIViewsUtils.SetTextOrCSBuilderToLabel(plbl,text)
    plbl.SizeToFit   
    Return plbl.Height
    #End If
    
End Sub
 
Upvote 0
Top