Home > Microsoft .Net Development Tips > Microsoft Office Development > XAML as an everywhere presentation format
Win Development Tips:
EMAIL THIS
 TIPS & NEWSLETTERS TOPICS 

MICROSOFT OFFICE DEVELOPMENT

XAML as an everywhere presentation format


Daniel Rubio, Contributor
03.04.2008
Rating: --- (out of 5)


.NET Essentials Channel
Digg This!    StumbleUpon Toolbar StumbleUpon    Bookmark with Delicious Del.icio.us    Add to Google


XAML, the Extensible Application Markup Language, lets .NET developers and designers define the key elements of a UI. What's more, it accommodates both Windows Presentation Foundation and SIlverlight, as this tip demonstrates.


Developing a Windows application entails knowing your way around the usual suspects in terms of software development -- an IDE or text editor, a mechanism to access your data source, some business logic and a final layout for end users to appreciate.

Prior to the appearance of the .NET Framework, there were many techniques and APIs one could use to achieve such results. Fortunately, .NET has brought great success in unifying various areas in this respect, to the benefit of developers who can now focus on core issues that can be applied equally across programming languages -- C#, Visual Basic .NET and J#, among others -- and application tiers like ASP.NET and ADO.NET. Up next we will focus our attention on one of these unified approaches in the form of a presentation format named XAML (Extensible Application Markup Language).

What is particularly interesting about XAML, from an application lifecycle point of view, is its influence on creating applications targeting both desktops (think rich client) and Web-bound interfaces. In the area of rich-client applications, XAML is an important building block for the Windows Presentation Foundation (WPF), which in itself is one of the main pillars for the .NET Framework 3.0 and onward. On the other hand, in the area of Web applications, XAML plays an equally important in the use of Silverlight, a rich, interactive runtime that is now being distributed alongside Microsoft's flagship browser Internet Explorer. (Silverlight also works inside the Firefox and Safari browsers, as well as on the Mac and, soon, on Linux.)

While both WPF and Silverlight possess numerous inner workings unique unto themselves, it is to the benefit of those performing user interface design that bot


Digg This!    StumbleUpon Toolbar StumbleUpon    Bookmark with Delicious Del.icio.us    Add to Google


RELATED CONTENT
.NET Framework development with XML and XAML
How to write an out-of-browser Silverlight 3 application in 3 steps
Ajax Learning Guide
Ajax Learning Guide
Open XML SDK ready for the road
Silverlight Spy scans XAML objects, eases JavaScript debugging
Java presentation tool outputs XAML files
Microsoft, Cisco et al. to partner on modeling language
Microsoft's XAML recasts UI development
XAML Learning Guide: Forums and Community
XAML Learning Guide: Development Tools

ASP.NET Development
How to use jQuery to solve Javascript browser compatibility problems
How to write an out-of-browser Silverlight 3 application in 3 steps
Silverlight 3 beta SDK download lets developers try new RIA features
Visual Studio's IntelliSense for jQuery doesn't autocomplete correctly
Dundas Map for .NET kicks up geographic visualization
Return to CodePlex: Into the Sandcastle…
VBScript Tutorial
Use PHP with Visual Studio to create Web sites
Visual Studio Team System Add-ins: Conchango Scrum for Team System and Scrum Dashboard
Visual Studio 2008 and .NET Framework 3.5 SP1 introduces ADO .NET Entity Designer

Microsoft Office Development
Downloadable MSDN library released for VS 2008 SP 1
Check the MSDN Virtual Labs for regular, compelling new content
Windows XP SP3 pack includes new XML parser, enhanced IP security
Book excerpt: Building personalized solutions in SharePoint 2007
Book excerpt: Building document management solutions in SharePoint 2007
Where are the Visual Studio 2008 Tools for Office?
ClickOnce: Automated smart client deployment
Book excerpt: SharePoint 2007 and content types
Update desktops automatically using the AppUpdater component
VantagePoint WPF Controls delivers rich suite of UI components

RELATED GLOSSARY TERMS
Terms from Whatis.com − the technology online dictionary
Atlas  (SearchWinDevelopment.com)
RSS  (SearchWinDevelopment.com)
Silverlight  (SearchWinDevelopment.com)
Windows Communication Foundation  (SearchWinDevelopment.com)

RELATED RESOURCES
2020software.com, trial software downloads for accounting software, ERP software, CRM software and business software systems
Search Bitpipe.com for the latest white papers and business webcasts
Whatis.com, the online computer dictionary


h technologies leverage the same presentation language in XAML to create layouts, colors, styles, ToolTips and every other little aspect related to presentation. XAML, being a markup language, relies on the use of tags -- a la <html> or <xml> -- to define a wide range of behaviors and effects that are then visually rendered by either a .NET runtime or Silverlight runtime. For example, look at the following snapshot, which illustrates a rich-client interface composed using XAML. (Click on the image to see it at its full size.)

[IMAGE]

Figure 1: XAML rendered in WPF (Source: Microsoft WPF Quick Start sample)

All the presentation features, including layout, color effects, buttons and events are achieved with unique tags that make up XAML (in this particular case, the presentation rendered via a .NET runtime in the form of a rich client) is composed from markup, which is in part presented here:

In the previous listing, numerous tags are self-explanatory, such as the use of <Border>, <Image>, <MediaElement> and <Style>, which through attributes specify even more finely grained presentation details. Additionally, you will find basic geometry elements, such as <Rectangle> and >LinearGradientBrush>, as well as behavioral presentation elements like <EventTrigger>, which are used to detect user interactions on the interface. These are just a sampling of the entire body of XAML tags available to designers.

Another important aspect is how this last XAML listing is devoid of any application logic and simply provides a visual veneer over the core of an application. It leaves a clean separation between presentation and code, which fosters easier modifications to both the visual display of an application and its internal workings.

Still, let's assume you wanted to offer these same visual effects created for your rich-client users, using WPF, to visitors via the Internet. Well, you can do so using essentially the same XAML elements, thanks to Silverlight.

In this scenario, the boon of being able to leverage XAML in Web environments is that your applications will be able to offer effects beyond the basic staple Web languages -- HTML, CSS and JavaScript -- without diverging into specialized Web-centric platforms like Flash or Java (which until recently were the only options available for such effects), all whilst staying within the same knowledge domain applicable for both your rich-client and Web-based presentation needs. Figure 2 shows a Web-based application rendered in Silverlight:

[IMAGE]

Figure 2: XAML rendered in Silverlight (Source: Microsoft Netherlands)

Though it's somewhat difficult to appreciate statically -- see source links for live samples -- the same rounded images with colored shadows, the capability to play videos while hovering over images, and the integrated toggling capabilities are all achievable using practically the same XAML elements presented in the earlier WPF sample.

Once again, even though there are particularities behind each approach -- such as knowing C# or Visual Basic for structuring WPF apps and JavaScript and HTML for Silverlight 1.0 -- a XAML structure is decoupled from the bulk of the logic present in an application, which inclusively for those accustomed to Web-based development is a technique very much in-line with the classical style-sheet design.

As far as composing XAML layouts is concerned, Microsoft's main development environment in the form of Visual Studio 2008 already incorporates numerous facilities to easily and visually create rich-application interfaces in this form, additionally there are also a series of third-party tools catering to the needs of more sophisticated interface designers needing to make their way around XAML; meanwhile, for those accustomed to a more 'nuts & bolts' approach, XAML, being of a tag-based nature, can also be easily manipulated with an XML or text editor.

Though the appearance of both WPF and Silverlight is just making headway among Windows developers, the use of XAML in both technologies should be welcome relief for those tired of dealing with fragmented approaches for creating user interfaces. As a result, it should also give XAML a leading position as an everywhere presentation format.

Daniel Rubio is an independent technology consultant with more than 10 years of experience in enterprise and Web-based software. He blogs regularly on these and other software areas at www.webforefront.com.


Rate this Tip
To rate tips, you must be a member of SearchWinDevelopment.com.
Register now to start rating these tips. Log in if you are already a member.




DISCLAIMER: Our Tips Exchange is a forum for you to share technical advice and expertise with your peers and to learn from other enterprise IT professionals. TechTarget provides the infrastructure to facilitate this sharing of information. However, we cannot guarantee the accuracy or validity of the material submitted. You agree that your use of the Ask The Expert services and your reliance on any questions, answers, information or other materials received through this Web site is at your own risk.



Database Programming Solutions - .NET XML, Visual Studio LINQ, ORM .NET
About Us  |  Contact Us  |  For Advertisers  |  For Business Partners  |  Site Index  |  RSS
SEARCH 
TechTarget provides technology professionals with the information they need to perform their jobs - from developing strategy, to making cost-effective purchase decisions and managing their organizations' technology projects - with its network of technology-specific websites, events and online magazines.

TechTarget Corporate Web Site  |  Media Kits  |  Site Map




All Rights Reserved, Copyright 2000 - 2009, TechTarget | Read our Privacy Policy
  TechTarget - The IT Media ROI Experts