A Time Input component is helpful when you want the user of your app to easily select a specific time using the native Android or iOS date picker
Native Android Time Picker on the left and iOS on the right
Properties
Time Input
Property
Description
Data Type
Style
Format to use when displaying selected date
Select from menu [Hour:Minute AM/PM, Hour:Minute 24h]
Font Size
Size of font when displaying date
Number
Font Style
Select whether font is normal or italic
Select from list [normal, italic]
Font Weight
Set thickness of font
Select from list [normal, bold, 100, 200, 300, 400, 500, 600, 700, 800, 900]
Color
Color of font when displaying date
Color
Layout
Property
Description
Data Type
X
Location of top left corner of Time Input on X-axis, where the left hand side is X=0
Number
Y
Location of top left corner of Time Input on Y-axis, where the top side is Y=0
Number
Height
Height of Time Input in pixels
Number
Width
Width of Time Input in pixels
Number
Visible
Toggle whether your end users can see the Time Input
True/False
Style
Property
Description
Data Type
Border Width
Width of border around Time Input in pixels
Number
Border Radius
Radius of corners of border on Time Input in degrees
Number
Border Color
Color of border (only visible if border width > 0)
Color
Border Style
Set whether border style is solid, dotted or dashed (only visible if border width > 0)
Select from list [solid, dotted, dashed]
Save the time
The time that a user selects will show up automatically in the Time Input label but if you want to save the date somewhere to be uploaded later, you'll need to add a block like the one below.
Event Property
Output
Get Time
Date in whichever format you specify
Get Hours
Hour of the Day from 1-24
Get Minutes
Minutes from 1-60
Blocks
Events
Time Picked
Fires when the user has selected a time with the Time Input
Functions
Launch Picker
Launches the Time Input picker for the user to select a time.
Get Hour
Returns the hour of the currently selected time in 24 hour format.
Example: if the user selects 2:30 PM, this block will return 14.
Get Minute
Returns the minute of the currently selected time.
Example: if the user selects 2:30 PM, this block will return 30.
Get Time
Returns the selected time in the same format as the Style property of the Time Input.
Example: if the user selects 2:30 PM, and the Style is set to Hour:Minute AM/PM, this block will return 2:30 PM.
If the user selects 2:30 PM, and the Style is set to Hour:Minute 24h, this block will return 14:30.