B4J Question [ABMaterial] ABMInput Formatting & Row Space Height?

[Mashiane]

Hi there

1. How do I format the ABMInput text to be bold and or italic?

Using {B}{/B} does not seem to help?

2. How do I decrease the space between rows? (see screen dump below) Is that possible? NB: This is not a table but elements per row and column.

 

[mindful]

@Mashiane you can decrease the space between rows using :

AddRowsM (numberOfRows As Int, centerInRow As Boolean, marginTopPx As Int, marginBottomPx As Int, themeName As String)

This method gives you the option to specify the top and bottom margins!

 

[alwaysbusy]

Indeed, and if this ultimately is not enough, you can override all padding/margins on a row and cell with:

page.row(1).PaddingLeft
page.row(1).PaddingRight
page.row(1).PaddingTop
page.row(1).PaddingBottom
page.row(1).MarginTop
page.row(1).MarginBottom
page.row(1).MarginLeft
page.row(1).MarginRight

page.cell(1,1).PaddingLeft
page.cell(1,1).PaddingRight
page.cell(1,1).PaddingTop
page.cell(1,1).PaddingBottom
page.cell(1,1).MarginTop
page.cell(1,1).MarginBottom
page.cell(1,1).MarginLeft
page.cell(1,1).MarginRight

Note: here we're talking about strings, so you have to use stuff like '20px' or '2rem' or 'auto' (some css knowledge is required)

 

[Mashiane]

Brilliant, thanks @mindful

Now just for the bold/italic on the ABMInput, hopefully that can be done somehow...

 

[Mashiane]

Wow @alwaysbusy , will use that someday... perhaps soon. Ta!

 

[alwaysbusy]

bold/italic

Add it as a wish to the feedback app so I can add it to the InputTheme.

You can try to do it manually, but it is very tricky to get it just right at the right place. Especially using the right internal ID.

e.g. an input in a Modalsheet can have the ID 'executors1excode' but you have to use the 'internal' ID (which in chrome you can see by using the Chrome Developer Tools, F12), in my example 'executors1-content-executors1excode'

ABM.SetStyleProperty(page, "executors1-content-executors1excode", "font-weight", "bold")
page.ws.Flush ' important

In my example, this has to hapen AFTER you open the modalsheet.

In 'Native' ABMaterial (as a build-in property in the Theme), you won't have to worry about those things as ABMaterial does take care of all this for you

 

[incendio]

I tried to used these codes

page.AddRowsM(1,True,0,0, "").AddCellsOS(2,0,0,0,12,6,6,"")
page.AddRowsM(3,True,0,0,"").AddCells12(1,"")

But the space between rows not small enough, so I tried this

page.AddRows(1,True,"").AddCellsOS(2,0,0,0,12,6,6,"")
page.row(1).MarginTop = "10px"
page.row(1).MarginBottom = "50px"

I didn't work, compiled OK, but error on browser : Unable to connect.

 

[alwaysbusy]

@incendio Make sure you do a BuildGrid() before you try to set a page.row().Margin... property

 

[incendio]

@incendio Make sure you do a BuildGrid() before you try to set a page.row().Margin... property

It worked, but these codes

page.BuildGrid 
page.row(1).MarginTop = "0px"
page.row(1).MarginBottom = "0px"

Gave the same result with

page.AddRowsM(1,True,0,0, "").AddCellsOS(2,0,0,0,12,6,6,"")

Seem that the space between rows can't be decreased again, is it true?

 

[alwaysbusy]

Yes that does the same. You may be able to decrease it a little bit with the addcellosmp() method, but yes that is probably the minimum as an input does take up space itself (eg room for the floating title)