KvadrantToggleSwitch

The Windows Phone toggle, from the Toolkit's own Generic.xaml rather than from its published dimensions — which is the difference between a switch that looks like Metro and one that is it.

The track is always filled with the accent. Over it sits a rectangle of the page's background colour, 77×20, centred — a window punched through the fill. Switching on slides that window and the thumb 69 px to the right together, and what "turning on" looks like is the accent being uncovered rather than anything changing colour.

The track also carries a double border — 3 px of foreground outside, 4 px of background inside — and the thumb is foreground-filled with 4 px background gutters either side and a −4 margin, so it overhangs the track by four pixels at each end. That overhang is what makes the published travel of 69 work out against an 89 px track and a 28 px thumb.

Both translations ease out on an exponential of 15 over 50 ms — the same curve as Swivel's exit, and the reason the switch snaps rather than glides.