Windows Presentation Foundation

Az előadások a következő témára: "Windows Presentation Foundation"— Előadás másolata:

1 Windows Presentation Foundation
WPF alkalmazások fejlesztése Kovásznai Gergely Eszterházy Károly Főiskola, Információtechnológiai Tanszék

2 A .NET és a C# evolúciója .NET : a COM leváltására .NET CLR C# 2002
1.0 2003 1.1 2005 2.0 2.0 (pl. generikus) 2006 3.0 2.0 (pl. WPF) 2007 3.5 3.0 (pl. LINQ)

3 WPF – Új technológia Több mint 10 évig: Új technológiák:
User32, Windows Forms: felhasználói felületek Windows-ra GDI, GDI+: grafikai támogatás Új technológiák: WPF: Window Forms helyett DirectX: GDI+ helyett

4

5

6 Silverlight - WPF/E (WPF Everywhere)
WPF „részhalmaza” webböngészőben fut (plug-in: IE, Firefox, Safari) platformfüggetlen: Windows, Mac OS, Linux verzió: nem használható .NET Framework .NET nyelvek (C#) helyett szkriptnyelvek (JavaScript) 2.0 verzió: CLR beépítve, „könnyített” osztálykönyvtár .NET nyelvek használhatóak XAP-fájl = lefordított .NET szerelvények ZIP-elve

7 XAML (Extensible Application Markup Language)
Deklaratív nyelv UI leírására („vizuális fa”) tetszőleges CLR objektum példányosítására Az UI és az alkalmazáslogika leírása szeparált Generálható: Visual Studio, Expression Blend <Button Width="50" Background="LightBlue"> <Button.Content> <Image Source="RightArrow.png"/> </Button.Content> </Button> Button button = new Button(); button.Width = 50; button.Background = new SolidColorBrush(Colors.LightBlue); Image image = new Image(); image.Source = new BitmapImage(new Uri("RightArrow.png", UriKind.Relative)); button.Content = image;

8 XAML alapok I. Minden XAML elem egy objektumot példányosít
Objektumok tulajdonságai: XAML attribútumként (értéke string-ről konvertálva) Property elemként: <Button Content="Push"/> <Button> <Button.Content> <TextBlock Text="Push"/> </Button.Content> </Button>

9 XAML alapok II. Content elemek: <Button> <Button.Content>
<Image Source="push.png"/> </Button.Content> </Button> <Button> <Image Source="push.png"/> </Button>

10 Kontrolok Pl. Button, TextBox, TextBlock, CheckBox, RadioButton, Image
Összetett pl.: ListBox, ComboBox, TabControl Elrendezés pl.: StackPanel, DockPanel, Grid

11 Sablonok (Templates) DataTemplate
ItemsControl származékok (pl. ListBox) esetén ItemTemplate tulajdonság ListView esetén GridView nézetet használva beállítható a GridViewColumn.CellTemplate

12 Adatkötés (Data Binding) I.
Egy forrásobjektum egy tulajdonságának „hozzákötése” az UI egy célobjektumának egy tulajdonságához Binding objektum: Source: forrásobjektum Path: a forrásobjektum kötendő tulajdonsága Mode: kötés iránya

13 Adatkötés (Data Binding) II.
<TextBox> <TextBox.Text> <Binding Path="Address" Mode="TwoWay"/> </TextBox.Text> </TextBox> Markup Extensions: <TextBox Text="{Binding Path=Address, Mode=TwoWay}"/>

14 Adatkötés (Data Binding) III.
Source automatikus meghatározása: DataContext tulajdonság, melynek értéke a vizuális fában lefelé öröklődik A listakontrolok ItemsSource tulajdonsága: a kollekció elemei a lista elemeinek DataContext-jeként beállítódnak

15 Stílusok (Styles) A filozófiája hasonló a CSS-hez
Tulajdonságok értékei és eseménykezelők <Style TargetType="TextBox" x:Key="TB"> <Setter Property="FontSize" Value="16"/> <Setter Property="FontStyle" Value="Italic"/> <Setter Property="Background" Value="LightBlue"/> <Setter Property="Margin" Value="0,0,0,0"/> <EventSetter Event="TextChanged" Handler="TB_TextChanged"/> </Style> Ha erőforráskulcs nincs megadva, akkor explicit

16 Triggerek „Animáció” indítása valamilyen esemény hatására
„Sima” Trigger esetén tulajdonságok értékeinek megadása (Setter) <Trigger Property="IsSelected" Value="True"> <Setter Property="ForeGround" Value="Red"/> </Trigger> EventTrigger esetén akciók (Actions) megadása <EventTrigger RoutedEvent="MouseEnter"> <EventTrigger.Actions> ... </EventTrigger.Actions> </EventTrigger>

17 Animációk Tulajdonságalapú animációs rendszer
Tulajdonságérték interpolációja egy intervallumban Vezérlés: StoryBoard objektum Minden „alaptípusra” használható animációs osztály pl. DoubleAnimation, Int32Animation,ColorAnimation <BeginStoryboard> <Storyboard> <DoubleAnimation Storyboard.TargetProperty="FontSize" To="32" Duration="0:0:1"/> </Storyboard> </BeginStoryboard>

18 Animációs osztályok ByteAnimation QuarternionAnimation ColorAnimation
RectAnimation DecimalAnimation Rotation3DAnimation DoubleAnimation SingleAnimation Int16Animation SizeAnimation Int32Animation ThicknessAnimation Int64Animation VectorAnimation PointAnimation Vector3DAnimation Point3DAnimation

19 Transzformációk Bármely WPF-es UI-elem transzformálható a RenderTransform és LayoutTransform tulajdonságain keresztül eltolás: TranslateTransform skálázás: ScaleTransform forgatás: RotateTransform „döntés”: SkewTransform általános: MatrixTransform összetett: TransformGroup (mátrix kiszámítása)