Skip to content

Panel Widget Configuration

Cristina Suciu edited this page Dec 23, 2020 · 2 revisions

Table of Contents

Panels are configured using an instance of DUXBetaPanelWidgetConfiguration when they are created. The configuration object is created and passed to the newly created panel widget where it is applied. The methods used to set configuration parameters are designed to work together as stand alone or using method chaining, allowing all configuration to be done in a single statement.

The configuration object is generalized for all panel types, therefore not all methods will be used to configure any particular panel.

General configuration of type and orientation

Panel Types which are used by both DUXBetaPanelWidgetConfiguration constructors are:

Type Description
DUXBetaPanelTypeBar A bar of widgets, useful for a status bar along one edge of a screen or inside another container. Bar Panel Widgets have at left/right or top/bottom section
DUXBetaPanelTypeToolbar A Toolbar Panel Widget
DUXBetaPanelTypeList A List Panel Widget for displaying a list of widgets, vertically oriented

Panel variants apply only to non-list panels and are passed to the first constructor. The variants are:

Variant Description
DUXBetaPanelVariantHorizontal Orientation for a horizontal Bar Panel Widget panel
DUXBetaPanelVariantVertical Orientation for a vertical Bar Panel Widget
DUXBetaPanelVariantTop Specifies a Toolbar Panel Widget with the tools along the top edge of the panel
DUXBetaPanelVariantLeft A Toolbar Panel Widget with the tools along the left edge of the panel
DUXBetaPanelVariantRight A Toolbar Panel Widget with the tools along the right edge of the panel
DUXBetaPanelVariantList This variant is used for list panels only and must be used for List Panel Widgets

For ListPanelWidget configuration, the second init method is called, passing one of the following parameters to define the list type:

List Type Description
DUXBetaListNone Unused
DUXBetaListSelectOne A sub-list allowing the user to select a single option item in the list
DUXBetaListSelectOneAndReturn A sub-list allowing a single option to be selected, will dismiss, and then return the selection to the parent list
DUXBetaListWidgets A list created by passing in instantiated widgets only
DUXBetaListWidgetNames A list consisting of widget class names. The widgets are then created by the list panel without further configuration
DUXBetaListSingleWidget A list which only has a single widget in it. Useful as a sub-list for configuring options of a parent list item

The available methods for configuration are:

Swift

init(type: DUXBetaPanelType, variant: DUXBetaPanelVariant)
init(type: DUXBetaPanelType, listKind: DUXBetaListType)

Objective-C

- (instancetype)init:(DUXBetaPanelType)type variant:(DUXBetaPanelVariant)variant;
- (instancetype)init:(DUXBetaPanelType)type variant:(DUXBetaListType)variant;

Specific area configurations

Color configuration

Swift

func configureColors(background: UIColor, border: UIColor, title: UIColor,
             titleBarBackground: UIColor, selection: UIColor, toolbarBackground: UIColor,
                    toolbarTint: UIColor) -> DUXBetaPanelWidgetConfiguration

Objective-C

- (instancetype) configureColors:(UIColor*)backgroundColor border:(UIColor*)borderColor
                           title:(UIColor*)titleColor titleBarBackground:(UIColor*)titlebarBackgroundColor
		       selection:(UIColor*)selectionColor toolbarBackground:(UIColor*)toolbarBackgroundColor
                      toolbarTint:(UIColor*)toolbarTintColor;

Default colors for each color configuration parameter

If the color isn’t specified in the Swift call or if this method isn’t called at all, these are the default values supplied.

Parameter Default Color
background black
border clear
title white
titleBarBackground black
selection dark gray
toolbarBackground black
toolbarTint white

Titlebar configuration for Toolbar and List panels

The titlebar title can be aligned either to the leading side (left side on most systems devices) or centered in the titlebar. If left alignment is chosen, there will always be space left for the back button icon which may not be shown. This allows for consistent appearance in hierarchical lists.

Titlebar Alignment Constants

Constant Poitioning
DUXBetaPanelTitleBarAlignmentCenter Centered in titlebar
DUXBetaPanelTitleBarAlignmentLeading Leading (normally left) aligned, always leaving space for a back button

Titlebar configuration method

Swift

func configureTitlebar(visible: Bool, withCloseBox: Bool, withBackButton: Bool,
                         title: String, titleHeight: CGFloat,
                titleAlignment: DUXBetaPanelTitleBarAlignment) -> DUXBetaPanelWidgetConfiguration

Objetive-C

- (instancetype)configureTitleBar:(BOOL)visible withCloseBox:(BOOL)hasClosebox
                   withBackButton:(BOOL)hasBackButton title(NSString*)titleString
                      titleHeight:(CGFloat)titlebarHeight titleAlignment:(DUXBetaPanelTitleBarAlignment)alignment;

This method is used to configure all the settings for the titlebar which will appear on a ListPanelWidget or ToolbarPanelWidget. In Swift the only non-optional parameter is for visible, which controls the visibility of the titlebar.

Default values for the title bar settings if not configured or supplied to the Swift method are:

Parameter Default Color
withCloseBox NO
withBackButton NO
title Empty string v
titleHeight 32 points (This is the height of the titlebar, not the actual title)
titleAlignment DUXBetaPanelTitleBarAlignmentCenter

Toolbar configuration

Swift

func configureToolbar(dimension: CGFloat) -> DUXBetaPanelWidgetConfiguration

Objective-C

- (instancetype)configureToolbar:(CGFloat)toolbarIconSize;

This method sets the height and width of the display for the toolbar icon. It is currently always square.

Clone this wiki locally