CoDriven Advanced UI documentation

Go back

CmRow

CmRow a container. It is based on VisualElement. You can add controls to it by using:

    CmButton someButton = new CmButton();
    //
    CmRow row = new CmRow();
    row.AddContent(someButton);

All controls added to CmRow will be displayed in column way. To change how added controls will be positioned you can use modifier:

    // create row somewhere
    CmRow row = new CmRow();
    row.SetStyle(GetTheme().ProfileNickNameRowStyle);

    ....

    // in your theme    
    public ICmControlModifiers ProfileNickNameRowStyle()
    {
        var modifiers = CmRow.GetModifiersBuilder();
        modifiers.Container(new CmModifierRow(CmSelector.DefaultState)
            .HorizontalArrangement(CmArrangement.CENTER)
            .VerticalAlignment(CmAlignment.CENTER)
            .WidthWrapContent()
            .FillMaxHeight()
        );
        return modifiers;
    }
  • HorizontalArrangement allow you to set how added controls to this container will be positioned horizontally. Available values: START, CENTER, END, SPACE_BETWEEN, SPACE_AROUND.
  • VerticalAlignment allow you to set how added controls to this container will be positioned vetrically. Available values: START, CENTER, END, STRETCH, TEXT_BASELINE STRETCH will stretch control to parent size vertically.

Style CmRow elements

CmRow modifiers contains only one element to style - the "Row"

    public class CmRowModifiers : ICmControlModifiers
    {
        public CmRowModifiers Container(CmModifierRow modifier)
    }

When you open UI Toolkit Debugger then you will see that Row is a container - so you will add elements to it.

the Visual element containing three buttons in below screen is a CmRow

button.png

Here is how you can style it

        public CmRow createRow()
        {
            CmRow row = new CmRow();
            row.SetStyle(GetTheme().StyleRow);

            return container;
        }


    // in your theme
    public override CmRowModifiers StyleRow()
    {
        var modifiers = CmRow.GetModifiersBuilder();
        modifiers.Column(new CmModifierColumn(CmSelector.DEFAULT_STATE)
            .HorizontalAlignment(CmAlignment.START)
            .VerticalArrangement(CmArrangement.SPACE_BETWEEN)
            .FillMaxWidth()
            .FillMaxHeight()
        );
        return modifiers;
    }

to learn about modifiers for all controls click here