Windows presentation foundation wpf
1 / 23

Windows Presentation Foundation (WPF) - PowerPoint PPT Presentation

  • Uploaded on

Windows Presentation Foundation (WPF). Chapter 16 Dr. Abraham. WPF. Microsoft’s new framework for GUI, graphics animation and multimedia. WPF generates vector-based graphics and is resolution independent. Building a GUI with WPF

I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
Download Presentation

PowerPoint Slideshow about ' Windows Presentation Foundation (WPF)' - len

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.

- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript


  • Microsoft’s new framework for GUI, graphics animation and multimedia.

  • WPF generates vector-based graphics and is resolution independent.

  • Building a GUI with WPF

  • WPF uses XAML (Extensible Application Markup Language) to generate the code.


  • When you use the designer, the IDE creates code to create and configure the controls

  • In WPF, it generates XAML. You can manually write XAML to define GUI controls.

  • When the application is compiled the XAML compiler generates code to create and configure controls.

  • XAML allows designers and programmers to work together more efficiently.

Xml tutorial


Portions from w3 schools

By Dr. John Abraham

What is xml
What is XML?

  • XML stands for EXtensible Markup Language XML is a markup language much like HTML XML was designed to describe dataXML tags are not predefined. You must define your own tagsXML uses a Document Type Definition (DTD) or an XML Schema to describe the data XML with a DTD or XML Schema is designed to be self-descriptiveXML is a W3C Recommendation - 1996


  • Portable, Widely supported, Open technology

  • Standard for storing data (as text file) that are exchanged between applications.

  • Not for displaying data

  • No predefined tags – user supplies tags.

  • With XML, financial information can be exchanged over the Internet

Xml vs html

  • XML was designed to describe data and to focus on what data is.HTML was designed to display data and to focus on how data looks.

  • HTML is about displaying information, while XML is about describing information

  • XML can separate data from HTML

Article xml file

  • <?xml version = "1.0"?>

  • <!-- Article structured with XML -->

  • <article>

  • <title>Simple XML</title>

  • <date>December 6, 2001</date>

  • <author>

  • <firstName>John</firstName>

  • <lastName>Doe</lastName>

  • </author>

  • <summary>XML is pretty easy.</summary>

  • <content>In this chapter, we present a wide variety of examples that use XML.

  • </content>

  • </article>


  • Root element is article

  • Child elements are title, data, author & summary

  • To process this file, an XML parser is required, such as msxml (microsoft), Xerces (appache), etc.

Xml rules
XML rules

  • All XML elements must have a closing tag

    • With XML, it is illegal to omit the closing tag.

  • XML tags are case sensitive

  • All XML elements must be properly nested. Following is wrong:

    • <b><i>This text is bold and italic</b></i>

  • All XML documents must have a single root element

Xml attributes
XML attributes

  • XML elements can have attributes in the start tag, just like HTML.

  • Attribute values must always be quoted

  • <note date="12/11/2002">

  • Avoid using attributes if you can. Use child elements instead.


  • A Document Type Definition defines the legal building blocks of an XML document. It defines the document structure with a list of legal elements.

  • A "Valid" XML document also conforms to a DTD.

  • A "Valid" XML document is a "Well Formed" XML document, which also conforms to the rules of a Document Type Definition (DTD)

  • A DTD can be declared inline in your XML document, or as an external reference

  • Your application can use a standard DTD to verify that the data you receive from the outside world is valid.

  • You can also use a DTD to verify your own data.

Internal dtd
Internal DTD

  • <?xml version="1.0"?>

  • <!DOCTYPE note [

  • <!ELEMENT note (to,from,heading,body)>

  • <!ELEMENT to (#PCDATA)>

  • <!ELEMENT from (#PCDATA)>

  • <!ELEMENT heading (#PCDATA)>

  • <!ELEMENT body (#PCDATA)>

  • ]>

  • <note>

  • <to>Tove</to>

  • <from>Jani</from>

  • <heading>Reminder</heading>

  • <body>Don't forget me this weekend</body>

  • </note>

This dtd is interpreted like this
This DTD is interpreted like this:

  • !DOCTYPE note (in line 2) defines that this is a document of the type note.

  • !ELEMENT note (in line 3) defines the note element as having four elements: "to,from,heading,body".

  • !ELEMENT to (in line 4) defines the to element to be of the type "#PCDATA".

  • !ELEMENT from (in line 5) defines the from element to be of the type "#PCDATA"

  • and so on.....

External doctype declaration
External DOCTYPE declaration

  • If the DTD is external to your XML source file, it should be wrapped in a DOCTYPE definition with the following syntax:

  • <!DOCTYPE root-element SYSTEM "filename">

  • <?xml version="1.0"?>

  • <!DOCTYPE note SYSTEM "note.dtd">

  • <note>

  • <to>Tove</to>

  • <from>Jani</from>

  • <heading>Reminder</heading>

  • <body>Don't forget me this weekend!</body>

  • </note>

  • And this is a copy of the file "note.dtd" containing the DTD:

  • <!ELEMENT note (to,from,heading,body)>

  • <!ELEMENT to (#PCDATA)>

  • <!ELEMENT from (#PCDATA)>

  • <!ELEMENT heading (#PCDATA)>

  • <!ELEMENT body (#PCDATA)>

Xml schema
XML Schema

XML Schema is an XML based alternative to DTD.

  • An XML schema describes the structure of an XML document.

  • The XML Schema language is also referred to as XML Schema Definition (XSD).

  • An XML Schema:

    • defines elements that can appear in a document

    • defines attributes that can appear in a document

    • defines which elements are child elements

    • defines the order of child elements

    • defines the number of child elements

    • defines whether an element is empty or can include text

    • defines data types for elements and attributes

    • defines default and fixed values for elements and attributes

A simple xml schema
A Simple XML Schema

  • This is a simple XML Schema file called "note.xsd" that defines the elements of the XML document above ("note.xml"):

  • <?xml version="1.0"?>

  • <xs:schema xmlns:xs=""

  • targetNamespace=""

  • xmlns=""

  • elementFormDefault="qualified"><xs:element name="note">

  • <xs:complexType>

  • <xs:sequence>

  • <xs:element name="to" type="xs:string"/>

  • <xs:element name="from" type="xs:string"/>

  • <xs:element name="heading" type="xs:string"/>

  • <xs:element name="body" type="xs:string"/>

  • </xs:sequence>

  • </xs:complexType>

  • </xs:element></xs:schema>

Viewing xml files
Viewing XML files

  • Raw XML files can be viewed in Mozilla, Firefox, Opera, Internet Explorer, and in Netscape 6+.

  • However, to make XML documents to display like nice web pages, you will have to add some display information

  • With CSS (Cascading Style Sheets) you can add display information to an XML document.

  • Look at this XML file: Look at this XML file: note.xml

Displaying xml files with css
Displaying XML files with CSS

  • Take a look at this XML file: The CD catalog

  • Then look at this style sheet: The CSS file

  • Finally, view: The CD catalog formatted with the CSS file

    • XSL (the eXtensible Stylesheet Language) is the preferred style sheet language of XML.

    • View the XML file, the XSL style sheet, and View the result.


XSLT (Extensible Stylesheet Language Tranformation) is a language for transforming XML documents into XHTML documents or to other XML documents.

  • XSLT is the most important part of XSL

  • XSLT transforms an XML document into another XML document

  • XSLT uses XPath to navigate in XML documents

Xaml programming

  • Here is the hello world program we wrote in class

    <Window x:Class="wpfHello.MainWindow"



    Title="Say Hello Program" Height="350" Width="525" Background="Gold">


    <Label HorizontalAlignment="Center" VerticalAlignment="Center">

    Welcome to My first WPF program!


    <Button Content="say Hello" Height="23" HorizontalAlignment="Left" Margin="10,10,0,0" Name="btnHello" VerticalAlignment="Top" Width="75" Click="btnHello_Click" />

    <TextBox Height="23" HorizontalAlignment="Left" Margin="331,12,0,0" Name="txtHello" VerticalAlignment="Top" Width="120" />



Future value interface with wpf
Future value interface with WPF

<Window x:Class="WpfFutureValue.MainWindow"



Title="Future Value Program in WPF" Height="458" Width="610" Background="Gray" FontWeight="Bold">

<Grid Height="368" Width="650">

<TextBox Height="23" HorizontalAlignment="Left" Margin="390,0,0,0" Name="txtInitDep" VerticalAlignment="Top" Width="120" />

<Label Content="Initial Deposit" Height="23" HorizontalAlignment="Left" Margin="296,0,0,0" Name="label1" VerticalAlignment="Top" Width="88" />

<TextBox Height="23" HorizontalAlignment="Left" Margin="390,29,0,0" Name="txtPerDep" VerticalAlignment="Top" Width="120" />

<Label Content="Deposit Every 30 days" Height="31" HorizontalAlignment="Left" Margin="249,29,0,0" Name="label2" VerticalAlignment="Top" Width="135" />

<TextBox Height="23" HorizontalAlignment="Right" Margin="0,58,140,0" Name="txtRate" VerticalAlignment="Top" Width="120" />

<Label Content="Rate of Interest Per annum" Height="31" HorizontalAlignment="Left" Margin="186,50,0,0" Name="label3" VerticalAlignment="Top" Width="165" />

<TextBox Height="23" HorizontalAlignment="Right" Margin="0,86,140,0" Name="txtStartAge" VerticalAlignment="Top" Width="120" />

<Label Content="Age When Account Started" Height="31" HorizontalAlignment="Left" Margin="186,86,0,0" Name="label4" VerticalAlignment="Top" Width="165" />

<TextBox Height="23" HorizontalAlignment="Right" Margin="0,111,140,0" Name="txtRetAge" VerticalAlignment="Top" Width="120" />

<Label Content="Retirement Age" Height="31" HorizontalAlignment="Left" Margin="249,111,0,0" Name="label6" VerticalAlignment="Top" Width="102" />

<Button Content="Calculate" Height="23" HorizontalAlignment="Left" Margin="10,10,0,0" Name="btnCalculate" VerticalAlignment="Top" Width="75" Click="btnCalculate_Click" />

<RichTextBox Height="246" HorizontalAlignment="Left" Margin="1,139,0,0" Name="txtOutput" VerticalAlignment="Top" Width="559" TextChanged="txtOutput_TextChanged" VerticalScrollBarVisibility="Visible" Background="gold" FontFamily="Courier New" />