Label Composite Views
CompositePre-assembled composite views that combine labels, icons, and text inputs in common layout patterns — saving repetitive setup code for standard UI patterns like icon+label rows, form label+field pairs, and two-column label rows.
| Class | Layout | Use Case |
|---|---|---|
TTBaseLabelIconHorizontalView | Icon → Label (horizontal) | Menu items, setting rows, icon+text rows |
TTBaseLabelTextViewByVerticalView | Label on top → TextField below | Labeled form fields |
TTIconLabelView | Icon → Label (horizontal, tap-enabled) | Touchable icon+text rows (base for RadioButton) |
📌 TTBaseLabelIconHorizontalView
An icon (TTBaseUIImageView) followed by a label (TTBaseUILabel) in a horizontal stack. Configurable icon size and spacing.
// Icon + text row
let settingRow = TTBaseLabelIconHorizontalView()
settingRow.iconImageView.setIConImage(with: .gear, color: .systemBlue, size: CGSize(width: 22, height: 22))
settingRow.textLabel.setText(text: "Notification Settings")
// Custom icon size via subclass
class MenuItemView: TTBaseLabelIconHorizontalView {
override var sizeIcon: CGSize { CGSize(width: 28, height: 28) }
override var spacingIcon: CGFloat { 12 }
}
// Tappable row
settingRow.setOnTouchHandler { view in
navigateToNotifications()
}
📋 TTBaseLabelTextViewByVerticalView
Vertical stack: title TTBaseUILabel on top with a TTBaseUITextField or TTBaseUITextView below. Perfect for form fields with an inline label.
// Label + TextField pair
let nameField = TTBaseLabelTextViewByVerticalView()
nameField.titleLabel.setText(text: "Full Name")
nameField.textField.setPlaceholder("Enter your name")
// In a form stack
let emailField = TTBaseLabelTextViewByVerticalView()
emailField.titleLabel.setText(text: "Email Address")
emailField.textField.setKeyboardStyleByEmail()
emailField.textField.onTextEditChangedHandler = { _, text in
viewModel.email = text
}
formStack.addArrangedSubview(nameField)
formStack.addArrangedSubview(emailField)
🖱 TTIconLabelView
Base class for TTBaseRadioButtonView. A touchable horizontal icon+label view.
let row = TTIconLabelView()
row.iconImageView.setIConImage(with: .heart, color: .systemRed)
row.textLabel.setText(text: "Add to Favorites")
row.setOnTouchHandler { view in
addToFavorites()
}
📖 Common API
| Property | Type | Description |
|---|---|---|
iconImageView | TTBaseUIImageView | Left/top icon view (use setIConImage) |
textLabel | TTBaseUILabel | Main label |
titleLabel | TTBaseUILabel | Heading label (for vertical views) |
textField | TTBaseUITextField | Input field (for LabelTextViewByVerticalView) |
setOnTouchHandler(_:) | Void | Register tap callback |
Pro Tip: Subclass
TTBaseLabelIconHorizontalView and override sizeIcon and spacingIcon to create a consistent menu-item component across your app, rather than configuring each instance individually.