ComponentOne Ribbon for WinForms
Design-Time Support / Floating Toolbars
In This Topic
    Floating Toolbars
    In This Topic

    The Floating Toolbar is a part of the Ribbon Smart Designer, which allows the user to customize different types of Ribbon Elements at design time. C1Ribbon provides visual editing to make it easier to create a Ribbon at design time. The user can set properties directly on the form using the Smart Designer Floating Toolbar.

    Hovering the mouse over an item in the C1Ribbon smart designer in the form displays the ribbon element name. This is depicted in the GIF below:

    Hover over smart designer

    Floating Toolbar Types

    Each element in the Ribbon control has a floating toolbar. This is elaborated in the table below:

    Elements Floating Toolbar
    C1Ribbon Floating toolbar of ribbon
    Application Menu Floating toolbar of applicationmenu
    BackstageView Floating toolbar of backstage
    Quick Access Toolbar Floating toolbar of qatbar
    Configuration Toolbar Floating toolbar of configuration-toolbar
    Contextual Tab Group Floating toolbar of contextualtabgroup
    Ribbon Tab Floating toolbar of tab
    Ribbon Group Floating toolbar of group
    StatusBar Floating toolbar of statusbar
    Button Floating toolbar of button
    CheckBox Floating toolbar of checkbox
    ColorPicker Floating toolbar of colorpicker
    ComboBox Combobox
    ControlHost Floating toolbar of controlhost
    Date Picker Floating toolbar of datepicker
    Font ComboBox Floating toolbar of fontcombobox
    Gallery Floating toolbar of gallery
    Label Floating toolbar of label
    Menu Floating toolbar of menu
    Numeric Box Floating toolbar of numeric-box
    Progress Bar Floating toolbar of progressbar
    Separator Floating toolbar of separator
    SplitButton Floating toolbar of splitbutton
    TextBox Floating toolbar of textbox
    Time Picker Floating toolbar of timepicker
    Toggle Button Floating toolbar of togglebutton
    Tool Bar Floating toolbar of toolbar
    Track Bar Floating toolbar of trackbar
    Top Toolbar Floating toolbar of toptoolbar
    Bottom Toolbar Floating toolbar of bottombar

    From the table, it is evident that many ribbon elements have the same type of floating toolbar. For example, ribbon items like QAT, Configuration Toolbar, Progress Bar, Tool Bar, Track Bar, Top Toolbar and Bottom Toolbar have the same type of floating toolbar.

    Floating Toolbar Options

    The different types of options available in the floating toolbars are elucidated below.

    Floating Toolbar Options

    Description

    Action icon Actions: It opens a dropdown menu that usually contains the Cut,Copy, Paste and Deleteoptions. This lets the user cut, copy, paste or delete that item. Depending on the type of Ribbon Item, more options can appear in the Actions dropdown menu. For example, the Tab Floating Toolbar has an extra option Add Group, while the Group Floating Toolbar has options like AddButton, Add CheckBoxes, Add TrackBar, Add ControlHost etc. The Contextual Tab Group has an Add Tab option to add tabs. The Actions menu in the C1Ribbon floating toolbar differs from the rest items and has unique options like Load Ribbon Template, Save Ribbon Template, Add Tab and Add Contextual Tab Group.
    Change image icon Change Image: Use the Change Image option to customize the appearance/icon of the item. The Change Image button now opens a window with four options specifying image sizes in advance. The user can conveniently choose from 16 x 16 px, 20 x 20 px, 32 x 32 px images or select a custom image. Clicking any one of the four options opens the Select Image editor. Refer the Icons topic to know more about the Select Image editor.
    Text settings icon Text settings: When the user clicks this option, the Text Setting dialog box appears. The user can add the Text, ToolTip, Cue, Label, Description etc. to the Ribbon element.
    Misc settings icon Miscellaneous settings: The Miscellaneous Settings option allows the user to configure certain Properties associated with an element. Note that it can vary with Ribbon elements. For example, in case of Ribbon ComboBox, TextBox and FontComboBox, the Miscellaneous Settings dialog box allows the user to edit Properties like Text Area Width, Max Text Length and Horizontal Alignment. Similarly, the TrackBar and ProgressBar has a Miscellaneous Settings dialog Box with properties like Maximum and Minimum. Likewise, the Toggle Button Miscellaneous Settings contains the ToggleGroupName property.The Miscellaneous Settings option for other Ribbon elements contains check boxes to enable or disable the respective ribbon element.
    Add launcher button Add Launcher Button / Remove Launcher Button: This option allows to add or remove a dialog box launcher button to the Ribbon Group.
    Quick access toolbar Add to Quick Access Toolbar: This option allows the user to add the Ribbon element to QAT (Quick Access Toolbar).
    Hot item list icon Add to Hot Item List: This option allows the user to add the Ribbon element to the Hot Item List.
    Contextual color scheme Contextual Color Scheme: It lets you change the color scheme of the Contextual Tab Group.
    Localize Localize: The Localize option opens the Localize dialog box.
    Hide or show icon Hide/show Ribbon items: It allows you to hide or show Ribbon items in the ribbon UI. This is available in the floating toolbar of C1Ribbon. Note that while adding more tabs or groups, the smart designer may hide some tabs or groups. But the Hide/Show Ribbon Items option lets the user get back to the first tab or group.

    In-Place Caption Editing

    An interesting feature of the smart designer is that it allows in-place text editing of the Ribbon element on the Form. Clicking on a Ribbon element launches the floating toolbar and a tooltip 'Click to edit item text/tabcaption'. As directed in the tooltip, the user can edit the text by simply clicking on the text label with the mouse pointer.

    This is illustrated in the GIF below:

    Editing in place using smart designer