SaaToggle

SaaToggle has has three default styles by which each style can be customized separately. These styles are:

  1. iOS style

  2. Skewed style

  3. Flat style

You are not limited to these styles. You can customize them to fit into your own styles.

1. Colors

All these colors are shared in all styles.

OffBackColor tells the background color of the toggle when it is OFF.

OffForeColor tells the text color of the toggle when it is OFF.

OffHeadColor tells the color the head of the toggle when it is OFF.

OnBackColor tells the background color of the toggle when it is ON.

OnForeColor tells the text color of the toggle when it is ON.

OnHeadColor tells the color the head of the toggle when it is ON.

2. Styles

SaaToggle has three styles and each style is it is own. You can tell the style your toggle will take using ToggleStyle. foreaxample you can tell the toggle to take iOS.

ToggleStyle tells style the toggle takes. These styles are FlatStyle, iOSStyle and SkewedStyle.

2.1 FlatStyle

Border tells the thickness or the width of the outer border of the flat toggle.

HeadColorType tells whether the head will take backcolors which are OffBackColor and OnBackColor or will it take the headcolors which are OffHead and OnHead.

HeadOffSize tells extra height and width to be added to the flat head.

HeadRadius tells the roundness of the head. This to work first you must set RadiusStyle Under FlatStyle to Custom.

OffHeadOffSet tells how far the head will move from left(X) and top(Y) when it is OFF.

OffSet tells how far the flat toggle will move from left(X) and Top(Y).

OffSize tells extra empty height and width to be added to the flat toggle.

OnHeadOffSet tells how far the head will move from left(X) and top(Y) when it is ON.

Radius tells the roundness of the flat toggle. This to work first you must set RadiusStyle Under FlatStyle to Custom.

RadiusStyle tells whether the flat toggle radius and the head radius is Round(in-built design) or Custom.

Speed tells animation speed of the flat toggle. Default is 5.

2.2 iOSStyle

HeadOffSize tells extra height and width to be added to the iOS head.

HeadRadius tells the roundness of the head. This to work first you must set RadiusStyle Under iOSStyle to Custom.

OffHeadOffSet tells how far the head will move from left(X) and top(Y) when it is OFF.

OffSet tells how far the iOS toggle will move from left(X) and Top(Y).

OffSize tells extra empty height and width to be added to the iOS toggle.

OnHeadOffSet tells how far the head will move from left(X) and top(Y) when it is ON.

Radius tells the roundness of the iOS toggle. This to work first you must set RadiusStyle Under iOSStyle to Custom.

RadiusStyle tells whether the iOS toggle radius and the head radius is Round(in-built design) or Custom.

Speed tells animation speed of the iOS toggle. Default is 5.

2.3 SkewedStyle

SkewedStyle is text based style. I mean apart from other designs it has, it also supports text. The default shape of the skewed toggle is parallelogram. You can customize it into whatever shape you want using the coordinates of the skewed toggle.

Coordinates dictate how the skewed toggle is drawn. Skewed toggle is drawn using four coordinates, (x1, y1), (x2, y2), (x3, y3), (x4, y4). These coordinates are available as TopLeft which is (x1, y1), TopRight which is (x2, y2), BottomRight which is (x3, y2) and BottomLeft which is (x4, y4).

OffFont tells the font of the skewed toggle when it is OFF.

OffSet tells how far the Skewed toggle will move from left(X) and Top(Y).

OffText tells the text to display when is is OFF.

OnFont tells the font of the skewed toggle when it is ON.

OnText tells the text to display when is is ON.

SizeOffSet tells extra height and width to be added to the skewed toggle.

Speed tells animation speed of the Skewed toggle. Default is 5.

3. Others

Checked tells whether the toggle is checked.

MouseClicks tells which mouse button click does the toggle accept.

4. Events

CheckChanged fires when Checked value is changed.

saaToggle1.CheckChanged += saaToggle3_CheckChanged;
private void saaToggle3_CheckChanged(object sender, EventArgs e)
   {
            var toggle = (SaaToggle)sender;
            var mouseEvents = (MouseEventArgs)e;
            //Then rest of your code
   }

Last updated