Bling is a C#-based library for easily programming images, animations, interactions, and visualizations on Microsoft's WPF/.NET. Bling is oriented towards design technologists, i.e., designers who sometimes program, to aid in the rapid prototyping of rich
UI design ideas. Students, artists, researchers, and hobbyists will also find Bling useful as a tool for quickly expressing ideas or visualizations. Bling's APIs and constructs are optimized for the fast programming of throw away code as opposed to the
careful programming of production code.

Bling as the following features that aid in the rapid prototyping of rich UIs:

Declarative constraints that maintain dynamic relationships in the UI without the need for complex event handling. For example,
button.Width = 100 - slider.Value causes button to shrink as the slider thumb is moved to the right, or grow as it is moved to the left. Constraints have many benefits: they allow rich custom layouts to be expressed with very little code, they are easy
animate, and they support UIs with lots of dynamic behavior.

Simplified animation with one line of code. For example,
button.Left.Animate().Duration(500).To = label.Right will cause button to move to the right of label in 500 milliseconds.

An experimental UI physics engine for integrating physics into user interfaces! The physics supported by Bling is flexible, controllable, and easy to program.

A rich library of geometry routines; e.g., finding where two lines intersect, the base of a triangle, the area of triangle, or a point on Bezier curve. These routines
are compatible with all of Bling's features; e.g., they can be used in express constraints, pixel shaders, or physical constraints. Bling also provides a rich API for manipulating angles in both degrees and radians.

As a lightweight wrapper around WPF, Bling code is completely compatible with conventional WPF code written in C#, XAML, or other .NET languages.

Bling is an open source project created by
Sean McDirmid and friends to aid in design rapid prototyping. We used Bling to enhance our productivity and would like to share it with other WPF UI design prototypers.

As of Bling 3, DirectX 10 is also supported for Windows Vista and Windows 7 (sorry XP users!). If you want to use DirectX 10, you'll have to install the latest redistrutable; e.g., the
web installer. Bling also depends on the
Windows API Code Pack and the
DLR, but both DLLs are included in the distribution.

Download the source release from the web page. An example comes with the release. To include in your own project for WPF development, simply add the Bling.Core and Bling.WPF projects to your solution, and then add a reference to the Bling project from your
own project. For DirectX 10 development, add and refer to the Bling.Core, Bling.WPF, and Bling.D3D10 projects.

Example

The code used in this getting started example is located in the GettingStarted.cs file of the GettingStarted project in the release. We start of this example by creating a
thumb and label on a canvas:

The first statement creates a red thumb that can be dragged (CanDrag = true). The initial location of the
thumb is in the right hand bottom corner of the canvas,
while its Z index is set to one. The second statement creates a label whose content is bound to "Hello World" prepended to the current location of the
thumb. By default,
assignments to properties in Bling are contraints where the bound to property will change as the bound-to expression changes. In our example, the
label's content will change
to always reflect the location of the thumb, which you can experience this by moving the
thumb. Likewise, the center position of the label is bound to the center of its containing canvas. As the window that contains the canvas is resized, the label is repositioned so that it always remains in the center.

Constraints are ubiquitous and incredibly expressive in Bling. Consider another constraint:

This code rotates the label according to the position of the thumb with respect to the center of the
label. A vector from the center of the label is first computed using subtraction, where the vector is then converted into a radian angle (via
Angle), which itself is turned into a degree angle (ToDegrees). The result is that the
label rotates as the thumb is moved in a circle around its center. This example demonstrates the power of Bling constraints: properties can be bound to many kinds of expressions including those that operate over angles.

The next piece of code demonstrates how a UI widget can easily undergo custom pixel shading:

We want to shade the label with respect to the position of thumbB. However, pixel shader effects are applied before render transforms, so we have to transform the position of
thumbB with respect to label's inverse transform, which happens on the first line of the shader (below
(input,uv) => {). Since transforms are relative to the widgets they are applied, we also subtract
label's left top position from thumbB's center position.
uv identifies the position of the pixel being shaded in term of a percentage rather than in pixels. So that we can compare
uv to the position of thumbB, we multiple it by the size of the label (line two) and then we can find the distance between the two points (line three). Line four specifies that the circle we care about is 500 pixels in radius, which we then invert
so that closer distances are higher in value. Line five uses the result d to interpolate between black and blue colors, which is then used on line six to create the color of the pixel with some modifications to its alpha.

The resulting pixel shader executes on the GPU with performance similar to a DirectX pixel shader, and in fact, it is a DirectX pixel shader. Pixel shaders can refer to many UI objects and properties directly, such as positions, although there are limitations.
For example, a pixel shader can refer to a point property but not an enum property, and can refer to an image brush but not a solid color brush (due to limitations enforced by WPF).