🧩 TimeSelectView
An extension for MIT App Inventor 2.A custom time selection view developed by TechHamara using Fast. This component allows users to visually select time ranges within a 24-hour period. It features a circular interface with anchors for start and end times, degree markers, and number markers for each hour. The component is highly customizable, offering properties to change the appearance and behavior of the time selection view.
Telegram | GitHub
Blogger | YouTube
Find More Extension
Terms & Conditions
Specifications
Package: io.th.timeselectview
Size: 26.34 KB
Version: 1.0
Minimum API Level: 7
Updated On: 2025-06-05T18:30:00Z
Built & documented using: FAST v2.8.4
Library zjun615 thank you for your awesome library.
Download aix
io.th.timeselectview.aix (26.3 KB)
Get aia here
time_select_view.aia (28.8 KB)
Get apk on GitHub here
Demo
Blocks
Documentation
Events:
TimeSelectView has total 5 events.
TimeChanged
Event raised when time sections are changed
| Parameter | Type |
|---|---|
| timePartList | list |
TimeInserted
Event raised when a new time section is inserted
| Parameter | Type |
|---|---|
| part | any |
SelectionStarted
Event raised when time selection starts
| Parameter | Type |
|---|---|
| minute | number |
SelectionChanged
Event raised when time selection changes
| Parameter | Type |
|---|---|
| minute | number |
SelectionFinished
Event raised when time selection finishes
Methods:
TimeSelectView has total 5 methods.
Initialize
Initialize inside an arrangement.
| Parameter | Type |
|---|---|
| arrangement | component |
TimeChangeListener
Registers a listener to be notified when the selected time changes.
GetTimeSections
Get time sections
- Return type:
list
TimeSections
Set time sections. Example: SetTimeSections([TimePart(9, 10), TimePart(11, 12)])
| Parameter | Type |
|---|---|
| sections | list |
ClearTimeSections
Clear all time sections
Setters:
TimeSelectView has total 23 setter properties.
RingWidth
Width of the ring in dp
- Input type:
number
RingBackgroundColor
Background color of the ring
- Input type:
number
SectionColor
Color of the time sections
- Input type:
number
SectionColor2
Second color for gradient (optional)
- Input type:
number
SectionColor3
Third color for gradient (optional)
- Input type:
number
AnchorDiameter
Diameter of the anchor points in dp
- Input type:
number
AnchorStrokeWidth
Stroke width of anchor points in dp
- Input type:
number
AnchorTextSize
Text size of anchor points in sp
- Input type:
number
AnchorNeedMerge
Whether to merge overlapping anchors
- Input type:
boolean
AnchorStartColor
Color of the start anchor
- Input type:
number
AnchorStartStrokeColor
Stroke color of the start anchor
- Input type:
number
AnchorStartText
Text for the start anchor
- Input type:
text
AnchorStartTextColor
Text color of the start anchor
- Input type:
number
AnchorEndColor
Color of the end anchor
- Input type:
number
AnchorEndStrokeColor
Stroke color of the end anchor
- Input type:
number
AnchorEndText
Text for the end anchor
- Input type:
text
AnchorEndTextColor
Text color of the end anchor
- Input type:
number
DegreeColor
Color of the degree markers
- Input type:
number
NumberSize
Size of the number markers in sp
- Input type:
number
NumberColor
Color of the number markers
- Input type:
number
QuickCutEnable
Enable quick cut functionality
- Input type:
boolean
SectionSum
Maximum number of time sections allowed. For example, setting this to 5 will allow a maximum of 5 time sections to be created.
- Input type:
number
InitialMinutes
Initial minutes for new time sections
- Input type:
number
Thanks
TechHamara
Feel free to contact us any quarry or suggestions.