Grid Table View Header¶
FUIGridTableViewHeader
¶
open class FUIGridTableViewHeader: FUIGridTableViewHeaderFooterView
FUIGridTableViewHeader
is a Fiori UI component that extends UITableViewHeaderFooterView
for showing a list of FUIGridRowItem
column titles. It will display as a section header 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 FUIGridTableViewHeader
is adaptive for regular
and compact
horizontal content modes. It is hidden by design, when in compact
mode. The AutoLayout
automatic dimension technique should be used for computing the header height.
Example Initialization and Configuration¶
override open func viewDidLoad() {
super.viewDidLoad()
tableView.sectionHeaderHeight = UITableViewAutomaticDimension
tableView.estimatedSectionHeaderHeight = 100
tableView.register(FUIGridTableViewHeader.self, forHeaderFooterViewReuseIdentifier: FUIGridTableViewHeader.reuseIdentifier)
}
Override tableView(_: viewForHeaderInSection:)
dataSource
Method and Configure Header¶
// 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!
Last update: April 14, 2021