Powered by Blogger.

Saturday, March 1, 2014

Transforms in WPF and their types



Here in this article, we will discuss how Transforms in WPF takes the responsibility of rendering the objects.

Also you can check out:

- How to disable right click by using jQuery in asp.net?

- jQuery or validation controls? which should be used for validation?

- Redirect users to different web site in Asp.Net using JavaScript

Some visuals would be difficult or impossible to achieve directly, so for achieving it, WPF provides transforms, which will take the responsibility of rendering the objects. Those are:

Translate Transform: It does nothing more than shift an element away from its current location. The important properties on this are X and Y, setting these properties controls how the element will be translated along the x or y axis.

Skew Transform: It distorts the original element by shearing or shifting it along the x or y axis. To control this, you can use the AngleX and AngleY properties with values from -90 to 90.

Rotate Transform: It alters an element by rotating it based on a specified angle. It should be no surprise that this is accomplished by setting the Angle property.

Scale Transform: If you need to alter an element’s size, use this transform. It has ScaleX and ScaleY properties, which enable this functionality. Setting these properties to different values will cause the element to be stretched along either the x or y axis. A value of 1 represents normal size, whereas using a 2 would be double the size.

Transform Group: Many times you cannot get the desired transformation by a single transform, in this case you should use the Transform Group. It has a children property which can be set to an arbitrary number of transform instances.

Bitmap Effects:
The final piece of WPF’s visual puzzle is bitmap effects. Every UIElement has a BitmapEffect property that can be used to add various special shader like effects to the element. Several built-in effects represent things that designers use frequently.

DropShadowBitmapEffect: it is one of the most common effects you’ll want to apply to an element. It adds a shadow behind the element, cast by a configurable light source. Normally the default effect works for most needs, but you can customize it by using several properties. The most common properties you will use are ShadowDepth, Color, and Direction.

OuterGlowBitmapEffect: it adds a halo to the element it is applied to. This can add a very nice, subtle effect to text and is great for providing user feedback for mouseover events. GlowColor and GlowSize are handy properties for controlling the main aspects of the halo.

BlurBitmapEffect: if you want to make an element appear unfocused or blurry, use this effect. You will likely want to adjust its Radius property to set the degree of blurriness.

EmbossBitmapEffect: To add texture or depth to an object, you may use this effect.

BevelBitmapEffect: if you want to give the element an appearance of being raised, you can add this effect. It has LightAngle and Relief properties, but it can be further customized by setting its BevelWidth, EdgeProfile, and Smoothness.

BitmapEffectGroup: if you desire to apply multiple effects to a single element, you would use this effect.

Triggers: these are special features of Style, DataTemplate and Framework Element. Thru the careful use of triggers, you can declaratively enable your UI and graphics to respond to mouse events, changes in dependency properties, and even changes in your application’s data model.

Each trigger in the collection is connected to a specific property and value. When the specified property matches the value declared in the trigger, it uses its setter’s collection to alter the UI. When the trigger’s value ceases to match the property, the effects of the setters are removed.

If multiple triggers alter the same UI properties, the last one wins.
The setter elements used in a trigger are the same as those used in a style.
There’s no limit to the number of setters and triggers you can define. The only stipulation is that you must trigger and alter dependency properties only. 





0 comments

Post a Comment