1

I have a datagrid that shows realtime data. How ever, Users should select to see if they want 'Last 5 minutes' data or 'Real time' Data. I did this using radio buttons, however it doesn't fit and is not working.

enter image description here

What can i make it to do this better or minimalistic ?

2

If you use a dropdown, you'll save space. Be aware that there are some tradeoffs.

enter image description here

Pro:

  • saves space
  • allows for additional choices (if extra ranges are added in the future)
  • allows for longer label (since only one is shown at a time)

Con:

  • only one choice shown at a time
  • discoverability of the control

Because you can only see one choice, you could experiment by adding some graphic distinction to indicate interactivity. One way is to add a border. You can also experiment with color as well.

enter image description here

1

If choices fit into the space, use segmented controls: enter image description here

If choices are more than the space allows, or more than 5, use drop down.

Segmented controls do not hide the filter options behind a click, all options are visible in the interface. However, as the number of options increase it starts becoming visually busy and hard to read, opt for the dropdown.

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.