B4J Tutorial [ABMaterial] Creating a color grid container

Mashiane

Expert
Licensed User
Ola

ColorGrid.png


Some thoughts are running in my head about implementing this for my color coded events management. So we have 21 colors. So me thinks a 7 row, 3 columns grid will do.

B4X:
Sub ColorGrid(page As ABMPage, id As String) As ABMContainer
    Dim ItemCont As ABMContainer
    ItemCont.Initialize(page, id, "")
    ItemCont.AddRowsM(7,True,10,10, "").AddCellsOSMP(3,0,0,0,4,4,4,0,0,0,0,"")
    ItemCont.BuildGrid 'IMPORTANT once you loaded the complete grid AND before you start adding components
   
    Dim cols As List = CreateList(",","Amber,Black,Blue,Blue Grey,Brown,Cyan,Deep Orange,Deep Purple,Green,Grey,Indigo,Light Blue,Light Green,Lime,Orange,Pink,Purple,Red,Teal,White,Yellow")
    cols.Sort(True)
   
    Dim lstTot As Int
    Dim lstCnt As Int = 0
    Dim r As Int = 1
    Dim c As Int = 0
    lstTot = cols.Size - 1
    For lstCnt = 0 To lstTot
        c = c + 1
        If c > 3 Then
            c = 1
            r = r + 1
        End If
        Dim strColor As String = cols.Get(lstCnt)
        Dim strKey As String = strColor.Replace(" ","").tolowercase
        Dim strTheme As String = $"all${strKey}"$
       
        'add the button
        Dim btn As ABMButton
        btn.InitializeFloating(page,strTheme,"",strTheme)
        btn.Size = ABM.BUTTONSIZE_LARGE
        ItemCont.Cell(r,c).AddArrayComponent(btn,"colorPallete")
        ItemCont.Cell(r,c).UseTheme("centercontent")
    Next
    Return ItemCont
End Sub
I decide to use buttons because I need to trap the click event, so the background color and forecolor of each of the buttons needs to be a color, so each of the button themes follow this approach..

B4X:
MyTheme.AddButtonTheme("allindigo")
    MyTheme.Button("allindigo").zdepth = ABM.ZDEPTH_1
    MyTheme.Button("allindigo").forecolor = ABM.COLOR_INDIGO
    MyTheme.Button("allindigo").backcolor = ABM.COLOR_INDIGO
Ta!
 

Mashiane

Expert
Licensed User
You can however decide that you want a combobox color picker. Tweak away!!!

colorcombo.png


B4X:
Sub LoadColors(pg As ABMPage, abmc As ABMCombo)
    abmc.Clear
    Dim cols As List = CreateList(",","Amber,Black,Blue,Blue Grey,Brown,Cyan,Deep Orange,Deep Purple,Green,Grey,Indigo,Light Blue,Light Green,Lime,Orange,Pink,Purple,Red,Teal,White,Yellow")
    cols.Sort(True)
    For Each strColor As String In cols
        Dim strKey As String = strColor.Replace(" ","").tolowercase
        Dim strTheme As String = $"all${strKey}"$
        abmc.AddItem(strKey,strColor,BuildColorItem(pg,strKey,strColor,strTheme))
    Next
    abmc.Refresh
End Sub

Sub BuildColorItem(page As ABMPage, id As String, Title As String, theme As String) As ABMContainer
    Dim ItemCont As ABMContainer
    ItemCont.Initialize(page, id, "")
    ItemCont.AddRowsM(1,False,6,0, "").AddCellsOSMP(1,0,0,0,3,2,2,0,0,20,0,"").AddCellsOS(1,0,0,0,9,10,10,"")
    ItemCont.BuildGrid 'IMPORTANT once you loaded the complete grid AND before you start adding components
    
    Dim btn As ABMButton
    btn.InitializeFloating(page,id & "btn","",theme)
    ItemCont.Cell(1,1).AddComponent(btn)
    ItemCont.Cell(1,1).SetFixedHeight(48,False)
        
    Dim lbl1 As ABMLabel
    lbl1.Initialize(page, id & "lbl1", Title, ABM.SIZE_H6, False, "")   
    ItemCont.Cell(1,2).AddComponent(lbl1)   
    Return ItemCont
End Sub
 
Top