ComponentOne Ribbon for WinForms
C1Ribbon (Classic) Task-Based Help / Lining Up Combo/Edit Boxes on a Group
In This Topic
    Lining Up Combo/Edit Boxes on a Group
    In This Topic

    You can line up text box parts of several combo/edit boxes vertically on a Ribbon group using the RibbonComboBox.RibbonComboBox.GapBeforeTextArea and RibbonTextBox. GapBeforeTextArea properties. This property specifies the gap (in pixels) between the label and text box parts of the element. The maximum allowable value for this property has been set to 80.

    To Line up Combo/Edit Boxes on a Group Using the Smart Designer and Properties Window

    Complete the following steps:

    1. Select the Ribbon group to enable the group's floating toolbar:
    2. Click the Actions drop-down button. This reveals a list of Ribbon items to add to the group.
    3. Select Add ComboBox and then Add EditBox from the list. This adds each item to the Ribbon group:

      Notice that the text box parts do not line up vertically. The next step shows how to specify the gap between the label and text box parts of the element so that the parts line up.
      Note: Depending on the length of your label, you may need to increase or decrease the size of the gap so that the parts line up vertically.
    4. Select the combo box to activate it and from the Ribbon combo box's Properties window:
    5. Next, select the edit box to activate it and from the Ribbon edit box's Properties window:

    To Line up Combo/Edit Boxes on a Group Programmatically

    Optionally, you can add the Ribbon combo/edit boxes to the Ribbon group and specify the gap between the label and text box parts of the combo/edit box elements using code.

    Add the following code to your project:

    To write code in Visual Basic

    Visual Basic
    Copy Code
    ' type the Imports directive for the namespace
    Imports C1.Win.C1Ribbon
     
    Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
        ' add a RibbonComboBox and RibbonTextBox items
        ' to the Ribbon group
        Dim ComboBox1 As RibbonComboBox = New RibbonComboBox()
        Dim EditBox1 As RibbonTextBox = New RibbonTextBox()
        RibbonGroup1.Items.Add(ComboBox1)
        RibbonGroup1.Items.Add(EditBox1)
     
        ' add a label
        ComboBox1.Label = "Favorites:"
        EditBox1.Label = "Find:"
     
        ' specify the gap between the "label" and "text box"
        ' parts of the combo/edit box elements
        ComboBox1.GapBeforeTextArea = 3
        EditBox1.GapBeforeTextArea = 28
    End Sub
    

    To write code in C#

    C#
    Copy Code
    // type the using directive for the namespace
    using C1.Win.C1Ribbon;
     
    private void Form1_Load(object sender, System.EventArgs e)
    {
        // add a RibbonComboBox and RibbonTextBox items
        // to the Ribbon group
        RibbonComboBox ComboBox1 = new RibbonComboBox();
        RibbonTextBox EditBox1   = new RibbonTextBox();
        ribbonGroup1.Items.Add(ComboBox1);
        ribbonGroup1.Items.Add(EditBox1);
     
        // add a label
        ComboBox1.Label = "Favorites:";
        EditBox1.Label = "Find:";
     
        // specify the gap between the "label" and "text box"
        // parts of the combo/edit box elements
        ComboBox1.GapBeforeTextArea = 3;
        EditBox1.GapBeforeTextArea = 28;
    }
    

    This topic illustrates the following:

    With the GapBeforeTextArea property set for the Ribbon combo box and edit box items, the text box parts line up vertically on the Ribbon group: