Selecting between two options in smartphone app?
We have a smartphone app that has two filters, and each filter has two options. For example, I can select what I can drink (red or white wine) and what I can eat (baked potato or french fries).
These are the two options I've found:
With the horizontal line under the selection, It's very clear what the user selected.
On the other hand, I had to add the vertical line so that the user knows that it's actually two filters with two options each. Without the horizontal line a user might get confused. Also, tons of apps are using the horizontal line to display the selection. My app is yet another app with this same boring design that everyone else uses.
I also considered the segmented controls. It'll probably look like this since android doesn't have the ios 13 segmented control:
Even though I like it a little more, the biggest issue is that it's not clear which option is selected when only two options are available, which is documented here. I asked a colleague (android user) and he thought that "White wine" was selected. So there's that confusion.
What other options are there?