Login | Register   
Twitter
RSS Feed
Download our iPhone app
TODAY'S HEADLINES  |   ARTICLE ARCHIVE  |   FORUMS  |   TIP BANK
Browse DevX
Sign up for e-mail newsletters from DevX


advertisement
 

Take Avalon to the Next Dimension to Achieve 3D Effects

Find out how to use Expression, Microsoft's new XAML design tool, to build advanced user interfaces that incorporate 3D effects and inheritable control styling—and still interact seamlessly with your Visual Studio projects.


advertisement
he earlier articles in this series (here and here) looked at how WPF works and how it fits in with the plethora of technologies that are available to build next generation applications. The articles discussed:
  • XML application markup language (XAML)
  • WinFX, the next generation of development APIs for Windows
  • Avalon, aka the Windows Presentation Foundation (WPF), the collection of APIs and runtime technologies for user interfaces
  • Expression, the new tool for developing with XAML and WPF
  • Cider, the plug-in for handling XAML with Visual Studio 2005
They then showed how to build a sample application that implements an online store using those technologies. But the sample application had a flat, two-dimensional user interface similar to interfaces you've seen (and built) for the past several years.

Now, get ready for change. With WPF you can easily go beyond flat 2D applications, adding animation, three-dimensional, and "gel" effects. This article shows you how to provide some of these UI enhancements to the previous sample application. The end result is that the finished sample application looks entirely different. Figure 1 shows the new 3D version, while Figure 2 shows the original 2D interface.

 
Figure 1. 3D Version of the Spy Store: The Spy Store application, extended with 3D, "gel," and reflection effects.
 
Figure 2. Initial Application: Here's how the sample application looks before you begin adding 3D and Gel effects.
If you haven't already done so, I recommend that you read the preceding article in this series which explains how the application works and walks you through the process of creating it. That will give you the background you need to start adding the 3D and animation effects.

Figure 2 shows how Expression and the sample application from the previous article should appear before you begin. It's important to realize before you start that you won't need to modify the application's existing code to achieve these rather radical UI changes—all the changes take place in the XAML UI layer without affecting the underlying application.



Comment and Contribute

 

 

 

 

 


(Maximum characters: 1200). You have 1200 characters left.

 

 

Sitemap