# Time Input

## Time Input Overview

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](https://689802330-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LAn5scXl2uqUJUOqkJo%2F-LnTo13qf4HKd1AV6bl9%2F-LnToCYZAQWY7dgHzB0y%2FThunkable%20Docs%20Exhibits%20\(38\).png?alt=media\&token=980aeae0-bdec-46c5-900e-27a74c618662)

## Getting Started 

The Time Input component needs no set-up (Woohoo!). Just drag and drop the component into your project. As a bonus, the current time will automatically show up as a label.

When a user of your app taps on the Date Input, it will automatically launch the native Android or iOS date pickers.

## Set the time format

You can set the format of the time by simply choosing your desired format from the `Style` property

![](https://689802330-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LAn5scXl2uqUJUOqkJo%2F-Lny-PnVQUoAUGfRkGmD%2F-Lnyljd1XQ-gLJH7pbfr%2FScreen%20Shot%202019-09-04%20at%205.15.39%20PM.png?alt=media\&token=f6fdf30b-95a3-45d1-8237-5af870bc461c)

## 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. 

![](https://689802330-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LAn5scXl2uqUJUOqkJo%2F-Lny-PnVQUoAUGfRkGmD%2F-Lnylwwu9N8OSsiO9AmY%2FScreen%20Shot%202019-09-04%20at%204.43.02%20PM.png?alt=media\&token=d1296cd3-10c4-4caa-b197-5a036c44ab6f)

| 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`                  |

## Events

### Time Picked

![](https://689802330-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LAn5scXl2uqUJUOqkJo%2F-MWd1ztfxxPjInQ3k4cx%2F-MWdEXc4oifn51e7pB7-%2Fe_time_picked.png?alt=media\&token=60aa87ae-7a6b-4636-aef9-edc12f419799)

## Functions

### Get Hour 

![](https://689802330-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LAn5scXl2uqUJUOqkJo%2F-MWd1ztfxxPjInQ3k4cx%2F-MWdEht3nCQiwSaREzmi%2Ff_get_hour.png?alt=media\&token=e824b842-67cc-42ce-bfc6-7d3ad4258a00)

### Get Minute 

![](https://689802330-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LAn5scXl2uqUJUOqkJo%2F-MWd1ztfxxPjInQ3k4cx%2F-MWdEiyVKE-knlTI4qPS%2Ff_get_min.png?alt=media\&token=ce26d7bc-ad8d-42ee-9f00-e8d2453cd21b)

### Get Time 

![](https://689802330-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LAn5scXl2uqUJUOqkJo%2F-MWd1ztfxxPjInQ3k4cx%2F-MWdEk2u-J9YYP1lbeaR%2Ff_get_time.png?alt=media\&token=11fe08dc-2772-4b82-83eb-19f29e755f1a)

### Launch Picker

![](https://689802330-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LAn5scXl2uqUJUOqkJo%2F-MWd1ztfxxPjInQ3k4cx%2F-MWdElZVZfZu3OtewsmK%2Ff_launch.png?alt=media\&token=e337044e-8b86-480d-b5ee-058d7048dea3)

## Properties

### Background Color 

![](https://689802330-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LAn5scXl2uqUJUOqkJo%2F-MWd1ztfxxPjInQ3k4cx%2F-MWdF851BZbdXcWXuNmU%2Fbg_color.png?alt=media\&token=294f0020-f21a-40d2-b841-af027b5bd5a3)

### Color 

![](https://689802330-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LAn5scXl2uqUJUOqkJo%2F-MWd1ztfxxPjInQ3k4cx%2F-MWdF9J9j97XK-6FCUGr%2Fcolor.png?alt=media\&token=efa6f5c8-4117-48d2-bb1c-6b9bc15b7dab)

### Computed Height and Width 

![](https://689802330-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LAn5scXl2uqUJUOqkJo%2F-MWd1ztfxxPjInQ3k4cx%2F-MWdFAVd35sg-Nxp--KO%2Fcomp.png?alt=media\&token=1bd2d2c8-7fca-4904-9590-82fb9ec4f4b6)

### Font Size 

![](https://689802330-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LAn5scXl2uqUJUOqkJo%2F-MWd1ztfxxPjInQ3k4cx%2F-MWdFBrAJFONxB4eKouO%2Ffont_size.png?alt=media\&token=0db3239b-e521-4a85-9cfd-6550afac8fd9)

### Font Style 

![](https://689802330-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LAn5scXl2uqUJUOqkJo%2F-MWd1ztfxxPjInQ3k4cx%2F-MWdFCyv8f1hGcFyz1wU%2Ffont_style.png?alt=media\&token=cbb8d7b3-5a16-4cac-8f3d-73d055cec560)

### Font Weight 

![](https://689802330-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LAn5scXl2uqUJUOqkJo%2F-MWd1ztfxxPjInQ3k4cx%2F-MWdFE7yClDZG-aLuP5N%2Ffont_weight.png?alt=media\&token=3039d3df-488b-453c-9141-bb6d5c75c4d3)

### Style

###  

![](https://689802330-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LAn5scXl2uqUJUOqkJo%2F-MWd1ztfxxPjInQ3k4cx%2F-MWdFFIh3n2aLpMv_MDN%2Fstyle.png?alt=media\&token=8f56b708-4a80-4bad-889e-996624d03f48)

### Text Align 

![](https://689802330-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LAn5scXl2uqUJUOqkJo%2F-MWd1ztfxxPjInQ3k4cx%2F-MWdFH16ac3W6UKX0bmu%2Ftext_align.png?alt=media\&token=71fe56e0-9723-4048-b2b4-5b7abf227dca)

### Visible

![](https://689802330-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LAn5scXl2uqUJUOqkJo%2F-MWd1ztfxxPjInQ3k4cx%2F-MWdFIPizivSNTF3uuvR%2Fvisible.png?alt=media\&token=b7220d1a-e91f-4079-9360-6ef6d45ef699)