New answers tagged toggle
I think what you're looking for is a segmented controller. The switch is used for binary options where as the segmented controller allows for 3 (or more) mutually exclusive options. Hacking the switch design to accommodate for a third state isn't recommended since it it's not clear there's a middle state. It also requires you to slide to just the right ...
First, it seems as though you're using the toggle for the wrong purposes. With that being said, if you are set on using it, you can create a grey version with a dotted or dashed outline of the toggle/switch centered. Something like this (quick sketch):
You may wish to investigate if an iOS-style on/off switch is the most appropriate metaphor for your situation. A checkbox is a very traditional control which users are familiar with and has a very clear "on" and "off" state. They also overcome the common issue of if a switch should show state, or action when pressed, since their behavior is already well ...
@chris has the right idea. I prefer the 2nd option but with stacked radio options so there is no confusion over which button applies to which label. It also more clearly makes each filter step look self-contained.
Sorry this is only crude...but just separate out the different filters with a vertical rule. The first ones and can then be the radio either-or combo you're after with the next section clearly being an individual option. download bmml source – Wireframes created with Balsamiq Mockups Another way would be like this: download bmml source ...
I've used Twitter Bootstrap button groups in the past for this same idea. Since they are actually buttons, and not parts of a slide, I don't think the selected states are confusing (and you can style them to be as unambiguous as you want). I think the bigger question to ask is whether it meets your needs and what you are trying to solve by implementing ...
To be honest you probably shouldn't be using a toggle if you have more than 2 states - a toggle by it's nature is an either / or switch - that's why you're having this problem. For your application it would depend on the number of states and the context, but most mobile OS handle drop lists very well. A series of Radio buttons would be another solution.
On Facebook, the like button is a good example for a toggle button. On Facebook's Android app, the like is on a button and it's a grayed when off and highlighted blue when on. See screenshots below. Basically, I agree with them - emphasize the positive and don't mess with users' brains (minimum change). I'm not sure if it's a good way for color blinded. ...
Top 50 recent answers are included