Other Classes
The following classes are available globally.
-
UICollectionViewCell
subclass forFUIDataTableCardView
card type, whereFUIDataTable
are centered in the card.Extends
FUIDataTableCardView
API, by extension onFUIBaseDrawingCollectionViewCell
.Usage
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: FUIDataTableCardCollectionViewCell.reuseIdentifier, for: indexPath) as! FUIDataTableCardCollectionViewCell cell.title.text = "Machine Health Monitoring" cell.subtitle.text = "ID 3940151" cell.status.text = "3hr" self._innerView.data = [[FUIText("Need Attention"), FUIText("Yesterday")], [FUIText("Stable"), FUIText("Jul 5, 2021")], [FUIText("Need Attention"), FUIText("Jul 4, 2021")]] return cell
Skeleton
cell.showSkeleton() cell.hideSkeleton()
Theming
Supported
TEXT
class paths:fdlFUIDataTableCardCollectionViewCell_title {} fdlFUIDataTableCardCollectionViewCell_subtitle {} fdlFUIDataTableCardCollectionViewCell_status {} fdlFUIDataTableCardCollectionViewCell_footnote {} fdlFUIDataTableCardCollectionViewCell_textItem {}: TEXT theme for all cells in FUIDataTable. It has lowest priority. fdlFUIDataTableCardCollectionViewCell_textItem_row2 {}: TEXT theme for one speciif column in FUIDataTable. # is the column index. It has third priority. fdlFUIDataTableCardCollectionViewCell_textItem_column1 {}: TEXT theme for one specific row in FUIDataTable. # is the row index; header is row 0 if it existis. It has second priority. fdlFUIDataTableCardCollectionViewCell_textItem_row2_column1{}: TEXT theme for one specific cell. Row index and column index are required. It has highest priority.
Supported
TEXT
properties:font-color: Color; font-style: UIFontTextStyle; text-line-clamp: Integer; text-align: NSTextAlignment;
Supported
IMAGE
class paths:fdlFUIDataTableCardCollectionViewCell_imageItem {}: IMAGE theme for all cells in FUIDataTable. It has lowest priority. fdlFUIDataTableCardCollectionViewCell_imageItem_column# {}: IMAGE theme for one speciif column in FUIDataTable. # is the column index. It has third priority. fdlFUIDataTableCardCollectionViewCell_imageItem_row# {}: IMAGE theme for one specific row in FUIDataTable. # is the row index; header is row 0 if it existis. It has second priority. fdlFUIDataTableCardCollectionViewCell_imageItem_row#_column# {}: IMAGE theme for one specific cell in FUIDataTable. Row index and column index are required. It has highest priority.
Supported
IMAGE
properties:tint-color: Color; image-name: String;
Declaration
Swift
open class FUIDataTableCardCollectionViewCell : FUIBaseDrawingCollectionViewCell<FUIDataTableCardView>
-
A FUIDataTableCardView is used to track the current and historical development of valuations (= text) based measuring points (e.g. color, viscosity) over time. This helps users to identify unforeseen changes in the development immediately.
Usage
let view = FUIDataTableCardView() view.title.text = "Machine Health Monitoring" view.subtitle.text = "ID 3940151" // set it as needed view.subtitle.textColor = UIColor.preferredFioriColor(forStyle: .criticalLabel) view.status.text = "3hr" view.detailImage = UIImage(named: "") view.data = [[FUIText("Need Attention"), FUIText("Yesterday")], [FUIText("Stable"), FUIText("Jul 5, 2021")], [FUIText("Need Attention"), FUIText("Jul 4, 2021")]]
Skeleton
view.showSkeleton() view.hideSkeleton()
Theming
Supported
TEXT
class paths:fdlFUIDataTableCardView_title {} fdlFUIDataTableCardView_subtitle {} fdlFUIDataTableCardView_status {} fdlFUIDataTableCardView_footnote {} fdlFUIDataTableCardView_textItem {}: TEXT theme for all cells in FUIDataTable. It has lowest priority. fdlFUIDataTableCardView_textItem_row2 {}: TEXT theme for one speciif column in FUIDataTable. # is the column index. It has third priority. fdlFUIDataTableCardView_textItem_column1 {}: TEXT theme for one specific row in FUIDataTable. # is the row index; header is row 0 if it existis. It has second priority. fdlFUIDataTableCardView_textItem_row2_column1{}: TEXT theme for one specific cell in FUIDataTable. Row index and column index are required. It has highest priority.
Supported
TEXT
properties:font-color: Color; font-style: UIFontTextStyle; text-line-clamp: Integer; text-align: NSTextAlignment;
Supported
IMAGE
class paths:fdlFUIDataTableCardView_imageItem {}: IMAGE theme for all cells in FUIDataTable. It has lowest priority. fdlFUIDataTableCardView_imageItem_column# {}: IMAGE theme for one speciif column in FUIDataTable. # is the column index. It has third priority. fdlFUIDataTableCardView_imageItem_row# {}: IMAGE theme for one specific row in FUIDataTable. # is the row index; header is row 0 if it existis. It has second priority. fdlFUIDataTableCardView_imageItem_row#_column# {}: IMAGE theme for one specific cell in FUIDataTable. Row index and column index are required. It has highest priority.
Supported
IMAGE
properties:
See moretint-color: Color; image-name: String;
Declaration
Swift
public class FUIDataTableCardView : FUICardBaseView, FUISubtitleMultiLineComponent, FUIFootnoteComponent, FUIDetailImageViewComponent
-
A base collection view layout class using section layout manager for generating layout attributes for views in a collection view.
See moreDeclaration
Swift
open class FUIBaseCollectionViewLayout<LayoutManager> : UICollectionViewLayout where LayoutManager : FUISectionLayoutManager
-
A collection view section layout manager that computes the position and size in a section. This is a base class which defines the common properties of a collection section. This class is not supposed to be used directly. Instead, subclass this one and implement
See moreprepare()
for calculating frames for views in collection view.Declaration
Swift
open class FUISectionLayoutManager : NSObject
-
Declaration
Swift
public class FUIBaseDrawingCalendarItemCollectionViewCell<InnerView> : FUIBaseCalendarItemCollectionViewCell, FUIStyleByStringAttributes, InnerViewContainer where InnerView : FUIBaseFixedMarginsView, InnerView : FUIBackgroundSchemeSupporting, InnerView : FUICalculateLayout, InnerView : FUIStyleByStringAttributes
-
This class defines the dates to be displayed as disabled in the
FUICalendarView
.User cannot choose disabled days in the calendar.
See moreDeclaration
Swift
public class FUICalendarDisabledDates
-
This is the view that contains the weekday title labels in
See moreFUICalendarView
.Declaration
Swift
public class FUIWeekLabelView : FUITintableDrawingView<FUIControlState>, FUITitleComponent
-
Card-based drawing view. Not typically used directly by application developers. A streamlined interface for laying out a collection of views in either a column or rows. It calls each view in contents with
See moresystemLayoutSizeFitting(_:withHorizontalFittingPriority:verticalFittingPriority:)
to determine its optimal size and layout with other properties.Declaration
Swift
open class FUICardBaseDrawingView : FUITintableDrawingView<FUIControlState>
-
Showing card view as inner view for collection view cell.
Example Initialization and Configuration:
See morelet cell = collectionView.dequeueReusableCell(withReuseIdentifier: FUICardCollectionViewCell.reuseIdentifier, for: indexPath) as! FUICardCollectionViewCell // set up main header cell.mainHeader.detailImageView.image = UIImage(named: "imageName") cell.mainHeader.title.text = "Title" cell.mainHeader.subtitle.text = "Subtitle" cell.mainHeader.overflowAction.isHidden = false cell.mainHeader.counter.text = "3 of 36" // set up the icon stack let dot = FUIAttributedImage(image: FUIIconLibrary.indicator.dot.withRenderingMode(.alwaysTemplate)) let attachment = FUIAttributedImage(image: FUIIconLibrary.indicator.attachment.withRenderingMode(.alwaysTemplate)) mainHeader.iconImages = [dot, attachment, "1"] // set up media view cell.mediaView.detailImageView.image = UIImage(named: "imageName") cell.mediaView.title.text = "Title" // set a customized height if needed mediaView.detailImageViewHeight = 300 // set up extended view cell.extHeader.row1.contents = [ FUILabelItem(text: "Negative", image: UIImage(systemName: "exclamationmark.triangle.fill"), alignment: .leading), FUILabelItem(text: "Critical"), FUILabelItem(text: "label") ] cell.extHeader.row1.separatorStyle = .automatic cell.extHeader.row2.contents = [FUIRatingControl(style: .standard)] cell.extHeader.row3.contents = [...] let dollars = FUIKPIUnitItem(string: "$") let metric = FUIKPIMetricItem(string: "888.88") let unit = FUIKPIUnitItem(string: "M") cell.extHeader.kpiItems = [dollars, metric, unit] cell.extHeader.kpiFootnote.text = "Label" // set up body cell.body.contents = [ ... ] // set up footer cell.footer..primaryButton.isHidden = false cell.footer..primaryAction.setTitle("Primary", for: .normal) cell.footer..secondaryAction.isHidden = false cell.footer..secondaryAction.setTitle("Secondary", for: .normal)
Declaration
Swift
open class FUICardCollectionViewCell : FUIBaseDrawingCollectionViewCell<FUICardView>
-
Card Extended Header The optional Extended Header block can contain up to 3 rows (row1, row2, and row3) and a KPI. A row can be optionally filled with the following UI components:
- Labels (for text, status or timestamp)
- star rating
- tags
Example Initialization and Configuration:
// set up extended view let extHeader = FUICardExtHeaderView() extHeader.row1.contents = [ FUILabelItem(text: "Negative", image: UIImage(systemName: "exclamationmark.triangle.fill"), alignment: .leading), FUILabelItem(text: "Critical"), FUILabelItem(text: "label") ] extHeader.row1.separatorStyle = .automatic extHeader.row2.contents = [FUIRatingControl(style: .standard)] extHeader.row3.contents = [...] // set up kpi let dollars = FUIKPIUnitItem(string: "$") let metric = FUIKPIMetricItem(string: "888.88") let unit = FUIKPIUnitItem(string: "M") extHeader.kpiItems = [dollars, metric, unit] extHeader.kpiFootnote.text = "Label"
Theming
Supported
Text
class paths:fdlFUICardExtHeaderView_label fdlFUICardExtHeaderView_labelItem_label fdlFUICardExtHeaderView_kpiFootnote
Supported
Text
attributes: font-color (Color) font-name (FontName) font-style (UIFontTextStyle) font-size (Number) text-align (TextAlign) text-line-clamp (Integer)Supported
ImageView
class paths:fdlFUICardExtHeaderView_labelItem_imageView {}
Supported
ImageView
attributes: image-name (Image) tint-color (Color)Supported
TagView
class paths:fdlFUICardExtHeaderView_tagViewSubView {}
Supported
TagView
attributes: font-color (Color) font-name (FontName) font-style (UIFontTextStyle) font-size (Number) fill-color (Color) corner-radius (Float) border-width (Float) border-color (Color) content-insets (Box)Supported
FUIRatingControl
class path:fdlFUICardExtHeaderView_ratingControl
Supported
See moreRatingControl
properties: on-color { -standard | -accented | -editable-disabled | -editable-disabled }: Color; off-color { -standard | -accented | -editable-disabled | -editable-disabled }: Color; on-image { -standard | -editable }: Image; off-image { -standard | -editable }: Image;Declaration
Swift
public class FUICardExtHeaderView : FUITintableDrawingView<FUIControlState>, FUIKPIComponent, FUIKPIFootnoteMultiLineComponent, FUIKPIAttributesConsumer, FUIKPIAttributesProvider
-
Card Main Header The main header block can contain a thumbnail, icon stack, title, subtitle, an Action button, and a Counter.
Example Initialization and Configuration:
// set up main header let mainHeader = FUICardMainHeaderView() mainHeader.detailImageView.image = UIImage(named: "imageName") mainHeader.title.text = "Title" mainHeader.subtitle.text = "Subtitle" mainHeader.overflowAction.isHidden = false mainHeader.counter.text = "3 of 36" // set up the icon stack let dot = FUIAttributedImage(image: FUIIconLibrary.indicator.dot.withRenderingMode(.alwaysTemplate)) let attachment = FUIAttributedImage(image: FUIIconLibrary.indicator.attachment.withRenderingMode(.alwaysTemplate)) mainHeader.iconImages = [dot, attachment, "1"]
Theming
Supported
Text
class paths:fdlFUICardMainHeaderView_title {} fdlFUICardMainHeaderView_subtitle {} fdlFUICardMainHeaderView_counter {} fdlFUICardMainHeaderView_overflowAction {}
Supported
Text
attributes: font-color (Color) font-name (FontName) font-style (UIFontTextStyle) font-size (Number) text-align (TextAlign) text-line-clamp (Integer)Supported
ImageView
class paths:fdlFUICardMainHeaderView_detailImageView {}
Supported
See moreImageView
attributes: image-name (Image) tint-color (Color)Declaration
Swift
open class FUICardMainHeaderView : FUITintableDrawingView<FUIControlState>, FUITitleMultiLineComponent, FUISubtitleMultiLineComponent, FUICounterComponent, FUIOverflowActionComponent, FUIDetailImageViewComponent, FUIIconsComponent
-
Card media view. The media block can contain an optional title and an image that spans the complete width of the card.
Example Initialization and Configuration:
let mediaView = FUICardMediaView() // set up media view mediaView.detailImageView.image = UIImage(named: "imageName") mediaView.title.text = "Title" // set a customized height if needed mediaView.detailImageViewHeight = 300
Theming
Supported
Text
class paths:fdlFUICardMediaView_title {}
Supported
Text
attributes: font-color (Color) font-name (FontName) font-style (UIFontTextStyle) font-size (Number) text-align (TextAlign) text-line-clamp (Integer)Supported
ImageView
class paths:fdlFUICardMediaView_detailImageView {}
Supported
See moreImageView
attributes: image-name (Image) tint-color (Color)Declaration
Swift
public class FUICardMediaView : FUITintableDrawingView<FUIControlState>, FUIDetailImageViewComponent, FUITitleMultiLineComponent
-
Showing card view as inner view for table view cell.
Example Initialization and Configuration:
See morelet cell = tableView.dequeueReusableCell(withIdentifier: FUICardTableViewCell.reuseIdentifier, for: indexPath) as! FUICardTableViewCell // set up main header cell.mainHeader.detailImageView.image = UIImage(named: "imageName") cell.mainHeader.title.text = "Title" cell.mainHeader.subtitle.text = "Subtitle" cell.mainHeader.overflowAction.isHidden = false cell.mainHeader.counter.text = "3 of 36" // set up the icon stack let dot = FUIAttributedImage(image: FUIIconLibrary.indicator.dot.withRenderingMode(.alwaysTemplate)) let attachment = FUIAttributedImage(image: FUIIconLibrary.indicator.attachment.withRenderingMode(.alwaysTemplate)) mainHeader.iconImages = [dot, attachment, "1"] // set up media view cell.mediaView.detailImageView.image = UIImage(named: "imageName") cell.mediaView.title.text = "Title" // set a customized height if needed mediaView.detailImageViewHeight = 300 // set up extended view cell.extHeader.row1.contents = [ FUILabelItem(text: "Negative", image: UIImage(systemName: "exclamationmark.triangle.fill"), alignment: .leading), FUILabelItem(text: "Critical"), FUILabelItem(text: "label") ] cell.extHeader.row1.separatorStyle = .automatic cell.extHeader.row2.contents = [FUIRatingControl(style: .standard)] cell.extHeader.row3.contents = [...] let dollars = FUIKPIUnitItem(string: "$") let metric = FUIKPIMetricItem(string: "888.88") let unit = FUIKPIUnitItem(string: "M") cell.extHeader.kpiItems = [dollars, metric, unit] cell.extHeader.kpiFootnote.text = "Label" // set up body cell.body.contents = [ ... ] // set up footer cell.footer..primaryButton.isHidden = false cell.footer..primaryAction.setTitle("Primary", for: .normal) cell.footer..secondaryAction.isHidden = false cell.footer..secondaryAction.setTitle("Secondary", for: .normal)
Declaration
Swift
open class FUICardTableViewCell : FUIBaseDrawingTableViewCell<FUICardView>
-
The card has five elements: media view
FUICardMediaView
, main headerFUICardMainHeaderView
, extended headerFUICardExtHeaderView
, bodyFUICardBaseDrawingView
and footerFUICardFooterView
. The main headerFUICardMainHeaderView
is the only mandatory element. All others are optional.Example Initialization and Configuration:
let card = FUICardView() // set up main header card.mainHeader.detailImageView.image = UIImage(named: "imageName") card.mainHeader.title.text = "Title" card.mainHeader.subtitle.text = "Subtitle" card.mainHeader.overflowAction.isHidden = false card.mainHeader.counter.text = "3 of 36" // set up the icon stack let dot = FUIAttributedImage(image: FUIIconLibrary.indicator.dot.withRenderingMode(.alwaysTemplate)) let attachment = FUIAttributedImage(image: FUIIconLibrary.indicator.attachment.withRenderingMode(.alwaysTemplate)) card.mainHeader.iconImages = [dot, attachment, "1"] // set up media view card.mediaView.detailImageView.image = UIImage(named: "imageName") card.mediaView.title.text = "Title" // set a customized height if needed card.mediaView.detailImageViewHeight = 300 // set up extended view card.extHeader.row1.contents = [ FUILabelItem(text: "Negative", image: UIImage(systemName: "exclamationmark.triangle.fill"), alignment: .leading), FUILabelItem(text: "Critical"), FUILabelItem(text: "label") ] card.extHeader.row1.separatorStyle = .automatic card.extHeader.row2.contents = [FUIRatingControl(style: .standard)] card.extHeader.row3.contents = [...] let dollars = FUIKPIUnitItem(string: "$") let metric = FUIKPIMetricItem(string: "888.88") let unit = FUIKPIUnitItem(string: "M") card.extHeader.kpiItems = [dollars, metric, unit] card.extHeader.kpiFootnote.text = "Label" // set up body card.body.contents = [ ... ] // set up footer card.footer.primaryAction.isHidden = false card.footer.primaryAction.setTitle("Primary", for: .normal) card.footer.secondaryAction.isHidden = false card.footer.secondaryAction.setTitle("Secondary", for: .normal)
Theming
Supported
Text
class paths:fdlFUICardMediaView_title {} fdlFUICardMainHeaderView_title {} fdlFUICardMainHeaderView_subtitle {} fdlFUICardMainHeaderView_counter {} fdlFUICardMainHeaderView_overflowAction {} fdlFUICardExtHeaderView_label fdlFUICardExtHeaderView_labelItem_label fdlFUICardExtHeaderView_kpiFootnote fdlFUICardFooterView_primaryAction {} fdlFUICardFooterView_secondaryAction {}
Supported
Text
attributes: font-color (Color) font-name (FontName) font-style (UIFontTextStyle) font-size (Number) text-align (TextAlign) text-line-clamp (Integer)Supported
ImageView
class paths:fdlFUICardMediaView_detailImageView {} fdlFUICardMainHeaderView_detailImageView {} fdlFUICardExtHeaderView_labelItem_imageView {}
Supported
ImageView
attributes: image-name (Image) tint-color (Color)Supported
TagView
class paths:fdlFUICardExtHeaderView_tagViewSubView {}
Supported
TagView
attributes: font-color (Color) font-name (FontName) font-style (UIFontTextStyle) font-size (Number) fill-color (Color) corner-radius (Float) border-width (Float) border-color (Color) content-insets (Box)Supported
FUIRatingControl
class path:fdlFUICardExtHeaderView_ratingControl
Supported
See moreRatingControl
properties: on-color { -standard | -accented | -editable-disabled | -editable-disabled }: Color; off-color { -standard | -accented | -editable-disabled | -editable-disabled }: Color; on-image { -standard | -editable }: Image; off-image { -standard | -editable }: Image;Declaration
Swift
open class FUICardView : FUICardBaseDrawingView
-
Gridline properties for an Axis.
See moreDeclaration
Swift
public class FUIChartGridlineAttributes : FUIChartLineAttributes
-
Style definition for the chartView. Gives access to the chart theming.
See moreDeclaration
Swift
public class FUIChartStyle : Equatable
-
FUIEmptyStateView:
conforms to theUIView
class and contains SwiftUI componentEmptyStateView
as a container.Usage 1: simple
let emptyView = FUIEmptyStateView() emptyView.title.text = "Custom placeholder title" emptyView.body.text = "This is a text to describe what you can do when there is no data" emptyView.detailImageView.image = UIImage(named: "errorMessage") let actionButton = FUIButton() // ... configure button style // actionButton.setContentHuggingPriority(.defaultHigh, for: .horizontal) // actionButton.setContentHuggingPriority(.defaultHigh, for: .vertical) emptyStateView.primaryAction = actionButton
Usage 2: customization
See morelet emptyStateView = FUIEmptyStateView() emptyStateView.title.text = ... emptyStateView.titleAttributedText = ... emptyStateView.body.text = ... emptyStateView.bodyAttributedText = ... let detailImageView = FUIImageView() // ... configure imageView style emptyStateView.detailImageView = detailImageView let actionButton = FUIButton() // ... configure button style // actionButton.setContentHuggingPriority(.defaultHigh, for: .horizontal) // actionButton.setContentHuggingPriority(.defaultHigh, for: .vertical) emptyStateView.primaryAction = actionButton
Declaration
Swift
public class FUIEmptyStateView : FUIBaseDrawingView, FUITitleMultiLineComponent, FUIBodyMultiLineComponent, FUIDetailImageViewComponent, FUIPrimaryActionComponent
-
The default implementation of the
See moreFUITintAttributesProvider
withFUIControlState
as theTintState
type.Declaration
Swift
open class FUIControlStateTintAttributesProvider : FUITintAttributesProvider
-
UICollectionView subclass, which invokes a
sizeChangeHandler: (() -> Void)?
closure, when the current content size of the collection does not match the intrinsic content size. The sizeChangeHandler property isinternal
to the SDK.Developers should generally not initialize
FUIResizingCollectionView
directly. Instead, instances of the class are typically accessed through theFUITableViewCollectionSection
API’s.Important
Resizing behavior will only be executed, if thesizeChangeHandler
is implemented.Declaration
Swift
@available(*, deprecated, message: "If using as subview of UITableViewCell: use FUICollectionViewTableViewCell instead; if using generally: use UICollectionView instead.") public class FUIResizingCollectionView : UICollectionView
-
Undocumented
See moreDeclaration
Swift
public class ObservableArray<Element> : Sequence, ObservableObject where Element : ObservableObject, Element : Hashable, Element : Identifiable
extension ObservableArray: Collection
extension ObservableArray: RandomAccessCollection
-
FUIBarButtonItem
is an enhancedUIBarButtonItem
to provide a way to specify the image to be displayed based on the state whentitle
isnil
or empty.For now, only normal and disabled states are used.
See moreFUIBarButtonItem
also provides a few convenienceinit()
s to return a newly initialized SAPFiori StyleUIBarButtonItem
. It has the SAPFiori styles, font & color for title and icon,.quaternaryFill
background color for.highlighted
state, and a minimum 44x44 touch area.Declaration
Swift
open class FUIBarButtonItem : UIBarButtonItem
-
A
See moreUITableViewHeaderFooterView
subclass, which supports top and bottom padding and separators.Declaration
Swift
open class FUIBaseTableViewHeaderFooterView : UITableViewHeaderFooterView, FUIViewBorderDrawing
-
Undocumented
Declaration
Swift
open class FUIDrawingView : FUIBaseDrawingView, FUIAttributesProvider
-
The base class for an Inline Validation form table view cell.
See moreDeclaration
Swift
open class FUIInlineValidationDrawingTableViewCell<InnerView> : FUIBaseDrawingTableViewCell<InnerView>, InnerViewContainerEventHandling, FUIInlineValidation where InnerView : FUIBaseFixedMarginsView, InnerView : FUIBackgroundSchemeSupporting, InnerView : FUICalculateLayout, InnerView : FUIStyleByStringAttributes
-
See moreUIView
subclass to draw text and glygh image using TextKit apis. Typically not used by developer.Declaration
Swift
public class FUITextKitView : UIView, PrepareForReuse, FUIContentCopyable
-
Undocumented
See moreDeclaration
Swift
open class FUITintableDrawingView<T> : FUIBaseDrawingView, FUITintAttributesProvider, FUIAttributesProvider, FUIEnabledComponent, FUIStyleTintByStringAttributes, TintStyleGrabbing where T : Defaultable, T : Enableable, T : Hashable
-
FUIToolbar
is a subclass of ‘UIToolbar’ which displays theUIBarButtonItem
array in Fiori style.Developers needs to create
UINavigationController
with the following code to useFUIToolbar
as its toolbar.UINavigationController(navigationBarClass: nil, toolbarClass: FUIToolbar.self)
Then in the
viewDidLoad
function of theUIViewController
use the following code to set the toolbar items for text buttons:var buttons: [FUIButton] = [...] setFioriStyleToolbarItems(buttons, helperText: helperText, animated: true)
Or, for icon type items:
let item1 = UIBarButtonItem(image: shareIcon, ...) // item1 is the primary item let item2 = UIBarButtonItem(image: trashIcon, ...) var items: [UIBarButtonItem] = [item1, item2, ...] setFioriStyleToolbarItems(items, helperText: helperText, animated: true)
Theming
Supported
TEXT
class paths:fdlFUIToolbar_helperText {}
Supported
TEXT
properties:font-color: Color; font-style: UIFontTextStyle;
Supported
UIBarButtonItem
class path:fdlFUIToolbar_overflowButton {}
Supported
UIBarButtonItem
properties:
See moreimage: Name;
Declaration
Swift
open class FUIToolbar : UIToolbar
-
A FUIDimensionSelector object is a horizontal control made up of multiple segments, each segment functioning as a discrete button. Selection is mutually exclusive.
Code usage:
let dimensionSelector = FUIDimensionSelector(titles: titles) dimensionSelector.selectedIndex = 1 dimensionSelector.interItemSpacing = 20 dimensionSelector.selectionDidChangeHandler = { [weak self] index in print("selected: \(index ?? -1)") }
Styling
Attribute setting:
Setting the items’ styling for
title
andborder
withsetAttribute(attribute, for:)
. Currently.normal
,.selected
and.disabled
are supported.let attribute = FUISegmentAttribute(textColor: .red, borderColor: .blue) dimensionSelector.setAttribute(attribute: attribute, for: .selected)
Theming
See morefdlFUIDimensionSelector { title-color: green; title-color-selected: red; title-color-disabled: gray; border-color: blue; border-color-selected: orange; border-color-disabled: gray; interItem-spacing: 20; title-inset: 5 10 5 10; content-inset: 0 40 0 40; }
Declaration
Swift
open class FUIDimensionSelector : UIView
-
A
UIView
subclass for showing key-value text in a vertical stack.Usage
let view = FUIKeyValueContentView() view.title.text = "title text" view.value = "value text"
Theming
Supported
TEXT
class paths:fdlFUIKeyValueContentView_title {} fdlFUIKeyValueContentView_valueText {}
Supported
TEXT
properties:
See morefont-color (Color) font-name (FontName) font-style (UIFontTextStyle) font-size (Number) text-align (TextAlign) text-line-clamp (Integer)
Declaration
Swift
open class FUIKeyValueContentView : FUITintableDrawingView<FUIControlState>, FUITitleMultiLineComponent, FUIValueComponent
-
A
UITableViewCell
subclass for showing key-value text in a vertical stack.Usage
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { guard let cell = tableView.dequeueReusableCell(withIdentifier: FUIKeyValueTableViewCell.reuseIdentifier, for: indexPath) as? FUIKeyValueTableViewCell else { return UITableViewCell() } cell.title.text = "Short title text" cell.value = "Short value text" cell.accessoryType = .detailButton return cell }
Theming
Supported
TEXT
class paths:fdlFUIKeyValueTableViewCell_title {} fdlFUIKeyValueTableViewCell_valueText {}
Supported
TEXT
properties:
See morefont-color (Color) font-name (FontName) font-style (UIFontTextStyle) font-size (Number) text-align (TextAlign) text-line-clamp (Integer)
Declaration
Swift
open class FUIKeyValueTableViewCell : FUIInlineValidationDrawingTableViewCell<FUIKeyValueContentView>
-
Undocumented
See moreDeclaration
Swift
public class FUILabelItem : FUIDrawingView
-
The
FUITableViewCollectionSection
control is designed to be used, when a section in aUITableView
should be dedicated to displaying aUICollectionView
, and, the height of that section should adjust to fit its contents.The collection section produces a single
FUICollectionViewTableViewCell
, which refreshes its height, after its subviewFUICollectionView
calculates the sizes of its subviewUICollectionViewCell
items.A developer uses the
FUITableViewCollectionSection
, by assigning a data source (/and delegate) to itscollectionView: FUICollectionView
property; then, he or she should supply itscollectionViewTableViewCell
property to aUITableViewDataSource.tableView(_:cellForRowAt:)
implementation.Important
A developer should retain a strong reference to aFUITableViewCollectionSection
.## Usage
See morelet workorders: [WorkOrder] = [WorkOrder]() override public func viewDidLoad() { let workOrdersLayout = FUICollectionViewLayout.horizontalFlow workOrdersLayout.itemSize = CGSize(width: 200, height: 200) self.workOrdersSection = FUITableViewCollectionSection(tableView: self.tableView, collectionViewLayout: workOrdersLayout) self.workOrdersSection.collectionView.dataSource = self self.workOrdersSection.collectionView.register(FUISimpleCollectionViewCell.self, forCellWithReuseIdentifier: FUISimpleCollectionViewCell.reuseIdentifier) self.workOrdersSection.collectionView.delegate = self self.workOrdersSection.collectionView.isScrollEnabled = false self.tableView.estimatedRowHeight = 98 self.tableView.rowHeight = UITableView.automaticDimension } // MARK: UITableViewDataSource override public func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int { return 1 } public override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { return self.workOrdersSection.collectionViewTableViewCell } // MARK: UICollectionViewDataSource public func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell { switch collectionView { case workOrdersSection.collectionView: let cell = collectionView.dequeueReusableCell(withReuseIdentifier: FUISimpleCollectionViewCell.reuseIdentifier, for: indexPath) as! FUISimpleCollectionViewCell cell.contentImageView.image = UIImage(named: "WorkOrderImage") cell.titleLabel.text = "Work Order: \(indexPath.item)" return cell default: // ... } }
Declaration
Swift
@available(*, deprecated, message: "Use FUICollectionViewTableViewCell instead.") open class FUITableViewCollectionSection
-
- The reusable UI component implemented as a
UICollectionViewCell
to manage selecting attachments.
FUIAttachmentsCollectionViewCell
uses aFUIAttachmentsViewController
to display the title of the cell and a collection of icons to represent the attachments. The attachment icon size may change, depending on the system font size settings. The controller arranges the attachment icons so that as many icons can be fitted into a row as possible, in as many rows as possible, to display all the attachment icons. It will also try to make the row spacing equal to the spacing between icons. However, the row spacing is limited to a maximum of 20 pixels.Developers should use the
attachmentsController
property to provide attachment information; thedelegate
, thedataSource
and the list ofFUIAttachmentAction
implementations for the desired type of attachments. The app can use the built-in types or implement additional types as desired.Color settings:
Setting
tintColor
to add a button for a state using thesetTintColor(_:for:)
API. Currentlynormal
and.selected
are supported.cell.setTintAttributes([NSAttributedString.Key.foregroundColor: UIColor.red], for: .actionTitle, state: .normal)
There are three versions of the built-in
FUIAttachmentAction
:FUIAddPhotoAttachmentAction
: Choose photo from the photo library.FUITakePhotoAttachmentAction
: Take photo using the camera.FUIDocumentPickerAttachmentAction
: Select file using the standardUIDocumentPickerViewController
.
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { let cell = collectionView.dequeueReusableCell(withReuseIdentifier: FUIAttachmentsCollectionViewCell.reuseIdentifier, for: indexPath) as! FUIAttachmentsCollectionViewCell cell.attachmentsController.delegate = self cell.attachmentsController.dataSource = self let addPhotoAction = FUIAddPhotoAttachmentAction() addPhotoAction.delegate = self cell.attachmentsController.addAttachmentAction(addPhotoAction) let takePhotoAction = FUITakePhotoAttachmentAction() takePhotoAction.delegate = self cell.attachmentsController.addAttachmentAction(takePhotoAction) let filePickerAction = FUIDocumentPickerAttachmentAction() filePickerAction.delegate = self cell.attachmentsController.addAttachmentAction(filePickerAction) return cell } var attachmentURLs: [URL] = [URL]() // MARK: FUIAttachmentsViewControllerDataSource methods func attachmentsViewController(_ attachmentsViewController: FUIAttachmentsViewController, iconForAttachmentAtIndex index: Int) -> (image: UIImage, contentMode: UIViewContentMode)? { let urlString = self.attachmentURLs[index].absoluteString guard let image = self.attachmentThumbnails[urlString] else { return nil } return (image!, .scaleAspectFill) } func numberOfAttachments(in attachmentsViewController: FUIAttachmentsViewController) -> Int { return attachmentURLs.count } func attachmentsViewController(_ attachmentsViewController: FUIAttachmentsViewController, urlForAttachmentAtIndex index: Int) -> URL? { return attachmentURLs[index] } // MARK: FUIAttachmentsViewControllerDelegateMethods func attachmentsViewController(_ attachmentsViewController: FUIAttachmentsViewController, couldNotPresentAttachmentAtIndex index: Int) { } func focusOnNewAttachment() { DispatchQueue.main.async { if let cell = ... { // find the attachment cell if let newDoc = cell.accessibilityElements?.last { UIAccessibility.post(notification: .layoutChanged, argument: newDoc) } } } } func attachmentsViewController(_ attachmentsViewController: FUIAttachmentsViewController, didPressDeleteAtIndex index: Int) { self.attachmentURLs.remove(at: index) self.tableView.reloadSections(IndexSet(integer:attachmentSection), with: .automatic) } //MARK: FUIAddPhotoAttachmentActionDelegate func addPhotoAttachmentAction(_ action: FUIAddPhotoAttachmentAction, didSelectPhoto asset: PHAsset, at url: URL) { setupThumbnails(url, with: asset) self.addAttachmentURL(url) } //MARK: FUITakePhotoAttachmentActionDelegate func takePhotoAttachmentAction(_ action: FUITakePhotoAttachmentAction, didTakePhoto asset: PHAsset, at url: URL) { setupThumbnails(url, with: asset) self.addAttachmentURL(url) } func addAttachmentURL(_ url: URL) { self.attachmentURLs.append(url) DispatchQueue.main.async { self.tableView.reloadSections(IndexSet(integer:self.attachmentSection), with: .automatic) self.tableView.scrollToRow(at: IndexPath(row: 0, section: self.attachmentSection) , at: .middle, animated: true) if UIAccessibility.isVoiceOverRunning { focusOnNewAttachment() } } } func setupThumbnails(_ url: URL, with asset: PHAsset) { let imageManager = PHImageManager.default() imageManager.requestImage(for: asset, targetSize: CGSize(width: 80, height: 80), contentMode: .default, options: nil, resultHandler: { image, array in self.attachmentThumbnails[url.absoluteString] = image DispatchQueue.main.async { self.tableView.reloadSections(IndexSet(integer:self.attachmentSection), with: .automatic) self.tableView.scrollToRow(at: IndexPath(row: 0, section: self.attachmentSection) , at: .middle, animated: true) } }) } //MARK: FUIDocumentPickerAttachmentActionDelegate { var documentPicker: UIDocumentPickerViewController { return UIDocumentPickerViewController(documentTypes: ["public.data"], in: .import) } func documentPickerAttachmentAction(_ action: FUIDocumentPickerAttachmentAction, didPickFileAt url: URL) { if let savedUrl = saveFileToTempFolder(url) { self.addAttachmentURL(savedUrl) } self.tableView.reloadSections(IndexSet(integer:self.attachmentSection), with: .automatic) if UIAccessibility.isVoiceOverRunning { focusOnNewAttachment() } }
## Theming
Supported
TEXT
class paths:fdlFUIAttachmentsFormView_attachmentTitleLabel {} fdlFUIAttachmentsViewController_alertActionTitle {} fdlFUIFileThumbnailCollectionItemView_titleLabel {}
Supported
TEXT
properties:font-color: Color; font-style: UIFontTextStyle;
Supported
IMAGE
class paths:fdlFUIFileThumbnailCollectionItemView_detailImageView {}
Supported
IMAGE
properties:tint-color: Color;
Supported
BUTTON
class paths:fdlFUIAddButtonCell_addButton {}
Supported
BUTTON
properties:image: Image; tint-color: Color;
Supported
CELL
class paths:`fdlFUIAttachmentsFormCell_thumbnailCell {}` fdlFUIAttachmentsFormCell_addButtonCell {}
Supported
CELL
properties:border-color: Color; border-width: Integer; corner-radius: Integer;
Supported style classes
See moreDeclaration
Swift
open class FUIAttachmentsCollectionViewCell : FUIInlineValidationDrawingCollectionViewCell<FUIAttachmentCellView>, FUIStateTintable
- The reusable UI component implemented as a
-
Undocumented
Declaration
Swift
open class FUIAttachmentCellView : FUITintableDrawingView<FUIControlState>
-
The reusable UI component implemented as a
UICollectionViewCell
to allow users to enter notes.The cell height is automatically adjusted to allow all of the content to be displayed. However, the cell height is also limited to the height of the screen above the soft keyboard height.
Usage
The following is an example of usage in an application with
UIViewController
andUICollectionViewDataSource
:override func viewDidLoad() { super.viewDidLoad() self.collectionView.register(FUINoteCollectionViewCell.self, forCellReuseIdentifier: FUINoteCollectionViewCell.reuseIdentifier) } override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UITableViewCell { let cell = self.collectionView.dequeueReusableCell(withReuseIdentifier: FUINoteCollectionViewCell.reuseIdentifier, for: indexPath) as! FUINoteCollectionViewCell cell.onChangeHandler = { [unowned self] newValue in self.noteText = newValue } cell.placeholder.text = "Enter Description" cell.value = noteText cell.isTrackingLiveChanges = true return cell }
Theming
Supported
TEXT
class paths:fdlFUINoteFormCell_valueText {} fdlFUINoteFormCell_placeholder {}
Supported
TEXT
properties:font-color: Color; font-style: UIFontTextStyle;
Supported
TINTABLE
class paths:fdlFUIKeyValueFormCell_valueText {}
Supported
TINTABLE
properties:
See moretint-color { -disabled }: Color; font-style { -disabled }: UIFontTextStyle;
Declaration
Swift
@IBDesignable open class FUINoteCollectionViewCell : FUIInlineValidationDrawingCollectionViewCell<FUINoteFormCellContentView>
-
The reusable UI component implemented as a
UICollectionViewCell
to display or edit a textfield.The developer should set the following properties on the cell in their implementation of the
UITableViewDataSource
cellForRow(at:)
function:keyName
: The key name of the property.value
: The value of the property.
And, an
onChangeHandler
:onChangeHandler
: a handler closure that is invoked on changes to the value.
Optionally, the developer may provide
isEditable
: Indicates whether the cell’s value may be modified. The default istrue
.isStacked
: A Boolean value to determine whether the cell should use a stacked or linear layout. If the device’s accessibility settings font size is increased, the cell will force a stacked layout. By default, this property is set totrue
.maxKeyWidth
: The maximum width of the key with a linear layout. By default, the width is 115 for compact and 160 for regular. The set value must meet the minimum default threshold.alternativeInputButton
: AnFUIButton
that manages an alternative method to fill thetextField
.isAlternativeInputEnabled
: ABool
that shows or hides thealternativeInputButton
. This button will indicate whetherisAlternativeInputEnabled
andisEditable
aretrue
.
Color settings:
Manage the color of the control by programmatically setting the
textColor
andtintColor
.The following is an example of usage in an application with
UIViewController
andUICollectionViewDataSource
:override func viewDidLoad() { super.viewDidLoad() self.collectionView.register(FUITextFieldCollectionViewCell.self, forCellReuseIdentifier: FUITextFieldCollectionViewCell.reuseIdentifier) } override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell { let cell = tableView.dequeueReusableCell(withIdentifier: FUITextFieldCollectionViewCell.reuseIdentifier, for: indexPath) as! FUITextFieldCollectionViewCell cell.keyName = "Editable" cell.value = myObject.productName // MARK: implement onChangeHandler cell.onChangeHandler = { newValue in myObject.productName = newValue } // MARK: Implement alternative input, i.e. use OCR to capture input cell.isAlternativeInputEnabled = true let inputImage = FUIIconLibrary.system.camera cell.alternativeInputButton.setImage(inputImage.withRenderingMode(.alwaysTemplate), for: .normal) cell.alternativeInputButton.didSelectHandler = { [weak self, weak cell] (button) in //Import SAPML to use OCR capability let textRecController = FUITextRecognitionViewController() textRecController.recognitionView.observationHandler = { [unowned textRecController] observations in let filteredObservations = <#filter out unwanted text#> textRecController.recognitionView.showTexts(for: filteredObservations) let areObservationsValid = <#filteredObservations meets desired criteria#> if areObservationsValid { DispatchQueue.main.async { cell?.value = filteredObservations.map { $0.value }.joined(separator:" ") } return true } return false } textRecController.onClose = { self?.dismiss(animated: true) } self?.present(UINavigationController(rootViewController: textRecController), animated: true) } return cell }
## Theming
nuiClass
:fdlFUITextFieldFormCell {}
Supported
TEXT
class paths:fdlFUITextFieldFormCell_keyText {} fdlFUITextFieldFormCell_valueText {}
Supported
TEXT
properties:font-color: Color; placeholder-color: Color; font-style: UIFontTextStyle;
Supported
BUTTON
class paths:fdlFUITextFieldFormCell_alternativeInputButton {}
Supported
BUTTON
properties:
See morebackground-color: Color; font-color: Color;
Declaration
Swift
open class FUITextFieldCollectionViewCell : FUIInlineValidationDrawingCollectionViewCell<FUITextFieldContentView>, FUIFormCell
-
UITableViewDiffableDataSource subclass to support editing for the cells in table view.
See moreDeclaration
Swift
open class FUIEditableTableViewDiffableDataSource<SectionIdentifierType, ItemIdentifierType> : UITableViewDiffableDataSource<SectionIdentifierType, ItemIdentifierType> where SectionIdentifierType : Hashable, ItemIdentifierType : Hashable
-
This class is an implementation of
FUIAttachmentAction
to allow users to choose items usingPHPickerViewController
from the Photo Library as attachments inFUIAttachmentsFormView
.The implementation uses a
See morePHPickerViewController
to let user choose items from Photo Library.Declaration
Swift
@available(iOS 14.0, *) open class FUIAddPhotoLibraryItemsAttachmentAction : FUIAttachmentAction
extension FUIAddPhotoLibraryItemsAttachmentAction: PHPickerViewControllerDelegate
-
This class is an implementation of
FUIAttachmentAction
to allow user to choose a file usingUIDocumentPickerViewController
as an attachment inFUIAttachmentsFormView
.If the application wants to have its
Document
directory accessible by theUIDocumentPickerViewController
, the application needs to have the following 2 properties set to true in its plist:- “Supports opening documents in place” (LSSupportsOpeningDocumentsInPlace)
- “Application supports iTunes file sharing” (UIFileSharingEnabled)
Note that the file URL returned by the document picker is a temporary url. The content of the file may not be available after the document picker is closed. Therefore, developer should copy the file content to a location that it may attach the file content later.
class TestFormTableViewController: FUIFormTableViewController { override func viewDidLoad() { // ... // prepare temporary directory to hold attachment files } // ... override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { // ... let cell = tableView.dequeueReusableCell(withIdentifier: FUIAttachmentsFormCell.reuseIdentifier, for: indexPath) as! FUIAttachmentsFormCell cell.attachmentsController.delegate = self cell.attachmentsController.dataSource = self cell.attachmentsController.reloadData() let documentPickerAction = FUIDocumentPickerAttachmentAction() documentPickerAction.delegate = self cell.attachmentsController.addAttachmentAction(documentPickerAction) return cell } } extension TestFormTableViewController: FUIDocumentPickerAttachmentActionDelegate { var documentPicker: UIDocumentPickerViewController { return UIDocumentPick erViewController(documentTypes: ["public.data"], in: .import) } func documentPickerAttachmentAction(_ action: FUIDocumentPickerAttachmentAction, didPickFileAt url: URL) { if let savedUrl = saveFileToTempFolder(url) { self.addAttachmentURL(savedUrl) } self.tableView.reloadSections(IndexSet(integer:self.attachmentSection), with: .automatic) } }
Attention
The delegate object with type
See moreFUIDocumentPickerAttachmentActionDelegate
is declared as a weak reference. On deallocation it will be automatically set to nil. To keep it alive as expected, developer should retain the delegate object during its whole execution scope.Declaration
Swift
open class FUIDocumentPickerAttachmentAction : NSObject, FUIAttachmentAction
extension FUIDocumentPickerAttachmentAction: UIDocumentPickerDelegate
-
Base inner view for
See moreFUIButtonCollectionViewCell
.Declaration
Swift
open class FUIButtonFormView : FUIBaseDrawingView
-
A
UICollectionViewCell
subclass that allows a user to read or enter a value, using a date picker.And an
onChangeHandler
:onChangeHandler
: a handler closure that is invoked on changes to the value
Optionally,
UITableViewController
could provide:dateFormatter
: A developer-definedUIDateFormatter
for transposing betweenDate
type andString
.datePickerMode
: TheUIDatePicker.Mode
for the Date Picker. The default is.dateAndTime
. Note that.countDownTimer
mode is not supported. Use theFUIDurationPickerFormCell
for duration values.
Example of usage in an application,
UICollectionViewController
:let dateFormatter = DateFormatter() override func viewDidLoad() { super.viewDidLoad() dateFormatter.dateFormat = "dd-MM-yyyy" self.collectionView.register(FUIDatePickerCollectionViewCell.self, forCellWithReuseIdentifier: FUIDatePickerCollectionViewCell.reuseIdentifier) // ... } override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell { let cell = collectionView.dequeueReusableCell(withReuseIdentifier: FUIDatePickerCollectionViewCell.reuseIdentifier, for: indexPath) as! FUIDatePickerCollectionViewCell cell.keyName = "End Date" cell.dateFormatter = dateFormatter cell.datePickerMode = .date cell.value = Date // MARK: implement onChangeHandler cell.onChangeHandler = { [unowned cell] newValue in cell.value = newValue } return cell }
Theming
Supported
TEXT
class paths:fdlFUIDatePickerCollectionViewCell_title fdlFUIDatePickerCollectionViewCell_valueText {}
Supported
TEXT
properties:font-color: Color; font-style: UIFontTextStyle;
Supported
TINTABLE
class paths:fdlFUIDatePickerCollectionViewCell_valueText {}
Supported
TINTABLE
properties:font-color { -selected }: Color; font-style { -selected }: UIFontTextStyle;
Declaration
Swift
open class FUIDatePickerCollectionViewCell : FUIBaseDrawingCollectionViewCell<FUIDatePickerContentView>
-
The basic inner view for
See moreFUIDatePickerCollectionViewCell
.Declaration
Swift
open class FUIDatePickerContentView : FUITintableDrawingView<FUIControlState>, FUITitleMultiLineComponent, FUIValueComponent, FUIDatePickerComponent
-
A
UICollectionViewCell
subclass, which allows a user to read or enter a value, using a duration picker.The developer should set the following properties on the cell, in their implementation of
UICollectionViewDataSource
cellForRow(at:)
function:title
: The key name of the propertyvalue
: The value of the property, asTimeInterval
And an
onChangeHandler
:onChangeHandler
: a handler closure, which is invoked on changes to the value
Optionally, the developer may provide
minuteInterval
: The minute interval to be used in the picker.isEditable
: Indicates if the cell’s value may be modified. Defaults totrue
.
Color configuration:
Call setTintColor(_:for:) to configure tint color for disabled, normal, selected
UIControlState
. SettingtintColor
is equivalent to call setTintColor(color, for: UIControlState.normal).- disabled: Color to be used when control is disabled.
- normal: Color to be used when control is enabled.
- selected: Color to be used when control is selected.
The following is an example of usage in an application
UICollectionViewController
:override func viewDidLoad() { super.viewDidLoad() self.collectionView.register(FUIDurationPickerCollectionViewCell, forCellReuseIdentifier: FUIDurationPickerCollectionViewCell.reuseIdentifier) // ... } override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell { let cell = collectionView.dequeueReusableCell(withReuseIdentifier: FUIDurationPickerCollectionViewCell.reuseIdentifier, for: indexPath) as! FUIDurationPickerCollectionViewCell cell.title.text = "Duration" cell.value = myObject.eventDuration // in seconds // MARK: implement an onChangeHandler cell.onChangeHandler = { newValue in myObject.eventDuration = newValue } return cell }
## Theming Supported style classes
See morefdlFUIDurationPickerFormCell fdlFUIDurationPickerFormCell_keyLabel fdlFUIDurationPickerFormCell_valueLabel fdlFUIDurationPickerFormCell_valueLabel_selected
Declaration
Swift
open class FUIDurationPickerCollectionViewCell : FUIBaseDrawingCollectionViewCell<FUIDurationPickerContentView>
-
Undocumented
See moreDeclaration
Swift
open class FUIDurationPickerContentView : FUITintableDrawingView<FUIControlState>, FUITitleMultiLineComponent, FUIValueComponent, FUIDurationPickerComponent
extension FUIDurationPickerContentView: UIPickerViewDelegate
extension FUIDurationPickerContentView: UIPickerViewDataSource
-
The content view of a form cell.
See moreDeclaration
Swift
open class FUIFormCellContentView<ValueView, T, Text> : FUITintableDrawingView<T> where ValueView : UIView, ValueView : Initializable, T : Defaultable, T : Enableable, T : Hashable, Text : FUITextProtocol, Text : Initializable
-
When
FUIListPickerCollectionViewCell
s are to be used in an application, the application’s implementation ofUICollectionViewController
that hosts theseFUIListPickerCollectionViewCell
s must be a subclass of thisFUIFormCollectionViewController
.FUIFormCollectionViewController
hides all the complexity and interactions for handlingFUIListPickerCollectionViewCell
.The application’s implementation of the
UICollectionViewController
needs to only implement the following functions:
See moreclass FormCollectionViewCellTestTVC: UICollectionViewController { override func viewDidLoad() { // MUST: Call viewDidLoad function of super class. super.viewDidLoad() // Register FUIFormCells that will be used self.collectionView.register(FUIListPickerCollectionViewCell.self, forCellWithReuseIdentifier: FUIListPickerCollectionViewCell.reuseIdentifier) ... } override func numberOfSections(in collectionView: UICollectionView) -> Int { // Return how many sections are in the collection return ... } override func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int { // Return number of items in each section return ... } override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell { let cell = collectionView.dequeueReusableCell(withReuseIdentifier: FUIListPickerCollectionViewCell.reuseIdentifier, for: indexPath) as! FUIListPickerCollectionViewCell cell.keyName = "Pick One" cell.isEnabled = true // MARK: implement onChangeHandler cell.onChangeHandler = { newValue in myObject.title = newValue } return cell }
Declaration
Swift
open class FUIFormCollectionViewController : UICollectionViewController
-
A
UICollectionViewCell
subclass that allows a user to read or enter a set of values using a grid of buttons. This is commonly used for composing filters.The developer should set the following properties on the cell in their implementation of the
UICollectionViewDataSource
cellForItem(at:)
function:title
: The title of the property.value
: An array of the selected indexes in the control. Uses the same index as thevalueOptions
array.- `valueOptions: A string array of titles for the buttons in the control
And an
onChangeHandler
:onChangeHandler
: a handler closure, which is invoked on changes to the value
Optionally, the developer may provide:
allowsMultipleSelection
: Indicates whether multiple buttons may be selected simultaneously (true
). Iffalse
, the control behaves in “radio” mode. The default istrue
.allowsEmptySelection
: Indicates whether the control allows zero items to be selected (true
). If false, then once a value has been selected by the developer or user, taps by the user on the last selected item will be ignored instead of deselecting the item. The default istrue
.isEditable
: Indicates whether the cell’s value may be modified. The default istrue
.
The following is an example of usage in an application,
UICollectionViewController
:// optionally, create an array of value option to localized string mappings let buttonTitles: [[String: String]] = [["radius": "Distance"], ["price": "Price"], ["rating": "Ratings"], ["avail": "Availability"]] // Register FUIFilterFormCollectionViewCell in viewDidLoad() method in the controller. override func viewDidLoad() { super.viewDidLoad() self.collectionView.register(FUIFilterFormCollectionViewCell.self, forCellWithReuseIdentifier: FUIFilterFormCollectionViewCell.reuseIdentifier) } func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell { let cell = collectionView.dequeueReusableCell(withReuseIdentifier: FUIFilterFormCollectionViewCell.reuseIdentifier, for: indexPath) as! FUIFilterFormCollectionViewCell cell.valueOptions = buttonTitles.flatMap { $0.map { $0.value }} cell.title = "Sort By" cell.value = [1] cell.allowsMultipleSelection = true cell.allowsEmptySelection = false // MARK: implement onChangeHandler cell.onChangeHandler = { [weak self] newValue in self.applyFilter(forDimensions: newValue) // here, the cell input is set to a filter function } return cell }
## Theming Supported style classes:
See morefdlFUIFilterFormCollectionViewCell fdlFUIFilterFormCollectionViewCell_title fdlFUIFilterFormCollectionViewCell_item_contentView fdlFUIFilterFormCollectionViewCell_item_titleLabel fdlFUIFilterFormCollectionViewCell_item_contentView_selected fdlFUIFilterFormCollectionViewCell_item_titleLabel_selected
Declaration
Swift
open class FUIFilterFormCollectionViewCell : FUIInlineValidationDrawingCollectionViewCell<FUIFilterFormView>, FUIFormCell
-
Undocumented
See moreDeclaration
Swift
open class FUIFilterFormView : FUIFormCellContentView<FUIFilterValueView, FUIControlState, FUIMultiLineText>, FUITitleMultiLineComponent, FUIPropertyFormCell
-
Undocumented
See moreDeclaration
Swift
public class FUIFilterValueView : UIControl, Initializable, UICollectionViewDataSource, UICollectionViewDelegateFlowLayout
-
Undocumented
See moreDeclaration
Swift
open class FUIInlineValidationDrawingCollectionViewCell<InnerView> : FUIBaseDrawingCollectionViewCell<InnerView>, InnerViewContainerEventHandling, FUIInlineValidation where InnerView : FUIBaseFixedMarginsView, InnerView : FUIBackgroundSchemeSupporting, InnerView : FUICalculateLayout, InnerView : FUIStyleByStringAttributes
-
Undocumented
See moreDeclaration
Swift
open class FUIInlineValidationUIControlTintTableViewCell : FUIInlineValidationTableViewCell, FUIStyleByTintAttributes
-
Base inner view to display a key-value pair property for
FUIListPickerCollectionViewCell
.Please refer to the
See moreFUIListPickerCollectionViewCell
documentation for details.Declaration
Swift
public class FUIListPickerFormView : FUIDrawingView, FUITitleMultiLineComponent, FUIValueComponent
-
The section header view for the
FUIListPickerTableViewController
.Theming
Supported style classes
See morefdlFUIListPickerHeaderView fdlFUIListPickerHeaderView_titleLabel
Declaration
Swift
public class FUIListPickerHeaderView : UITableViewHeaderFooterView
-
Base view for map snapshot form cell. Typically not used directly by developer.
See moreDeclaration
Swift
public class FUIFormEntryView<FormValueView> : FUIBaseDrawingView, FUITitleComponent, FUIStatusComponent, FUIAttributesProvider where FormValueView : UIView
-
Inner content view for map snapshot form cell. Typically not used directly by developer.
Declaration
Swift
public class FUIMapSnapshotContentView : FUIFormEntryView<FUITextKitView>
-
Map snapshot form cell, where the custom geometry is shown on a map-based imagery.
Developer may specify the geometry object to display, and configure the title text, status text, and accessory type.
This cell height is automatically adjusted to allow the whole content to be displayed.
Usage
See morelet snapshotFormCell = tableView.dequeueReusableCell(withIdentifier: FUIMapSnapshotFormCell.reuseIdentifier, for: indexPath) as! FUIMapSnapshotFormCell snapshotFormCell.title.text = "Location" snapshotFormCell.geometry = self.provider?.editingGeometry if let coordinates = snapshotFormCell.coordinates { let numOfPoints = coordinates.count snapshotFormCell.status.text = numOfPoints > 1 ? "\(numOfPoints) Points Added" : "\(numOfPoints) Point Added" } snapshotFormCell.accessoryType = .disclosureIndicator return snapshotFormCell
Declaration
Swift
public class FUIMapSnapshotFormCell : FUIBaseDrawingTableViewCell<FUIMapSnapshotContentView>
-
The base class for auto-fitting form table view cell, such as
FUINoteFormCell
.Declaration
Swift
open class FUIAutofittingDrawingTableViewCell<InnerView> : FUIInlineValidationDrawingTableViewCell<InnerView> where InnerView : FUIBaseFixedMarginsView, InnerView : FUIBackgroundSchemeSupporting, InnerView : FUICalculateLayout, InnerView : FUIStyleByStringAttributes
-
The content view of a
See moreFUINoteFormCell
.Declaration
Swift
open class FUINoteFormCellContentView : FUIFormCellContentView<FUITextView, FUIControlState, FUIText>, FUITitleComponent, FUIValueComponent, FUIPlaceholderComponent, FUISubtitleComponent, UITextViewDelegate
-
FUIOrderPickerFormCell
is aUITableViewCell
subclass, which is used in the advanced sort pattern when there are multiple sort criteria involved. The component allows users to adjust priority of sort criteria and switch order direction flexibly.## Usage Example:
let cell = tableView.dequeueReusableCell(withIdentifier: FUIOrderPickerFormCell.reuseIdentifier, for: indexPath) as! FUIOrderPickerFormCell cell.value = [ FUISortCriterion(criterion: FUIMultiLineText("Priority"), isSelected: true, isAscending: false, ascendingText: FUIMultiLineText("Lowest first"), descendingText: FUIMultiLineText("Highest first")), FUISortCriterion(criterion: FUIMultiLineText("Name"), isSelected: false, isAscending: true, ascendingText: FUIMultiLineText("Ascending"), descendingText: FUIMultiLineText("Descending")) ] cell.onChangeHandler = { [unowned self] change, newValue in // change contains the info about immediate change to sort criterions // newValue contains the latest array of sort criterions } return cell // more customization options // change the title cell.title = FUIText("Order by", font: UIFont.preferredFioriFont(forTextStyle: .largeTitle), textColor: UIColor.preferredFioriColor(forStyle: .negativeLabel)) // change the selected icon for all sort criterions let config = UIImage.SymbolConfiguration(font: UIFont.preferredFioriFont(forTextStyle: .body)) let icon = UIImage(systemName: "checkmark.circle", withConfiguration: config) cell.selectedIcon = icon // change the appearance of labels in sort criterion with font, textColor and numberOfLines in FUIMultiLineText FUIMultiLineText("Priority", font: UIFont.preferredFioriFont(forTextStyle: .body), textColor: UIColor.purple) // other options cell.isAtLeastOneSelected = false cell.isContentCopyable = false
## Theming
Supported
TEXT
class paths:fdlFUIOrderPickerFormCell_title fdlFUIOrderPickerFormItemCell_title {} fdlFUIOrderPickerFormItemCell_subtitle {}
Supported
TEXT
properties:font-color: Color; font-style: UIFontTextStyle;
Supported
IMAGE
class paths:fdlFUIOrderPickerFormItemCell_leadingImageView {}
Supported
IMAGE
properties:image-name: UIImage; font-style: UIFontTextStyle; tint-color: UIColor;
See Theming support in
See moreFUIOrderPickerFormView
andFUIOrderPickerFormItemView
Declaration
Swift
public class FUIOrderPickerFormCell : FUIBaseDrawingTableViewCell<FUIOrderPickerFormView>, FUIContentCopyable, FUITableAndCollectionCellUpdate
-
The table view cell in
FUIOrderPickerFormCell
Theming
Supported
TEXT
class paths:fdlFUIOrderPickerFormItemView_title {} fdlFUIOrderPickerFormItemView_subtitle {}
Supported
TEXT
properties:font-color: Color; font-style: UIFontTextStyle;
Supported
IMAGE
class paths:fdlFUIOrderPickerFormItemView_leadingImageView {}
Supported
IMAGE
properties:
See moreimage-name: UIImage; font-style: UIFontTextStyle; tint-color: UIColor;
Declaration
Swift
public class FUIOrderPickerFormItemCell : FUIBaseDrawingTableViewCell<FUIOrderPickerFormItemView>, FUIContentCopyable
-
The content view of
See moreFUIOrderPickerFormItemCell
. Standard Fiori control for rendering business object data.Declaration
Swift
public class FUIOrderPickerFormItemView : FUITintableDrawingView<FUIControlState>, FUITitleMultiLineComponent, FUISubtitleMultiLineComponent, FUILeadingImageViewComponent, FUIContentCopyable
-
The content view of
See moreFUIOrderPickerFormCell
. Standard Fiori control for rendering business object data.Declaration
Swift
public class FUIOrderPickerFormView : FUITintableDrawingView<FUIControlState>, FUITitleComponent, FUIContentCopyable, UITableViewDataSource, UITableViewDelegate
-
A slider form cell displays a continuous range of values along a track where the user slides a handle using their thumb between the lower (minimum) value of the range and the upper (maximum value) of the range. The custom range slider supports both a single thumb or double thumb.
Note: In voiceover mode, and when focusing on the thumb, the user can swipe up or down to change the value or double tap and hold to continuously change the value.
See moreDeclaration
Swift
open class FUIRangeSlider : UIControl
-
The content view of the
See moreFUIRangeSliderFormCell
orFUIRangeSliderCollectionViewCell
.Declaration
Swift
open class FUIRangeSliderContentView : FUIFormCellContentView<FUITextField, FUIControlState, FUIText>, FUITitleComponent, FUISubtitleComponent, UITextFieldDelegate
-
FUIRatingControl
uses images to represent a rating.The number of “On” images denotes the rating. The default “On” image is a filled star while the default “Off” inmage is an unfilled star.
When the
style
property is.editable
, user can tap an individual image to set the rating. Users can also slide their finger from side to side over the control to select the rating. TheFUIRatingControl
will sendUIControl.Event.valueChanged
event when rating changed.Theming
Supported
FUIRatingControl
class paths:fdlFUIRatingControl
Supported
RatingControl
properties:
See moreon-color { -standard | -accented | -editable-disabled | -editable-disabled }: Color; off-color { -standard | -accented | -editable-disabled | -editable-disabled }: Color; on-image { -standard | -editable }: Image; off-image { -standard | -editable }: Image;
Declaration
Swift
open class FUIRatingControl : UIControl, Initializable
-
This is the content view of the
FUIRatingControlFormCell
.This view includes a
See moreFUITextKitView
for title, aFUIRatingControl
for the rating control, and anotherFUITextKitView
for subtitle. Whensubtitle
is not nil, the title will not be displayed.Declaration
Swift
open class FUIRatingControlContentView : FUIFormCellContentView<FUIRatingControl, FUIControlState, FUIText>, FUITitleComponent, FUIPropertyFormCell, FUISubtitleComponent
-
The reusable UI component implemented as an
UITableViewCell
which includes aFUIRatingControl
to allow user select a rating.This form cell uses
FUIRatingControlContentView
as its content view.FUIRatingControlContentView
includes aFUITextKitView
for hosting thekeyName
property, aFUIRatingControl
for the rating control, and anotherFUITextKitView
for subtitle.When the
text
insubtitle
is not nil, the title will not be displayed.Control Styles
The available style for the
FUIRatingControl
can be set by developer toeditable
,editableDisabled
,standard
, oraccented
.Example
control.style = .editable control.ratingBounds = 0...5 control.rating = 3 control.onImage = UIImage(named: "filledStar").withRenderingMode(.alwaysTemplate) control.onImage = UIImage(named: "openStar").withRenderingMode(.alwaysTemplate) control.setTintColor(.orange, for: 0..<1) control.setTintColor(.red, for: 1..<5) control.setTintColor(.purple, for: 5..<6)
Theming
nuiClass
:fdlFUIRatingControlFormCell {}
Supported
TEXT
class paths:fdlFUIRatingControlFormCell_title {}
Supported
TEXT
properties:font-color: Color; font-style: UIFontTextStyle;
Supported
FUIRatingControl
class path:fdlFUIRatingControlFormCell_ratingControl
Supported
RatingControl
properties:
See moreon-color { -standard | -accented | -editable-disabled | -editable-disabled }: Color; off-color { -standard | -accented | -editable-disabled | -editable-disabled }: Color; on-image { -standard | -editable }: Image; off-image { -standard | -editable }: Image;
Declaration
Swift
open class FUIRatingControlFormCell : FUIInlineValidationDrawingTableViewCell<FUIRatingControlContentView>
-
A
UICollectionViewCell
subclass that allows a user to view or select from a list of strings using a Fiori-styled segmented control.The
value
property of the cell is equal to theselectedSegmentIndex
in the segmented control.Specify segment heights by setting the
segmentHeight
API. By default this is set to nil, which means a segment will adjust its height to fit the content.Color setting:
Setting the text color of buttons in the cell for a state using the
setButtonAttributes(_:for:)
API. The supported states are:disabled
,normal
, andselected
.let attributes = FUISegmentedControlButtonAttributes() attributes.titleAttributes = ... attributes.borderColor = ... cell.setButtonAttributes(attributes, for: .normal)
Code Usage
// Optionally, create an array of value options to localized string mappings. let buttonTitles: [[String: String]] = [["LO": "Low"], ["MED": "Medium"], ["HI": "High"]] // Register `FUISegmentedControlCollectionViewCell` in the `viewDidLoad()` method in the controller. override func viewDidLoad() { super.viewDidLoad() self.collectionView.register(FUISegmentedControlCollectionViewCell.self, forCellReuseIdentifier: FUISegmentedControlCollectionViewCell.reuseIdentifier) } func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell { let cell = collectionView.dequeueReusableCell(withReuseIdentifier: FUISegmentedControlCollectionViewCell.reuseIdentifier, for: indexPath) as! FUISegmentedControlCollectionViewCell cell.valueOptions = buttonTitles.flatMap { $0.map { $0.value } } cell.keyName = "Priority" cell.value = myObject.priority // String value in the valid options set: ["LO", "MED", "HI"] // MARK: implement `onChangeHandler`. cell.onChangeHandler = { newValue in myObject.priority = buttonTitles[newValue].first!.key // lookup valid String value, from the buttonTitles array } return cell }
Theming
Supported style classes
See morefdlFUISegmentedControlCollectionViewCell fdlFUISegmentedControlCollectionViewCell_keyLabel
Declaration
Swift
open class FUISegmentedControlCollectionViewCell : FUIInlineValidationDrawingCollectionViewCell<FUISegmentedControlFormView>, FUIFormCell
-
A base
FUISegmentedControlFormView
that allows a user to view or select from a list of strings using a Fiori-styled segmented control.The
value
property of the cell is equal to theselectedSegmentIndex
in the segmented control.Specify the height for segments by setting the
segmentHeight
API. By default it is set to nil, which means the segment will adjust its height to fit the content.Color setting:
Setting the text color of buttons in the cell for a state using the
setButtonAttributes(_:for:)
API. The supported states are:disabled
,normal
, andselected
.let attributes = FUISegmentedControlButtonAttributes() attributes.titleAttributes = ... attributes.borderColor = ... self.setButtonAttributes(attributes, for: .normal)
Code Usage
// Optionally, create an array of value option to localized string mappings let buttonTitles: [[String: String]] = [["LO": "Low"], ["MED": "Medium"], ["HI": "High"]] let view = FUISegmentedControlFormView() view.valueOptions = buttonTitles.flatMap { $0.map { $0.value } } view.keyName = "Priority" view.value = myObject.priority // String value in the valid options set: ["LO", "MED", "HI"] // MARK: implement `onChangeHandler`. view.onChangeHandler = { newValue in myObject.priority = buttonTitles[newValue].first!.key // lookup valid String value, from the buttonTitles array }
Theming
Supported style classes
See morefdlFUISegmentedControlFormView fdlFUISegmentedControlFormView_keyLabel
Declaration
Swift
open class FUISegmentedControlFormView : FUIBaseDrawingView
extension FUISegmentedControlFormView: UICollectionViewDataSource, UICollectionViewDelegateFlowLayout
-
The content view of a
FUIInlineSignatureFormCell
.Theming
Supported
FUIInlineSignatureFormView
class path:fdlFUIInlineSignatureFormView
Supported
FUIInlineSignatureFormView
properties:stroke-width: (Number) stroke-color: (Color) drawing-area-background-color: (Color) xmark-color: (Color) signature-line-color: (Color)
Supported
Text
class path:fdlFUIInlineSignatureFormView_title fdlFUIInlineSignatureFormView_startActionTitle fdlFUIInlineSignatureFormView_restartActionTitle fdlFUIInlineSignatureFormView_cancelActionTitle fdlFUIInlineSignatureFormView_clearActionTitle fdlFUIInlineSignatureFormView_saveActionTitle fdlFUIInlineSignatureFormView_watermarkText
Supported
Text
properties:
See morefont-color: Color; font-style: UIFontTextStyle;
Declaration
Swift
public class FUIInlineSignatureFormView : FUIBaseDrawingView, FUISignatureDrawingPadComponent, FUITitleComponent, FUIStartActionComponent, FUIRestartActionComponent, FUICancelActionComponent, FUIClearActionComponent, FUISaveActionComponent, FUIWatermarkTextComponent
-
The content view of
FUISliderCollectionViewCell
.Theming
Supported style classes.
See moreFUISliderFormView FUISliderFormView_title FUISliderFormView_subtitle FUISliderFormView_footnote { font-color { -disabled } (Color) font-style { -disabled } (UIFont.TextStyle) } FUISliderFormView_slider { thumb-color { -disabled } (Color) minimum-track-color { -disabled } (Color) maximum-track-color { -disabled } (Color) view-alpha-value { -disabled } (Float) }
Declaration
Swift
open class FUISliderFormView : FUIFormCellContentView<UISlider, FUIControlState, FUIMultiLineText>, FUISliderComponent, FUISubtitleMultiLineComponent
-
The content view of an
See moreFUIStepperFormCell
.Declaration
Swift
open class FUIStepperView : FUIFormCellContentView<FUITextField, FUIControlState, FUIText>, FUITitleComponent, FUIValueComponent, FUISubtitleComponent, UITextFieldDelegate
-
The content view of a
See moreFUISwitchFormCell
.Declaration
Swift
open class FUISwitchFormView : FUIFormCellContentView<UISwitch, FUISwitchControlState, FUIMultiLineText>, FUISwitchComponent, FUITitleMultiLineComponent
-
This is an implementation of
FUIFormattedStringEditing
on top of the regular iOSNumberFormatter
.The main enhancement is to add the support to handle cursor positions.
Here are two examples when using with the
FUITextFieldFormCell
:As a currency number formatter
let cell = tableView.dequeueReusableCell(withIdentifier: FUITextFieldFormCell.reuseIdentifier) as! FUITextFieldFormCell cell.keyName = "Price" cell.keyboardType = .decimalPad let formatter = FUINumberFormatter() formatter.numberStyle = .currency cell.formatter = formatter ...
The text field will display “$12.34” when user types “12.34”.
With custom suffix
let cell = tableView.dequeueReusableCell(withIdentifier: FUITextFieldFormCell.reuseIdentifier) as! FUITextFieldFormCell cell.keyName = "Weight" cell.keyboardType = .decimalPad let formatter = FUINumberFormatter() formatter.numberStyle = .decimal formatter.maximumFractionDigits = 3 formatter.positiveSuffix = "lbs" cell.formatter = formatter
The text field will display “1.234lbs” when user types “1.234”.
Declaration
Swift
open class FUINumberFormatter : NumberFormatter, FUIFormattedStringEditing
-
A
FUIFormattedStringEditing
implementation to format phone number.This formatter accepts only digit characters 0 through 9. All other characters user typed are ignored.
The default format is “(###) ###-####”. Which correspond to US phone number system. Developer could change the format to fit phone number for other countries.
See moreDeclaration
Swift
open class FUIPhoneNumberFormatter : FUIFormattedStringEditing
-
The content view of an
See moreFUITextFieldFormCell
.Declaration
Swift
open class FUITextFieldContentView : FUIFormCellContentView<FUITextField, FUIControlState, FUIText>, FUITitleComponent, FUIValueComponent, FUIPlaceholderComponent, FUISubtitleComponent, FUIPropertyFormCell, UITextFieldDelegate
-
The reusable UI component implemented as a
UICollectionViewCell
, allowing the user to enter a value using aUITextField
.value
: The value of the property, asString
And an
onChangeHandler
:onChangeHandler
: a handler closure that is invoked on changes to the value.
Optionally, the developer may provide:
isEditable
: Indicates whether the cell’s value may be modified. The default istrue
.
Color settings:
Setting
tintColor
forvalueTextField
for a state using thesetTintColor(_:for:)
API. Currentlydisabled
andnormal
are supported.cell.setAttributes([.foregroundColor: UIColor.red], for: .valueText, state: .normal)
Remark
Thefont-color
attribute will be overridden by thetint-color-disabled
attribute when the cell is switched to thedisabled
state. Do not settextColor
forvalueTextField
when the cell is in thedisabled
state.Example of usage in an application,
UICollectionViewController
:override func viewDidLoad() { super.viewDidLoad() self.collectionView.register(FUITitleFormCollectionViewCell.self, forCellWithReuseIdentifier: FUITitleFormCollectionViewCell.reuseIdentifier) // ... } override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell { let cell = collectionView.dequeueReusableCell(withReuseIdentifier: FUITitleFormCollectionViewCell.reuseIdentifier, for: indexPath) as! FUITitleFormCollectionViewCell cell.placeholderText = placeHolderText cell.value = myObject.title cell.isEditable = true // MARK: implement onChangeHandler cell.onChangeHandler = { newValue in myObject.title = newValue } return cell }
## Theming
Supported
TableViewCell
class paths:fdlFUITitleFormCell {}
Supported
TableViewCell
attributes:background-color (Color) background-color-disabled (Color) background-color-readonly (Color)
Supported
TextField
class paths:fdlFUITitleFormCell_valueTextField
Supported
TextField
properties:
See morefont-color: Color; font-color-disabled: Color; font-color-readonly: Color; placeholder-color: Color; font-style: UIFontTextStyle; font-style-disabled: UIFontTextStyle; font-style-readonly: UIFontTextStyle;
Declaration
Swift
open class FUITitleFormCollectionViewCell : FUIInlineValidationDrawingCollectionViewCell<FUITitleFormView>
extension FUITitleFormCollectionViewCell: FUITintAttributesProvider
-
The content view of an
See moreFUITitleFormCollectionViewCell
.Declaration
Swift
open class FUITitleFormView : FUIFormCellContentView<FUITextField, FUIControlState, FUIText>
extension FUITitleFormView: UITextFieldDelegate
-
A
UICollectionViewCell
subclass that allows a user to read or enter a value using a picker view.And an
onChangeHandler
:onChangeHandler
: a handler closure that is invoked on changes to the value
Example of usage in an application,
UICollectionViewController
:override func viewDidLoad() { super.viewDidLoad() self.collectionView.register(FUIValuePickerCollectionViewCell.self, forCellWithReuseIdentifier: FUIValuePickerCollectionViewCell.reuseIdentifier) // ... } override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell { let cell = collectionView.dequeueReusableCell(withReuseIdentifier: FUIValuePickerCollectionViewCell.reuseIdentifier, for: indexPath) as! FUIValuePickerCollectionViewCell cell.title.text = "Value Picker Title" cell.valueOptions = ["1", "2", "3"] cell.value = 0 cell.isTrackingLiveChanges = true // MARK: implement onChangeHandler cell.onChangeHandler = { [unowned cell] newValue in cell.value = newValue } return cell }
Theming
Supported
TEXT
class paths:fdlFUIValuePickerCollectionViewCell_title fdlFUIValuePickerCollectionViewCell_valueText {}
Supported
TEXT
properties:font-color: Color; font-style: UIFontTextStyle;
Supported
TINTABLE
class paths:fdlFUIValuePickerCollectionViewCell_valueText {}
Supported
TINTABLE
properties:
See morefont-color { -selected }: Color; font-style { -selected }: UIFontTextStyle;
Declaration
Swift
open class FUIValuePickerCollectionViewCell : FUIBaseDrawingCollectionViewCell<FUIValuePickerContentView>
-
The basic inner view for
See moreFUIValuePickerCollectionViewCell
.Declaration
Swift
open class FUIValuePickerContentView : FUITintableDrawingView<FUIControlState>, FUITitleMultiLineComponent, FUIValueComponent, FUIValuePickerComponent
extension FUIValuePickerContentView: UIPickerViewDelegate, UIPickerViewDataSource
-
The
FUIGridRowSummaryItem
is a subclass ofFUIGridRowTextItem
for representing a summary item inFUIGridTableViewCell
.FUIGridRowSummaryItem
is different fromFUIGridRowTextItem
in terms of style.Theming
Supported style classes
See morefdlFUIGridRowSummaryItem_label
Declaration
Swift
open class FUIGridRowSummaryItem : FUIGridRowTextItem
-
FUIGridTableViewHeaderFooterView
is a FIori UI component that extendsUITableViewHeaderFooterView
for showing a list ofFUIGridRowItem
column titles. It will display as a section header or footer in table view.Columns widths may be specified in absolute points, or as a set of fractions in
0.0..<1
. A developer may also designate one column for flexible width, by assigning the value-1
to that column width.Remark
Developers should always use the same column widths or percents for all headers, footers and rows in a grid. Developers should also set common accessory types to rows, headers and footers.The
FUIGridTableViewHeaderFooterView
is adaptive forregular
andcompact
horizontal content modes. It is hidden by design, when incompact
mode. The AutoLayout automatic dimension technique should be used for computing the height.Example Initialization and Configuration:
override open func viewDidLoad() { super.viewDidLoad() tableView.sectionHeaderHeight = UITableViewAutomaticDimension tableView.estimatedSectionHeaderHeight = 100 tableView.register(FUIGridTableViewHeaderFooterView.self, forHeaderFooterViewReuseIdentifier: FUIGridTableViewHeaderFooterView.reuseIdentifier) }
Override
tableView(_: viewForHeaderInSection:)
dataSource method and configure header.
See more// header data list var headerData: [FUIGridRowItem] { let item0 = FUIGridRowHeaderItem(text: " ") let item1 = FUIGridRowHeaderItem(text: "Symbol") let item2 = FUIGridRowHeaderItem(text: "Open") let item3 = FUIGridRowHeaderItem(text: "High") let item4 = FUIGridRowHeaderItem(text: "Low") let item5 = FUIGridRowHeaderItem(text: "Close") return [item0, item1, item2, item3, item4, item5] } // set column widths. Should be shared by rows and header. let columnWidths = [-1, 0.2, 0.1, 0.1, 0.1, 0.1] // configure header view header.items = headerData header.columnWidthPercent = columnWidths header.accessoryType = .disclosureIndicator // match row cell accessory types!
Declaration
Swift
open class FUIGridTableViewHeaderFooterView : FUIBaseTableViewHeaderFooterView, FUIContentCopyable
-
FUIGridTableViewSummaryFooter
is a Fiori UI component that extendsUITableViewHeaderFooterView
for showing a list ofFUIGridRowItem
column titles. It displays as a section footer in table view.Columns widths may be specified in absolute points, or as a set of fractions in
0.0..<1
. A developer may also designate one column for flexible width, by assigning the value-1
to that column width.Remark
Developers should always use the same column widths or percents for all headers, footers and rows in a grid. Developers should also set common accessory types to rows, headers and footers.The
FUIGridTableViewSummaryFooter
is adaptive forregular
andcompact
horizontal content modes. It is hidden by design, when incompact
mode. The AutoLayout automatic dimension technique should be used for computing the footer height.Example Initialization and Configuration:
override open func viewDidLoad() { super.viewDidLoad() tableView.sectionFooterHeight = UITableViewAutomaticDimension tableView.estimatedSectionFooterHeight = 100 tableView.register(FUIGridTableViewSummaryFooter.self, forHeaderFooterViewReuseIdentifier: FUIGridTableViewSummaryFooter.reuseIdentifier) }
Override
tableView(_: viewForFooterInSection:)
dataSource method and configure header.// header data list var footerData: [FUIGridRowItem] { let item0 = FUIGridRowSummaryItem(text: "Total") let item1 = FUIGridRowSummaryItem(text: "10") let item2 = FUIGridRowSummaryItem(text: "10") let item3 = FUIGridRowSummaryItem(text: "10") let item4 = FUIGridRowSummaryItem(text: "10") let item5 = FUIGridRowSummaryItem(text: "10") return [item0, item1, item2, item3, item4, item5] } // set column widths. Should be shared by rows and header. let columnWidths = [-1, 0.2, 0.1, 0.1, 0.1, 0.1] // configure header view footer.items = headerData footer.columnWidthPercent = columnWidths footer.accessoryType = .disclosureIndicator // match row cell accessory types!
Declaration
Swift
open class FUIGridTableViewSummaryFooter : FUIGridTableViewHeaderFooterView
-
A view controller showing popover list for creating geometry in map view.
Usage
Initialize the popover content view controller.
var popoverContent = FUICreateGeometryPopOverTableViewController()
Define selection behavior and do some setup for map legend items.
See more@objc private func presentCreatePopover() { popoverContent.items = createGeometryItems popoverContent.modalPresentationStyle = .popover let popover = popoverContent.popoverPresentationController let createGeometryResultsController = CreateGeometryResultsController() popoverContent.didSelectHandler = { [unowned self] createItem in createGeometryResultsController.editingGeometryMapLegendItem = createItem self.navigationController?.pushViewController(createGeometryResultsController, animated: true) } popover?.barButtonItem = plusBarButtonItem self.present(popoverContent, animated: true, completion: nil) }
Declaration
Swift
open class FUICreateGeometryPopOverTableViewController : FUIResizablePopoverContainer, UITableViewDelegate, UITableViewDataSource
-
A subclass of
See moreMKPointAnnotation
which conforms toFUIAnnotation
and it is tied to a callout tag showing the name of a route on the map.Declaration
Swift
open class FUICalloutAnnotation : MKPointAnnotation, FUIAnnotation
-
FUIEditingGeometryObject
a generic object that specifies the acceptedFUIGeometryType
, Representation Type, and Map Type.Variables Available in FUIEditingGeometryObject:
geometry
: The geometry associated with the editing objectcachedGeometry
: The cached instance of the geometrycachedIndex
: The cached index for polylines and polygons for their selected index
Methods Available in FUIEditingGeometryObject:
addRepresentation(to context: MapContextType)
: A method to add the geometry to the map.removeRepresentation(from context: MapContextType)
: A method to remove the geometry from the map.redrawRepresentation(in context: MapContextType, with existingCoordinates: [CLLocationCoordinate2D], scheme: FUIBackgroundColorScheme, traits: UIUserInterfaceStyle)
: A method to re-draw the geometry display in the map.
Declaration
Swift
public class FUIEditingGeometryObject<GeometryType, RepresentationType, MapContextType> : FUIManageRepresentation where GeometryType : FUIGeometry
-
Wrapper class of geometry types
Declaration
Swift
public class FUIGeometryBaseTypeWrapper<PointType, PolylineType, PolygonType> : FUIGeometryTypeWrapper where PointType : FUIInitCoordinate, PolylineType : FUIInitCoordinates, PolygonType : FUIInitCoordinates
-
MKPointAnnotation
subclass to support selection state.Declaration
Swift
public class FUIMKPointAnnotation : MKPointAnnotation
-
A generic class supports both MapKit and Esri for storing route segments and stops information.
See moreDeclaration
Swift
open class FUIRoute<LineGeometry, PointGeometry> where LineGeometry : FUIPolyline, PointGeometry : FUIPoint
extension FUIRoute: Hashable
-
A subclass of
FUIMKMapFloorplanViewController
designed to be used with MapKit framework. It adds additional functionality to map floorplan controller to support routes display.Usage
Create a
FUIRoute
instance for each route you want to display. Make sure your route stop geometry type extendsMKPointAnnotation
andFUIAnnotation
, and route segment geometry type extendsMKPolyline
andFUIOverlay
.- Implement
FUIMKRoutingMapViewDataSource
methods.
In the routing floorplan controller
viewDidLoad()
set the datasource.self.dataSource = dataSource
func numberOfRoutes(in mapView: MKMapView) -> Int { return 1 } func mapView(_ mapView: MKMapView, routeAt index: Int) -> FUIRoute<MKPolyline, MKPointAnnotation> { return fuiRoute }
FUIMKRoutingMapViewDelegate
provides more functionalities that you can make your app more powerful.
In the floorplan controller viewDidLoad() set the delegate.
self.delegate = delegate
Determine how annotation view/overlay renderer should appear. You can customize the view/render provided with fiori default styles.
func mapView(_ mapView: MKMapView, willRender annotationView: MKAnnotationView, forVertexAtIndex vertexIndex: Int, inRouteAt routeIndex: Int, in state: FUIMapFloorplan.State) { switch annotationView { case is FUICircleAnnotationView: (annotationView as! FUICircleAnnotationView).innerColor = .red case is FUIMarkerAnnotationView: (annotationView as! FUIMarkerAnnotationView).markerTintColor = .blue default: break } }
Respond to route select/deselect action
func mapView(_ mapView: MKMapView, didSelectRouteAt index: Int) func mapView(_ mapView: MKMapView, didSelectVertexAt vertexIndex: Int, inRouteAt routeIndex: Int) func mapView(_ mapView: MKMapView, didDeselectRouteAt index: Int) func mapView(_ mapView: MKMapView, didDeselectVertexAt vertexIndex: Int, inRouteAt routeIndex: Int)
Theming
See moreDeclaration
Swift
open class FUIMKRoutingFloorplanViewController : FUIMKMapFloorplanViewController
- Implement
-
Base inner view for
FUIMapDetailTagObjectTableViewCell
.Declaration
Swift
public class FUIMapDetailTagObjectView : FUIObjectView
-
Base container for showing business object information.
Example Initialization and Configuration:
let view = FUICardBaseContainer<Header: UIView, InnerView: Drawing>() view.primaryAction.isHidden = false view.secondaryAction.isHidden = false view.primaryAction.setTitle(<#T##String?#>, for: <#T##UIControlState#>) view.secondaryAction.setTitle(<#T##String?#>, for: <#T##UIControlState#>)
Theming
Please refer to
See moreFUIObjectCardView
documentation for all supported attributes.Declaration
Swift
open class FUICardBaseContainer<Header, Content> : FUITintableDrawingView<FUIControlState>, InnerViewContainerEventHandling, FUIPrimaryActionComponent & FUISecondaryActionComponent, InnerViewContainerProtocols where Header : FUIBaseFixedMarginsView, Header : FUIBackgroundSchemeSupporting, Header : FUICalculateLayout, Header : FUIStyleByStringAttributes, Content : FUIBaseFixedMarginsView, Content : FUIBackgroundSchemeSupporting, Content : FUICalculateLayout, Content : FUIStyleByStringAttributes
-
Base container for showing object actions in footer.
Example Initialization and Configuration:
See morelet view = FUICardFooterView() view.primaryButton.isHidden = false view.primaryAction.setTitle("Primary", for: .normal) view.secondaryAction.isHidden = false view.secondaryAction.setTitle("Secondary", for: .normal)
Declaration
Swift
open class FUICardFooterView : FUITintableDrawingView<FUIControlState>, FUIPrimaryActionComponent & FUISecondaryActionComponent
-
Base container for showing business object header information.
Example Initialization and Configuration:
let view = FUICardHeaderView() view.detailImageView.image = UIImage(named: "imageName") view.overflowAction.isHidden = false view.title = "Title"
Theming
Supported
TEXT
class paths:fdlFUICardHeaderView_title {} fdlFUICardHeaderView_overflowAction {}
Supported
TEXT
properties:font-color: Color; font-style: UIFontTextStyle; text-align: NSTextAlignment;
Supported
IMAGE
class paths:fdlFUICardHeaderView_detailImageView {}
Supported
IMAGE
properties:tint-color: Color;
See moreDeclaration
Swift
open class FUICardHeaderView : FUITintableDrawingView<FUIControlState>, FUICardHeaderViewComponent
-
Showing business list card information as inner view for collection view cell.
See moreDeclaration
Swift
open class FUIListCardCollectionViewCell<ItemIdentifier> : FUIBaseDrawingCollectionViewCell<FUIListCardView<ItemIdentifier>> where ItemIdentifier : Hashable, ItemIdentifier : Identifiable
-
Base inner view showing business object information for
FUIListCardView
.Example Initialization and Configuration:
let view = FUIListCardView<<#ItemIdentifier: Hashable & Identifiable#>>() view.register(<#T##cellClass: AnyClass?##AnyClass?#>, forCellReuseIdentifier: <#T##String#>) view.cellProvider = ((UITableView, IndexPath, ItemIdentifier) -> UITableViewCell) view.setItems(<#T##[ItemIdentifier]#>) view.cellTappedHandler = ...
Declaration
Swift
open class FUIListCardContentView<ItemIdentifier> : FUIBaseDrawingView, FUIListCardComponent, UITableViewDelegate where ItemIdentifier : Hashable, ItemIdentifier : Identifiable
-
Showing business list card information as inner view for table view cell.
See moreDeclaration
Swift
open class FUIListCardTableViewCell<ItemIdentifier> : FUIBaseDrawingTableViewCell<FUIListCardView<ItemIdentifier>> where ItemIdentifier : Hashable, ItemIdentifier : Identifiable
-
Base container for showing business object header information.
Example Initialization and Configuration:
let view = FUIListCardView<ItemIdentifier>() view.detailImageView.image = UIImage(named: "imageName") view.title = "Title" view.primaryButton.isHidden = false view.primaryAction.setTitle("Primary", for: .normal) view.secondaryAction.isHidden = false view.secondaryAction.setTitle("Secondary", for: .normal) view.overflowAction.isHidden = false view.overflowAction.setImage(UIImage(systemName: "ellipsis"), for: .normal) view.register(cellClass: AnyClass?, forCellReuseIdentifier: "reuseIdentifier") view.cellProvider = ((UITableView, IndexPath, ItemIdentifier) -> UITableViewCell) view.setItems([ItemIdentifier]) view.cellTappedHandler = ...
Skeleton
let view = FUIListCardView<ItemIdentifier>() view.showSkeleton() view.hideSkeleton()
Theming
Supported
TEXT
class paths:fdlFUICardHeaderView_title {} fdlFUIListCardView_overflowAction {} fdlFUIListCardView_primaryAction {} fdlFUIListCardView_secondaryAction {}
Supported
TEXT
properties:font-color: Color; font-style: UIFontTextStyle; text-align: NSTextAlignment;
Supported
IMAGE
class paths:fdlFUIListCardView_detailImageView {}
Supported
IMAGE
properties:tint-color: Color;
See moreDeclaration
Swift
open class FUIListCardView<ItemIdentifier> : FUICardBaseContainer<FUICardHeaderView, FUIListCardContentView<ItemIdentifier>>, FUICardHeaderViewComponent where ItemIdentifier : Hashable, ItemIdentifier : Identifiable
extension FUIListCardView: FUIListCardComponent
-
FUIObjectCard
is a collection view UI component which extendsFUIBaseAccessoryDrawingCollectionViewCell
for showing rich business information for an object in a card format, including tags and rating. TheFUIObjectCard
can also be configured to use single action button.Initialization and Configuration:
To use
FUIObjectCard
, it should be dequeued from aUICollectionView
and returned in its data source method.Example of setting an
FUIObjectCard
by implementingcellForItemWith
in the collection view:cell.title.text = "Business Object Title" cell.subtitle.text = "Business Object Subtitle" cell.footnote.text = "Business Object Footnote" cell.tags = [FUITag(title: "Tag - 1"), FUITag(title: "Tag - 2"), FUITag(title: "Tag - 3")] cell.rating = 5 cell.trailingProperties = [.tags, .footnote, .rating] cell.status.text = "$26.99" cell.actionAccessoryType = .button cell.actionAccessoryView?.button.setImage(FUIIconLibrary.system.cartAdd.withRenderingMode(.alwaysTemplate), for: .normal) cell.actionAccessoryView?.button.contentMode = .center
Tags Compression Behavior:
Based on Fiori Global Design guidance, if the content size of tags component goes beyond one line, it will be truncated automatically to be fitted into one line display mode with a placeholder showing a title of “+x more” information (
x
means the number of remaining tags that are hidden). Please note that the compression will not work when the tag’s content is too long or only one tag is set.Trailing Properties:
The order of trailing properties, including
.tags
,.footnote
and.rating
, can be set by the developer. By default, the trailing properties is set to[.footnote, .rating, .tags]
. If there are duplicated trailing properties, only the first one will be displayed.Default Styling:
Depending on the selection state, the tint color and button style of hierarchy icon, the font size of the title text, and the cell’s background color will be updated automatically.
Theming:
Supported class paths:
fdlFUIObjectCard {}
Please refer to
See moreFUIObjectCardContentView
documentation for all supported attributes.Declaration
Swift
open class FUIObjectCard : FUIBaseAccessoryDrawingCollectionViewCell<FUIObjectCardContentView>, InnerViewContainerEventHandling, FUIContentCopyableView
-
Showing business object card information as inner view for collection view cell.
See moreDeclaration
Swift
open class FUIObjectCardCollectionViewCell : FUIBaseDrawingCollectionViewCell<FUIObjectCardView>
-
Base inner view showing business object information for
FUIObjectCard
.Example Initialization and Configuration:
let view = FUIObjectCardContentView() view.title.text = "Business Object Title" view.subtitle.text = "Business Object Subtitle" view.footnote.text = "Business Object Footnote" view.status.text = "Business Object Status" view.statusImageView.image = UIImage(named: <#image#>) view.tags = [FUITag(title: "Tag - 1"), FUITag(title: "Tag - 2"), FUITag(title: "Tag - 3")] view.rating = 5 view.trailingProperties = [.rating, .tags, .footnote] view.iconImages = ["1", FUIIconLibrary.indicator.veryHighPriority.withRenderingMode(.alwaysTemplate)]
Theming
Supported
TEXT
class paths:fdlFUIObjectCardContentView_title {} fdlFUIObjectCardContentView_subtitle {} fdlFUIObjectCardContentView_footnote {} fdlFUIObjectCardContentView_status {} fdlFUIObjectCardContentView_body {} fdlFUIObjectCardContentView_overflowAction {}
Supported
TEXT
properties:font-color: Color; font-style: UIFontTextStyle; text-align: NSTextAlignment;
Supported
IMAGE
class paths:fdlFUIObjectCardContentView_detailImageView {}
Supported
IMAGE
properties:tint-color: Color;
See moreDeclaration
Swift
open class FUIObjectCardContentView : FUIObjectViewBase, FUIObjectCardComponent
-
Showing business object card information as inner view for table view cell.
See moreDeclaration
Swift
open class FUIObjectCardTableViewCell : FUIBaseDrawingTableViewCell<FUIObjectCardView>
-
Showing business object card information.
Example Initialization and Configuration:
let view = FUIObjectCardView() view.primaryButton.isHidden = false view.primaryAction.setTitle("Primary", for: .normal) view.secondaryAction.isHidden = false view.secondaryAction.setTitle("Secondary", for: .normal) view.overflowAction.isHidden = false view.overflowAction.setImage(UIImage(systemName: "ellipsis"), for: .normal) view.title.text = "Business Object Title" view.subtitle.text = "Business Object Subtitle" view.footnote.text = "Business Object Footnote" view.status.text = "Business Object Status"
Skeleton
let view = FUIObjectCardView() view.showSkeleton() view.showSingleLineSkeleton() view.hideSkeleton()
Theming
Supported class paths:
fdlFUIObjectCardView {} fdlFUIObjectCardView_title {} fdlFUIObjectCardView_subtitle {} fdlFUIObjectCardView_footnote {} fdlFUIObjectCardView_status {} fdlFUIObjectCardView_body {} fdlFUIObjectCardView_primaryAction {} fdlFUIObjectCardView_secondaryAction {} fdlFUIObjectCardView_overflowAction {}
See moreDeclaration
Swift
open class FUIObjectCardView : FUICardBaseContainer<FUIBaseDrawingView, FUIObjectCardContentView>, FUIObjectCardViewComponent
-
Typically not used by developer
Declaration
Swift
open class FUIBaseAccessoryDrawingCollectionViewCell<InnerView> : FUIBaseDrawingCollectionViewCell<InnerView> where InnerView : FUIBaseFixedMarginsView, InnerView : FUIBackgroundSchemeSupporting, InnerView : FUICalculateLayout, InnerView : FUIReactingToAccessory, InnerView : FUIStyleByStringAttributes
-
Typically not used by developer
See moreDeclaration
Swift
open class FUITableViewAccessoryDrawingCollectionViewCell<InnerView> : FUIBaseAccessoryDrawingCollectionViewCell<InnerView> where InnerView : FUIBaseFixedMarginsView, InnerView : FUIBackgroundSchemeSupporting, InnerView : FUICalculateLayout, InnerView : FUIReactingToAccessory, InnerView : FUIStyleByStringAttributes
-
A base class that is the
See moreFUIBaseDrawingTableViewCell
subclass for presenting an object view inside a table view cell, which defines common layout elements shared byFUIObjectTableViewCell
andFUIHierarchyItemTableViewCell
.Declaration
Swift
open class FUIObjectBaseTableViewCell<InnerView> : FUIBaseDrawingTableViewCell<InnerView>, FUIContentCopyable where InnerView : FUIBaseFixedMarginsView, InnerView : FUIBackgroundSchemeSupporting, InnerView : FUICalculateLayout, InnerView : FUIObjectBaseDrawing, InnerView : FUIReactingToAccessory, InnerView : FUIStyleByStringAttributes
-
Typically not used by developer
See moreDeclaration
Swift
open class FUIObjectViewBase : FUITintableDrawingView<FUIControlState>, FUIReactingToAccessory, FUIObjectBaseDrawing, FUIContentCopyable
-
This
UITableViewController
is used to display a perissions screen to the application for settings. The screen mainly show the privacy authorization status of the application.let vc = FUIPrivacyNoticeSettingsController() vc.items = [FUIPrivacyNoticeItem] vc.footerText = "SAP Application uses the permissions below to provide you with the best experience we catered to you" vc.cellProvider = { tb, items, cell -> UITableViewCell in .... } self.navigationController?.pushViewController(vc, animated: true)
Theming:
Support
TableViewCell
class paths:fdlFUIPrivacyNoticeSettingsCell {}
Supported
TableViewCell
attributes:tint-color (Color) background-color (Color) background-color-selected (Color)
Supported
Text
class paths:
See morefdlFUIPrivacyNoticeSettingsCell_title {} fdlFUIPrivacyNoticeSettingsCell_status {} fdlFUIPrivacyNoticeSettingsCell_statusImageView {} fdlFUIPrivacyNoticeSettingsCell_statusLabel {} fdlFUIPrivacyNoticeSettingsCell_detailImageView {}
Declaration
Swift
open class FUIPrivacyNoticeSettingsTableViewController : UITableViewController
-
This
UITableViewController
is used to display the edit operation of the permission.Example:
See morelet vc = FUIPrivacyNoticeDetailSettingViewController() vc.item = item vc.footerText = "footer Text" vc.cellProvider = { tb, item, cell -> UITableViewCell in .... } vc.buttonCell.onChangeHandler = { value in ... }
Declaration
Swift
open class FUIPrivacyNoticeDetailSettingViewController : UITableViewController
-
The reusable UI component implemented as a
UITableViewCell
to display as aSettingsCell
.When implementing the
UITableViewDataSource
cellForRow(at:)
function, set the following properties on the cell:title.text
: AString
value that is used to display ‘Title’status.text
: AString
value that is used to display ‘Status’detailImageView
: AUIImageView
value that is used to display the image on the left.isHideStatusImageView
: ABoolean
value that determines whether thestatusImageView
is hidden.
Usage:
tableView.register(FUIPrivacyNoticeSettingsCell.self, forCellReuseIdentifier: FUIPrivacyNoticeSettingsCell.reuseIdentifier) func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { let cell = tableView.dequeueReusableCell(withIdentifier: FUIPrivacyNoticeSettingsCell.reuseIdentifier, for: indexPath) as! FUIPrivacyNoticeSettingsCell cell.title.text = "Title" cell.status.text = "Authorization Status" cell.detailImageView.image = UIImage(systemName: "figure.roll") return cell }
Theming: Supported style classes:
See morefdlFUIPrivacyNoticeSettingsCell {} fdlFUIPrivacyNoticeSettingsCell_detailImageView {} fdlFUIPrivacyNoticeSettingsCell_title {} fdlFUIPrivacyNoticeSettingsCell_status {} fdlFUIPrivacyNoticeSettingsCell_statusImageView {}
Declaration
Swift
open class FUIPrivacyNoticeSettingsTableViewCell : FUIBaseDrawingTableViewCell<FUISettingsContentView>
-
The content view of a
See moreSettingsCell
.Declaration
Swift
open class FUISettingsContentView: FUIDrawingView, FUIDetailImageViewComponent, FUITitleComponent, FUIStatusComponent
-
View component of an
FUIPrivacyNoticeController
.Example:
let view = FUIPrivacyNoticeView() view.delegate = self view.title.text = "Default title" view.subtitle.text = "Default subtitle" view.detailImageView.image = UIImage(systemName: "") // delegate func privacyNoticeView(_ sender: AnyObject) { ... }
Theming
Supported style classes
See morefdlFUIPrivacyNoticeView {} fdlFUIPrivacyNoticeView_imageView {} fdlFUIPrivacyNoticeView_titleView {} fdlFUIPrivacyNoticeView_subtitleView {} fdlFUIPrivacyNoticeView_primaryAction {}
Declaration
Swift
open class FUIPrivacyNoticeView: FUIDrawingView, FUIDetailImageViewComponent, FUITitleMultiLineComponent, FUISubtitleMultiLineComponent, FUIPrimaryActionComponent
-
This
UIViewController
is used to display a permissions screen to the application for onboarding. The controller mainly shows the user the reason for requesting permission.Example:
let controller = FUIPrivacyNoticeViewController() controller.titleText.text = "" controller.subtitle.text = "" controller.detailImageView.image = UIImage() // didSelectHandler controller.primaryAction?.didSelectHandler = { button in ... }
The
FUIPrivacyNoticeItem
is a struct type that provides five default types:location
: Location permissionsnotification
: Notifications permissionsphoto
: Photos permissionscalendar
: Calendar permissionscamera
: Camera permissions
Usage:
let controller = FUIPrivacyNoticeViewController.makeViewController(for: .location) { [weak self] (status: CLAuthorizationStatus) in guard let self = self else { return } ... }
Theming: Supported style classes
See morefdlFUIPrivacyNoticeView fdlFUIPrivacyNoticeView_imageView fdlFUIPrivacyNoticeView_titleView fdlFUIPrivacyNoticeView_subtitleView fdlFUIPrivacyNoticeView_primaryAction
Declaration
Swift
open class FUIPrivacyNoticeViewController<AuthorizationStatus> : FUIBaseDrawingViewController<FUIPrivacyNoticeView>, CLLocationManagerDelegate
-
A
UISegmentedControl
subclass with Fiori styles.Usage:
let segmentControl = FUISegmentControl(items: ["Segment 1", "Segment 2", "Segment 3"]) segmentControl.addTarget(self, action: #selector(selectionChange(segmentControl:)), for: .primaryActionTriggered)
Use segment control in a container with dark background
segmentControl.backgroundColorScheme = .darkConstant
Theming
See morefdlFUISegmentControl { background-color (Color) background-image { -selected | -highlighted | -disabled } (Image) tint-color (Color) selected-segment-tint-color (Color) // The divider image to be used when both left and right segment are in normal state divider-image (Image) font-color { -selected | -highlighted | -disabled } (Color) text-shadow-color { -selected | -highlighted | -disabled } (Color) text-shadow-offset { -selected | -highlighted | -disabled } (Size) font-name { -selected | -highlighted | -disabled } (FontName) font-size { -selected | -highlighted | -disabled } (Size) font-style { -selected | -highlighted | -disabled } (UIFont.TextStyle) }
Declaration
Swift
open class FUISegmentControl : UISegmentedControl, FUIAttributedStringDrawing
-
The
FUIStepProgressIndicator
is aUIView
subclass that enables a developer to present linear steps progress using the default Fiori indicator.Initialization and Configuration
Example of setting an
FUIStepProgressIndicator
:let view = FUIStepProgressIndicator(selection: "step id", stepItems: [FUIStepItem]) view.title.text = "step title" view.primaryAction.setTitle("All Steps: 4)", for: .normal) view.primaryAction.setImage(UIImage(systemName: "chevron.right"), for: .normal) view.selectionDidUpdated = { [view] selection in // handle new title for selected step }
Theming
Supported
FUIStepProgressIndicator
class paths:fdlFUIStepProgressIndicator {} fdlFUIStepProgressIndicator_title {} fdlFUIStepProgressIndicator_primaryAction {}
Supported
Text
attributes:font-color (Color) font-name (FontName) font-style (UIFontTextStyle) font-size (Number)
Supported
FUIButton
properties:font-style: (Font Style Name) font-color: (Color) background-color-normal: (Color) background-color-highlighted: (Color)
Supported
Step
properties:fdlFUIStepProgressIndicator_normal/completed/error/disabled { node-foreground: white; node-foreground-highlighted: black; node-foreground-selected: black; node-background: white; node-background-highlight: white; node-background-selected: white; title-color: green; title-color-highlighted: black; title-color-selected: blue; title-color-selected-highlighted: red; font-name: callout; font-name-highlighted: callout; font-name-selected: callout; font-name-selected-highlighted: callout; font-name-vertical: callout; font-name-vertical-highlighted: callout; font-name-vertical-selected: callout; font-name-vertical-selected-highlighted: callout;
}
See moreDeclaration
Swift
open class FUIStepProgressIndicator : FUITintableDrawingView<FUIControlState>, FUIStepProgressIndicatorComponent
-
FUITimelineNowIndicatorCell
is aUITableViewCell
subclass, designed to present now indicator in a Timeline view.## Usage
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { let cell = tableView.dequeueReusableCell(withIdentifier: "FUITimelineNowIndicatorCell", for: indexPath) as! FUITimelineNowIndicatorCell return cell }
## Notes ###
SingleLine
Separator Between Timeline Items in the Table The default table viewseparatorStyle
is.singleLine
. Because of this default setting, there can be a 1.0 px divider line or a separator in-between each item on the timeline in the table. This is not an issue in timeline. To get rid of the separator, setseparatorStyle
tonone
in theTabelViewController
classoverride func viewDidLoad() { super.viewDidLoad() // ... self.tableView.separatorStyle = .none // ... }
### Hide the Separator in the next Timeline Items in the Table The Separator can be hiden in the next Timeline cell as following
cell.separatorLineView.isHidden = true
## Theming Supported style classes
See morefdlFUITimelineNowIndicatorCell fdlFUITimelineNowIndicatorCell_nodeImageView fdlFUITimelineNowIndicatorCell_indicatorLine
Declaration
Swift
open class FUITimelineNowIndicatorCell : NibDesignableFUIBaseTableViewCell, FUIStyleSheetAttributesApplying
-
Section layout manager subclass specifically designed for
See moreFUIStandardAutoSizingColumnFlowLayout
which layout the cells in columns with the same width.Declaration
Swift
open class FUIStandardAutoSizingColumnSectionLayoutManager : FUISectionLayoutManager
-
Manager class which supplies color palette values to Fiori components, and the
UIColor.preferredFioriColor(...)
API.Changes made to the manager affect all future calls to
UIColor.preferredFioriColor(...)
. Most components do not reload dynamically, so calls to theThemeManager
should happen at the beginning of the application lifecycle.Note
AppDelegate.didFinishLaunching(withOptions...)
is the recommended location.Example Usage
See more// Pin palette version used by application to a specific version (defaults to `.latest`) FUIThemeManager.shared.setPaletteVersion(.v3_x) // Override some color definitions to match your application palette FUIThemeManager.shared.setColor(.darkGray, for: .primary2, background: .light) FUIThemeManager.shared.setHexColor("1b931d", for: .positive, background: .light)
Declaration
Swift
public class FUIThemeManager
-
The FUIBaseCalendarItemCollectionViewCell class defines the attributes and behavior of the cells that appear in calendar view objects.
See moreDeclaration
Swift
open class FUIBaseCalendarItemCollectionViewCell : UICollectionViewCell
-
Undocumented
See moreDeclaration
Swift
public class SkeletonAnimationBuilder
-
Undocumented
See moreDeclaration
Swift
public class SkeletonViewAppearance