WPFSpark : 2 of n : ToggleSwitch

My second article in the WPFSpark series is out. I have added a new control called ToggleSwitch to the WPFSpark library.

You can access it here.

I’m currently finalizing the next control for the WPFSpark library. It is called FluidWrapPanel. You can catch a glimpse of it in my codeplex site.

Advertisements

4 thoughts on “WPFSpark : 2 of n : ToggleSwitch

  1. Hi,
    this is a great tutorial and control. I always searched for a control like this. However, is there a way to use this control in a normal Windows Form?
    Thanks adn kind regards,
    Joerg

  2. How does exactly the switching between sides works? I’m not sure I understand, but it seems you change the column of the ContentBorder but the triggers point to the same value, unless I’m missing something.
    Would it be possible to make the thumb fixed size?

    1. Hi,
      If you look at the ToggleSwitch Control Demystified section in the CodeProject article, I have explained how the switching works in a Simple and a Sophisticated ToggleSwitch.
      Basically, I have a grid with 2 (or 3) columns. The Thumb is normally in one of the columns. Whenever the state of the ToggleSwitch changes, I am moving the Thumb to another column. Since I am using FluidMoveBehavior the movement of the Thumb from one column to the other is animated.

      Even though the triggers point to the same value, I am changing the values dynamically at runtime based on the ratio of the Thumb width to the ToggleSwitch width. Just Check the CalculateLayout() method.

      As of now, the Thumb width can only be specified as a percentage of the ToggleSwitch width (the range being 10% – 90%). If you are using multiple ToggleSwitch controls in your application, I suggest you have all of them of the same size and specify an optimum value for the Thumb width.

      Regards,
      Ratish Philip

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s