SelectBox

class: SJUISelectBox inherits: SJUIView

Platform Support

• ✅ UIKit: Full support (All attributes available)
• ✅ SwiftUI: Full support (Maps to Picker with equivalent functionality)
  • 7.0.0-beta: Improved frame and padding handling in SwiftUI mode

Attributes for SelectBox

attribute name	UIKit	SwiftUI	Compose	XML	type in json	details	remarks
items	✅	✅	✅	❌	array	Array of selectable items
selectedIndex	✅	✅	✅	❌	integer/string	Default item index. Can be integer or @{variableName}
caretAttributes	✅	✅ Dynamic	❌	❌	JSON	Attributes for caret. See caret attributes	Dynamic mode only
dividerAttributes	✅	✅ Dynamic	❌	❌	JSON	Attributes for divider. See divider attributes	Dynamic mode only
labelAttributes	✅	✅ Dynamic	❌	❌	JSON	Attributes for label. See label attributes	Dynamic mode only
selectItemType	✅	✅	✅	❌	string	Item type: Normal, Date
datePickerMode	✅	✅	✅	❌	string	Mode: date, time, datetime, countDown
canBack	✅	✅ Dynamic	❌	❌	boolean	Show back button on picker	Dynamic mode only
prompt	✅	✅ Dynamic	✅	❌	string	Prompt for selectBox	Dynamic mode only
includePromptWhenDataBinding	✅	✅ Dynamic	❌	❌	boolean	Include prompt in data binding count	Dynamic mode only
dateStringFormat	✅	✅	✅	❌	string	String format for date display
selectedDate	✅	✅	✅	❌	string	Default date value
maximumDate	✅	✅	✅	❌	string	Maximum date value
minimumDate	✅	✅	✅	❌	string	Minimum date value
datePickerStyle	✅	✅	✅	❌	string	Style: automatic, wheels, compact, inline (iOS 14.0+)	v6.1.0+
minuteInterval	✅	✅ Dynamic	❌	❌	integer	Minute interval for time picker (1-30)	Dynamic mode only
enabled	✅	✅	✅	✅	boolean/string	view.isEnabled. Can be boolean or @{variableName}
onValueChange	✅	✅	✅	❌	string	Value change event selector

Attributes for caret

attribute name	data type in constraint info	type in json	details	remarks
width	-	float	width for caret.
src	-	string	image name for caret.
background	-	string	background color for caret.

Attributes for divider

attribute name	data type in constraint info	type in json	details	remarks
width	-	float	width for divider.
background	-	string	background color for divider.

Attributes for label

attribute name	data type in constraint info	type in json	details	remarks
textAlign	-	string	paragraphStyle.alignment. list is belowLeft: NSTextAlignment.leftRight: NSTextAlignment.rightCenter: NSTextAlignment.center
font	-	string	Font name for label.
fontSize	-	float	Font size for label.
fontColor	-	string	NSAttributedStringKey.foregroundColor.
text	-	string	NSLocalizedString(text, comment:"") will be set to attributedText.
hilightAttributes	-	JSON	hilighted attributes for text. This attributes will be applied when applyAttributedText is called and it is selected. Avaliable attributes are font,fontSize,fontColor
highlightColor	-	string	font color for state selected. This attribute will be ignored when highlightAttributes is defined.
hintAttributes	-	JSON	hint attributes for text. This attributes will be applied when hint is displayed. Avaliable attributes are font,fontSize,fontColor
hintColor	-	string	font color for hint. This attribute will be ignored when highlightAttributes is defined.
lineHeightMultiple	-	float	paragraphStyle.lineHeightMultiple.
edgeInset	-	string|float array	Float array or string separated by "|" will be set to label.padding.When the array size is 1, value for all positions will be set the same value.When the array size is 2, First value will be set to top and bottom, and Second value will be set to left and right.When the array size is 3, indicies and positions are below.0: top1: left and right 2: bottomWhen the array size is 4, indicies and positions are below.0: top1: left2: bottom3: right

Functions for SelectBox

public class func createFromJSON(attr: JSON, target: Any, views: inout [String: UIView]) -> SJUISelectBox

This method will be called when it's created from json file. Override This method when you create classes inherite SJUISelectBox class.

Usage Examples

Basic Date Picker with Enhanced Style (v6.1.0+)

{
  "type": "SelectBox",
  "id": "birth_date",
  "width": "matchParent",
  "height": 44,
  "selectItemType": "Date",
  "datePickerMode": "date",
  "datePickerStyle": "compact",
  "dateStringFormat": "yyyy/MM/dd",
  "prompt": "Select your birth date"
}

Time Picker with Minute Intervals (v6.1.0+)

{
  "type": "SelectBox",
  "id": "appointment_time",
  "width": "matchParent",
  "height": 44,
  "selectItemType": "Time",
  "datePickerMode": "time",
  "datePickerStyle": "wheels",
  "minuteInterval": 15,
  "prompt": "Select appointment time"
}

DateTime Picker with Inline Style (v6.1.0+)

{
  "type": "SelectBox",
  "id": "event_datetime",
  "width": "matchParent",
  "height": 200,
  "selectItemType": "Date",
  "datePickerMode": "datetime",
  "datePickerStyle": "inline",
  "minuteInterval": 30,
  "dateStringFormat": "yyyy/MM/dd HH:mm",
  "minimumDate": "2024/01/01 00:00",
  "maximumDate": "2025/12/31 23:59"
}

Date Picker Style Guide (v6.1.0+)

automatic

• Description: System automatically chooses the best style based on available space
• Best for: Adaptive layouts that work across different screen sizes
• Appearance: Varies by iOS version and available space

wheels

• Description: Traditional spinning wheel picker (default behavior)
• Best for: Time selection, familiar user experience
• Appearance: Classic iOS picker wheels

compact

• Description: Button-style picker that presents a popover when tapped
• Best for: Space-constrained layouts, modern iOS designs
• Appearance: Compact button that expands on tap

inline

• Description: Calendar-style picker displayed inline
• Best for: Date selection with plenty of screen space
• Appearance: Full calendar view embedded in the layout
• Note: Requires sufficient height (recommended: 200+ points)

Minute Interval Guidelines (v6.1.0+)

• Valid values: 1, 2, 3, 4, 5, 6, 10, 12, 15, 20, 30
• Default: 1 (every minute)
• Common use cases:
  • 5 minutes: General scheduling
  • 15 minutes: Meeting scheduling
  • 30 minutes: Appointment booking
• Effect: Limits selectable minutes to multiples of the specified interval