Build Sleek User Interfaces

The vector graphics engine has a component-oriented architecture perfect for creating sleek user interfaces. Click on the image above to download and run the Robot Arm sample. Resize the window and notice how the vector graphics scale to the new size, with no degradation in quality. This effect is impossible to acheive with bitmap-based graphics.

In the Robot Arm sample, the "parts" (glowing round objects), arm, button bar at the top, and window buttons on the right, are all reusable graphical components.

Click on the image above to download and run the Path Move sample. The sample is described in more detail on the development blog.

Create an entire user interface using only vector graphics with the TranslucentForm class in Your windows can be any shape, with per-pixel translucency defined by graphics. Click on the image above to download and run the Translucent Calculator sample. Read the Translucent Calculator article to learn more.

This is a screenshot of the state machine editor built by [state] method. Each graphical object in the state diagram is a custom component.

Animated vector graphics can be displayed directly in Internet Explorer. The user is not required to install anything -- the .NET dlls simply load and display. This is because is designed to run in the restricted security context provided by Internet Explorer. To create this display, dial, button, and panel components were first constructed in the Picture Designer. These components were then reused several times to build the web interface. Click on the image above to run the animated demonstration. 3D Effects

Build reusable vector graphics components using the designer integrated in Visual Studio .NET. To construct this Picture, gel rectangle, gel ellipse, and solid ellipse components were first created, using path gradients to create 3D effects. Path gradients were used for the drop shadows. The development blog describes how to build a gel ellipse.

Standard Windows Forms Controls do not support transparency well: it is emulated by redrawing the Control immediately behind, causing bugs and performance problems. Because graphical components are not Controls, they provide true transparency, and suffer none of the Control problems. Click on the image above to download and run the Translucent Gel Buttons sample. An article on the development blog describes how to build your own reusable translucent gel buttons.

In, the Picture object is the basic component of reuse. Pictures can be nested to any depth. In the Image Zoom sample illustrated here, the ClipRectangle property defines a view port through which you can see a portion of a child Picture. The child Picture contains a large zoomable image. Click on the image above to download and run the Image Zoom sample.

The image in this sample was generously provided by Vlad Gerasimov at Vladstudio: