Android Question How to set only top or bottom border

Stefano Di Chiano

Active Member
Licensed User
Hi,
I'm have to display a few buttons close to each other and separated only by a white line like in the following picture:
image.png

Since originally the buttons where only five, I set a border on the second and fourth and set their width to 102%x so that the left and right borders wouldn't show, but now that I have to add another button I can't use this method anymore.
Therefore I'm looking for a way to set only the top/bottom border on buttons or a tip on how to show a white line like those in the picture.
Can anyone help me with this?
 

IdasI4A

Active Member
Licensed User
Longtime User
You could use CustomListView.
B4X:
    Dim Nombres() As String
    Dim i As Int
    
    Nombres=Array As String("PROFILO","STORICO BUDNI","IMPOSTAZIONI","TUTORIAL/HELP","FAQ")
    CLV1.AsView.Height=Nombres.Length*60dip+(Nombres.Length-1)*CLV1.DividerSize
    For i=0 To Nombres.Length-1
        Dim Pn As B4XView=xui.CreatePanel("")
        Pn.SetLayoutAnimated(0,0,0,CLV1.AsView.Width,60dip)
        Pn.LoadLayout("lyBoton")
        Pn.Color=Colors.White
        Dim Lbl As B4XView=Pn.GetView(0)
        Lbl.Text=Nombres(i)
        CLV1.Add(Pn,i)
    Next

Muestra.png
 
Upvote 0

Stefano Di Chiano

Active Member
Licensed User
Hi, thanks for helping.
The code you wrote gives me an error on the line:
B4X:
Dim Lbl As B4XView = Pn.GetView(0)
The error says: "Object should first be initialized(View)", but I don't see any Initialize function.
What should I do?
 
Upvote 0

Stefano Di Chiano

Active Member
Licensed User
Now the list is showing and working, thanks.
Is there a way to not show the divider on the top and bottom of the list?
I know it is an annoying detail, but these are customer requests.
 
Upvote 0

IdasI4A

Active Member
Licensed User
Longtime User
You can do it on a panel instead of with a CustomListview. For example:

B4X:
private Sub sbHazBotones2
    Dim Nombres() As String
    Dim i, Y, Alto, Separacion As Int
    
    Alto=60dip
    Separacion=2dip
    Nombres=Array As String("PROFILO","STORICO BUDNI","IMPOSTAZIONI","TUTORIAL/HELP","FAQ")
    pnBotones.Height=Nombres.Length*Alto+(Nombres.Length-1)*Separacion
    pnBotones.Color=Colors.Transparent
    Y=0
    For i=0 To Nombres.Length-1
        Dim Pn As B4XView=xui.CreatePanel("pnBoton")
        pnBotones.AddView(Pn,0,Y,pnBotones.Width,Alto)
        Pn.Tag=Nombres(i)
        Y=Y+Alto+Separacion
        Pn.LoadLayout("lyBoton")
        Pn.Color=Colors.White
        Dim Lbl As B4XView=Pn.GetView(0)
        Lbl.Text=Nombres(i)
    Next
End Sub

Sub pnBoton_Click
    Dim Pn As Panel
    Pn=Sender
    Log(Pn.Tag)
End Sub
 
Upvote 0

Mahares

Expert
Licensed User
Longtime User
You can do it on a panel instead of with a CustomListview
I like your customlistview option. If the OP does not want to show the divider lines between the items, it is as simple as changing the color of the divider in the customlistview layout to transparent.
Is there a way to not show the divider on the top and bottom of the list?
I am still not clear if the OP prefers not to show any divider lines at all or if he wants to show them all except the 2 divider lines on top of the first item and the divider line on the bottom of the last item in the list.
 
Upvote 0

Mahares

Expert
Licensed User
Longtime User
Exactly like this. All divider lines except for the top one of the first item and bottom one of the last item.
Ok. Then in that case, the panel approach @IdasI4A gave you in post #6 will work if you add the lines I added to the loop code. See below loop with my code inserted:
B4X:
For i=0 To Nombres.Length-1
        Dim pn As B4XView=xui.CreatePanel("pnBoton")
        pnBotones.AddView(pn,0,Y,pnBotones.Width,Alto)
        pn.Tag=Nombres(i)
        Y=Y+Alto+Separacion
        pn.LoadLayout("lyBoton")
        
        'Below 7 lines addedd by Mahares
        Dim divider As B4XView=xui.CreatePanel("")
        pn.AddView(divider, 0,pn.Height-5dip,pnBotones.Width,5dip)
        If i=Nombres.Length-1 Then
            divider.Color=xui.Color_Transparent
        Else
            divider.Color=xui.Color_Black
        End If
        
        pn.Color=Colors.White
        Dim Lbl As B4XView=pn.GetView(0)
        Lbl.Text=Nombres(i)
    Next
 
Upvote 0

IdasI4A

Active Member
Licensed User
Longtime User
The lines added by Mahares, are really not necessary.
Try changing the panel colour (pnBotones.Color=Colors.Blue for example) and changing the Separacion value (e.g. Separacion=10dip)
 
Upvote 0

Mahares

Expert
Licensed User
Longtime User
The lines added by Mahares, are really not necessary.
I would not use the word 'not necessary', It is more tactful if you refer to your approach as 'an alternative or another way to do it'. Actually as a third alternative, without changing the color of pnBotones or Separacion value , you can simply make the color of the parent activity of pnBotones black.
 
Upvote 0
Top