Medii Vizuale de Programare - gate.upm.rogate.upm.ro/poo/DOCs/NET/PPT-PDF/ch12.pdf · - Grafica...
15
5/30/2012 Capitolul 12 – WPF si XAML 1 Medii Vizuale de Programare Capitolul 12 Dezvoltarea interfetelor grafice folosind WPF si XAML
Transcript of Medii Vizuale de Programare - gate.upm.rogate.upm.ro/poo/DOCs/NET/PPT-PDF/ch12.pdf · - Grafica...
5/30/2012 Capitolul 12 – WPF si XAML
1
Medii Vizuale de Programare
Capitolul 12
Dezvoltarea interfetelor grafice folosind WPF si XAML
5/30/2012 Capitolul 12 – WPF si XAML 2
Continutul cursului
0. Introducere
1. Prezentare .NET Framework si Visual Studio
2. C# - Tipuri de date si membri
3. Gestionarea interfetelor utilizator
4. Concepte POO in Visual Studio .NET
5. Testarea si debugging-ul aplicatiilor
6. GDI+. Controale utilizator.
7. Accesarea bazelor de date. ADO.NET
8. Assemblies. Aplicatii - configurare, securizare, instalare, rulare
9. Dezvoltarea de aplicatii ASP.NET
10. Web Services
11. .NET Framework 3.0 si 3.5
12. Dezvoltarea interfetelor grafice folosind WPF si XAML
5/30/2012 3
Capitolul 12
12. Dezvoltarea interfetelor grafice folosind WPF si XAML 12.1. Windows Presentation Foundation (WPF)
12.1.1. Dezvoltarea interfetelor grafice inainte de WPF
12.1.2. Ce este WPF?
12.1.3. Caracteristici WPF
12.1.4. Forme de prezentare ale aplicatiilor WPF
12.1.5. De ce sa folosim WPF?
12.2. Limbajul XAML 12.2.1. Definitie
12.2.2. HelloWorld – Primul program in WPF/XAML
12.2.3. Sintaxa XAML
12.2.4. Exemplu
Capitolul 12 – WPF si XAML
5/30/2012 4
Cap. 12. Dezvoltarea interfetelor grafice folosind WPF si XAML
12.1. Windows Presentation Foundation (WPF)
12.1.1. Dezvoltarea interfetelor grafice inainte de WPF
- Windows Forms
- GDI+
- Probleme: - Crearea de controale customizate necesita multa munca
- Viteza de desenare este relativ mica (in comparatie cu aplicatiile dezvoltate in C/C++)
- Foloseste API-ul Windows pentru desenarea interfelor
- Posibilitati limitate in ceea ce priveste grafica 3D
- Numar (relativ) limitat de controale
Capitolul 12 – WPF si XAML
5/30/2012 5
Cap. 12. Dezvoltarea interfetelor grafice folosind WPF si XAML
12.1. Windows Presentation Foundation (WPF)
12.1.2. Ce este WPF?
- WPF – o modalitate de a construi interfete grafice prin care se separa partea de interfata de codul ce implementeaza functionalitatea aplicatiei
- WPF apare pentru prima data in .NET Framework 3.0
- Permite realizarea de interfete grafice spectaculoase (2D si 3D)
- Permite customizarea usoara a controalelor
- Viteza mare de executie prin rularea la nivelul placii video (foloseste DirectX)
- Important! WPF nu inlocuieste Windows Forms.
Capitolul 12 – WPF si XAML
5/30/2012 6
Cap. 12. Dezvoltarea interfetelor grafice folosind WPF si XAML
12.1. Windows Presentation Foundation (WPF)
12.1.3. Caracteristici WPF
- Interfata utilizator declarativa (limbajul XAML)
- Pozitionare inteligenta - Ofera un sistem de paginare extensibil pentru a aranja vizual elementele unei
interfete utilizator
- Grafica scalabila - Grafica este bazata pe vectori (vectoriala)
- Template-uri - Faciliteaza crearea elementelor reutilizabile
- Legarea (Binding) - Imbunatatita fata de Windows Forms
Capitolul 12 – WPF si XAML
5/30/2012 7
Cap. 12. Dezvoltarea interfetelor grafice folosind WPF si XAML
12.1. Windows Presentation Foundation (WPF)
12.1.3. Caracteristici WPF
- Stilizarea (Styling)
- Declansatoare (Triggers) - Permit schimbari de stil in functie de anumite evenimente
- Animatie - Posibilitati multiple de animatie la nivelul controalelor
- 3D - Modelari 3D de baza si animatie
Capitolul 12 – WPF si XAML
5/30/2012 8
Cap. 12. Dezvoltarea interfetelor grafice folosind WPF si XAML
12.1. Windows Presentation Foundation (WPF)
12.1.4. Forme de prezentare a apliatiilor WPF
- Aplicatii desktop
- Aplicatii XBAP - Aplicatii gazduite in browsere (Internet Explorer sau Firefox)
- WPF si Silverlight
Capitolul 12 – WPF si XAML
5/30/2012 9
Cap. 12. Dezvoltarea interfetelor grafice folosind WPF si XAML
12.1. Windows Presentation Foundation (WPF)
12.1.5. De ce sa folosim WPF?
- Separarea interfetei de functionalitate permite sa lucreze simultan designer-ii si programatorii, reducandu-se astfel timpul de dezvoltare al aplicatiilor
- Permite realizarea de interfete grafice moderne (efecte de animatie, 3D, etc.)
- Permite realizarea de interfete grafice customizate
- Viteza este foarte buna prin utilizarea DirectX
Capitolul 12 – WPF si XAML
5/30/2012 10
Cap. 12. Dezvoltarea interfetelor grafice folosind WPF si XAML
12.2. Limbajul XAML
12.2.1. Definitie
- XAML este limbajul folosit pentru crearea interfetelor utilizator in WPF
- Bazat pe XML si similar cu HTML, MXML, etc.
- Extensia fisierelor ce contin cod XAML este .xaml
- XAML poate fi interpretat sau compilat
Capitolul 12 – WPF si XAML
5/30/2012 11
Cap. 12. Dezvoltarea interfetelor grafice folosind WPF si XAML
12.2. Limbajul XAML
12.2.2. HelloWorld – Primul program in WPF/XAML
1. Deschidem un editor de text.
2. Cream un document text si introducem urmatorul cod: <Page
xmlns=http://schemas.microsoft.com/winfx/2006/xaml/presentati
on xmlns:x=http://schemas.microsoft.com/winfx/2006/xaml>
TextBlock Text=”Hello World!” />
</Page>
3. Salvam ca HelloWorld.xaml
4. Facem dublu-click pe fisierul nou creat si ar trebui sa se deschida intr-un browser web.
Capitolul 12 – WPF si XAML
5/30/2012 12
Cap. 12. Dezvoltarea interfetelor grafice folosind WPF si XAML
12.2. Limbajul XAML
12.2.3. Sintaxa XAML
- Un element in XAML este o instanta a unui obiect, iar atributele reprezinta proprietatile acelui obiect <Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presenta
tion"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Button x:Name="blueButton" Width="100" Height="40"
Background="Blue" Content="Click Me" />
</Page>
- Elementul radacina contine o instanta a clasei Page, mai precis System.Windows.Controls.Page
- x:Name nu este o proprietate, ci un atribut special ce reprezinta un identificator unic
Capitolul 12 – WPF si XAML
5/30/2012 13
Cap. 12. Dezvoltarea interfetelor grafice folosind WPF si XAML
12.2. Limbajul XAML
12.2.3. Sintaxa XAML
- Cod C# echivalent: ButtonblueButton =new Button();
blueButton.Width = 100;
blueButton.Height = 40;
blueButton.Content ="Click Me";
blueButton.Background =new SolidColorBrush(Colors.Blue);
Capitolul 12 – WPF si XAML
5/30/2012 14
Cap. 12. Dezvoltarea interfetelor grafice folosind WPF si XAML
12.2. Limbajul XAML
12.2.4. Exemplu <Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="ExampleNamespace.ExamplePage">
<Button Click="Button_Click" >Click Me!</Button>
</Page>
namespace ExampleNamespace
{
public partial class ExamplePage
{
void Button_Click(object sender, RoutedEventArgs e)
{
Button b = e.Source as Button;
b.Foreground = Brushes.Red;
}
}
}
Capitolul 12 – WPF si XAML
5/30/2012 Capitolul 12 – WPF si XAML
15
Continutul cursului
0. Introducere
1. Prezentare .NET Framework si Visual Studio
2. C# - Tipuri de date si membri
3. Gestionarea interfetelor utilizator
4. Concepte POO in Visual Studio .NET
5. Testarea si debugging-ul aplicatiilor
6. GDI+. Controale utilizator.
7. Accesarea bazelor de date. ADO.NET
8. Assemblies. Aplicatii - configurare, securizare, instalare, rulare
9. Dezvoltarea de aplicatii ASP.NET
10. Web Services
11. .NET Framework 3.0, 3.5 si 4.0
12. Dezvoltarea interfetelor grafice folosind WPF si XAML
