B4J Question [ABMaterial] Button align left

[mcGeorge]

Hi, I hope it is simple. I have the following code:

' create the grid for the footer
' we add a row without the default 20px padding so we need to use AddRowsM().  If we do not use this method, a scrollbar will appear to the sheet.
    myModal.Footer.AddRowsM( 1, True, 0, 0, "" ).AddCellsOS( 2, 0, 0, 0, 6, 6, 6, "" )
    myModal.Footer.BuildGrid 'IMPORTANT once you loaded the complete grid AND before you start adding components
    
    ' create the password button for the footer
    Dim msbtn2 As ABMButton
    msbtn2.InitializeFlat(AppPage, "msbtn2", "", "", "Password", "transparent")
    myModal.Footer.Cell(1,1).AddComponent(msbtn2)
    
    ' create the login button for the footer
    Dim msbtn1 As ABMButton
    msbtn1.InitializeFlat(AppPage, "msbtn1", "", "", "Login", "transparent")
    myModal.Footer.Cell(1,2).AddComponent(msbtn1)

The result is, the button msbtn1/Login is on the right side and the msbtn2/Password is in the middle of this dialog.

But I want the msbtn2/Password on the left side. How can I change the align of the content of Cell( 1,1 ) to the left?
I tried to do this with: theme.Cell("CellLeft").Align = ABM.CELL_ALIGN_LEFT
But this changed noting!

Thanks.

 

[Mashiane]

Have you tried to swap the locations, e.g. password @ R1C2 and login @ R1C1 perhaps that could work. #notTested

 

[alwaysbusy]

Note that you do not use your theme in your grid definition:

.AddCellsOS( 2, 0, 0, 0, 6, 6, 6, "" )

maybe it shoud've been:

.AddCellsOS( 1, 0, 0, 0, 6, 6, 6, "CellLeft" ).AddCellsOS( 1, 0, 0, 0, 6, 6, 6, "" )

 

[mcGeorge]

I tested it and it changed nothing! Maybe I did some wrong?

BuildTheme()
    ' add additional themes specific for this page
    theme.AddCellTheme("CellLeft")
    theme.Cell("CellLeft").Align = ABM.CELL_ALIGN_LEFT
    theme.Cell("CellLeft").BorderColor = ABM.COLOR_BLACK
    theme.Cell("CellLeft").BorderWidth = 1

and

BuildLoginSheet()
    myModal.Footer.AddRowsM( 1, True, 0, 0, "CellLeft" ).AddCellsOS( 1, 0, 0, 0, 6, 6, 6, "CellLeft" ).AddCellsOS( 1, 0, 0, 0, 6, 6, 6, "" )
    myModal.Footer.BuildGrid 'IMPORTANT once you loaded the complete grid AND before you start adding components
  
    ' create the password button for the footer
    Dim msbtn2 As ABMButton
    msbtn2.InitializeFlat(AppPage, "msbtn2", "", "", "Reset Password", "ButtonTest")
    myModal.Footer.Cell(1,1).AddComponent(msbtn2)
  
    ' create the login button for the footer
    Dim msbtn1 As ABMButton
    msbtn1.InitializeFlat(AppPage, "msbtn1", "", "", "Login", "transparent")
    myModal.Footer.Cell(1,2).AddComponent(msbtn1)

the result

you see, the button is still at the right side.

 

[Mashiane]

Perhaps after initializing each button, you can try

msbtn2.UseFullCellWidth = True also msbtn1.UseFullCellWidth = True

these will use the whole cell area for the buttons

or either force it with

myModal.Footer.Cell(1,1).UseTheme("CellLeft")

#notTested

 

[alwaysbusy]

I've checked and it appears the aligning of buttons are hardcoded into the Materialize CSS framework for Modal Sheets. If you add it as a wish into the feedback app, I'll have a look if I can override this.

 

[alwaysbusy]

Because of a weird construction in the Materialize CSS framework (actually following Google Guidelines, but still), buttons in the footer are always on the right. I can not change it without breaking existing code so I was forced to create a special property on the button to override this setting. I don't like it either, but it is the only way to do it I'm afraid :-(

msbtn1.ModalFooterForceLeft = True