I am designing an app that requires the user to pick

  1. a time (e.g. 3 PM)
  2. an additional value, representing a time gap (in minutes) before and after the selected time.

For example if the user has selected 15 PM and 15 the app will consider times 2:45 PM to 3:15 PM.

The trivial solution of a time selector combined with a list box, produces a long list with too many possible options for the time gap.

Another attempt was implementing it as a slider over 24 vertical lines where the width of the slider is proportional to the time gap. This approach was too difficult to operate on a small screen.

What is the best way to implement such a component?

1 Answer 1


Unless you are building a scientific app, people tend to set time in 5-minute increments. Then the picker may look like this:

enter image description here

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.