![]() Alignment (horizontal orientation only): controls whether the button bar is aligned to the left, center, or right of the Flow screen.Orientation (Navigation Mode only): controls whether the buttons are laid out horizontally or vertically.Multi-select (Selection Mode only): allows user to select more than one of the options in the group.Also used to communicate validation requirements. Required (Selection Mode only): does not allow user to unselect all options once selected.Action mode (required): choose between Navigation or Selection, as described above.Label: label text to be displayed above the button bar.These are the configurations that apply to the overall button bar, as opposed to the individual buttons. You can also see a preview of your button bar to make sure everything looks right, but note that the preview is at present notperfect and you’ll still need to test some features in debug. The trash icon deletes an icon, and the order of the icons can be changed by dragging and dropping them into the desired position. Click an existing button, or the pencil icon beside it, to open the modal and edit its settings. Click “add new button” to open the Button Builder modal (see below) and create a new button. This section is used to add, delete, and reorder the buttons in your button bar. The configuration panel contains two sections: Buttons and Button Bar Settings. Configuration Panel using the new Custom Property Editor UI in Navigation Mode.horizontal lines below and/or above the button bar to visually separate it from other screen componentsĪ major upgrade in Flow Button Bar is that it is now configured through a Custom Property Editor, giving far greater control over the look and feel of the configuration panel than previously possible.Text to be displayed as a label above the button bar.Example of FBB in Selection Mode (multi-select, not required)Įxamples of FBB in Selection Mode Common Featuresīoth Navigation Mode and Selection Mode have the following properties, all of which are optional:.Setting this value resets valuesto a list of one,, thereby removing any other selected values.įor selections with more than a handful or so of options, it’s probably better to use a checkbox group or radio buttons instead.Used for convenience and to conform to the format of the standard components. String used for single-select button bars.In single-select button bars, the list will contain a maximum of one element. list of strings with zero or one elements, or more if multiselectis enabled, containing any selected values in the FBB component.In Selection Mode, the component returns two properties: Clicking a button in Selection Mode does not cause navigation within the Flow. Selection Mode is comparable to other input elements like radio buttons or picklists, but uses a button group UI and allows for both single- or multi-select. Selection Mode is used to present users with a grouped set of buttons each representing a different selectable option. When the user clicks one of the buttons, their selected value is stored in the component’s ‘value’ property, and the user is navigated to a decision element where they can be routed based on their selection. The Flow Button Bar (FBB) component is shown on Decision Screen in the example above. View of a Decision element using the output from a Flow Button Bar to guide navigation.Įxamples of how to use FBB in Navigation Mode.Example of Flow logic in Navigation Mode.Example of Navigation Mode (horizontal).In horizontal orientation, the buttons can be aligned to the left, right, or center, and in vertical orientation an optional Description Text value can be displayed. Buttons in Navigation Mode can be styled with different variants, and the button bar can be oriented horizontally or vertically. This value can then be handled by a Decision element to route the user accordingly. It allows Flow admins to add one or more Lightning buttons to a Flow screen that, when clicked, return the value associated with that button and navigate to the next (or previous) Flow element. Navigat ion Mode covers the functionality provided by the existing component, and is used to replace and extend the functionality of the native Flow navigation buttons (Next/Finish and Previous). “a simple, lightweight tool that gives Flow builders the ability to present users with customizable navigation choices that go beyond the standard ‘Next/Finish’ and ‘Previous’.”įBB brings a more user-friendly interface, new features like icons and vertical buttons, and now offers two distinct “modes” of Flow functionality: Navigation Mode and Selection Mode. The new and improved Flow Button Bar (FBB) builds on the existing “Custom Flow Navigation Buttons” component, which is:
0 Comments
Leave a Reply. |