Adaptív megjelenítés a WPF layout rendszer segítségével

Az előadások a következő témára: "Adaptív megjelenítés a WPF layout rendszer segítségével"— Előadás másolata:

1 Adaptív megjelenítés a WPF layout rendszer segítségével
Bátyai Krisztián MCT, MCPD 3.5, MCTS 3.5 WPF NetAcademia Oktatóközpont

2 Az előadás célja: WPF layout rendszer lehetőségei
útravalók: Mindenre van „gyári” lehetőség! ha mégse… azt könnyedén programozható! Komoly delta a Winformshoz képest a layout 3 utravaló amit az előadás közben megmutatunk.

3 Amiről szó lesz… Alapozás Adatsablon Egyedi layout Layout csere
Alapozás, layout csere, adatsablonok, converterek, kaxaml layout rendszer- ficsörszet, egyedi layout Layout csere Converter-ek Layout példák

4 Amiről szó lesz… ELSŐ HARMADIK ÖTÖDIK MÁSODIK NEGYEDIK HATODIK

5 WPF Layout kulcsszavakban
Iteratív méretező algoritmus (measure, arrange) Egymásba ágyazhatóság Szolgáltatások Margó, Padding Igazítás Clipping Layout vezérlők Transzformációk Template-k LAYOUT

6 Beépített panelek 4/4/2017 9:55 PM 6
©2005 Microsoft Corporation. All rights reserved. This presentation is for informational purposes only. Microsoft makes no warranties, express or implied, in this summary.

7 Layout alapozás…

8 Amiről szó lesz… ELSŐ HARMADIK ÖTÖDIK MÁSODIK NEGYEDIK HATODIK

9 A bolygó neve… a végcél

10 Layout csere Miért? Mit? ItemsPanelTemplate <ListBox>
<ListBoxItem>Merkur</ListBoxItem> <ListBoxItem>Venus</ListBoxItem> <ListBoxItem>Föld</ListBoxItem> <ListBoxItem>Mars</ListBoxItem> </ListBox> <ListBox.ItemsPanel> <ItemsPanelTemplate> <StackPanel Orientation="Horizontal”/> </ItemsPanelTemplate> </ListBox.ItemsPanel>

11 Naprendszer ListBox el(ő)készítése

12 Amiről szó lesz… ELSŐ HARMADIK ÖTÖDIK MÁSODIK NEGYEDIK HATODIK

13 DataTemplate Data Template Adatobjektumhoz rendelt megjelenés
Bárhol felhasznáható Egy objektumhoz többféle sablon <DataTemplate> <Border...> <StackPanel Orientation="Horizontal"> <TextBlock VerticalAlignment="Center" Margin="5, 0"> <TextBlock Text="{Binding Path=Name}" TextBlock.FontWeight="Bold"/> <LineBreak/>Telefon : <TextBlock Text="{Binding Path=Phone}" TextBlock.FontStyle="Italic" /> <LineBreak/>Szobaszám : <TextBlock Text="{Binding Path=Room}" /> </TextBlock> <Image Source="{Binding Path=Picture}" Height="60" Margin="4" Name="img"></Image> </StackPanel> </Border> </DataTemplate>

14 DataTemplate készítése

15 Amiről szó lesz… ELSŐ HARMADIK ÖTÖDIK NEGYEDIK MÁSODIK HATODIK

16 Konverterek

17 Konverterek készítése

18 Amiről szó lesz… ELSŐ HARMADIK ÖTÖDIK MÁSODIK NEGYEDIK HATODIK

19 Saját layout vezérlő készítése
Ötlet Tulajdonságok meghatározása protected override Size MeasureOverride(Size availableSize) protected override Size ArrangeOverride(Size finalSize) Measure : szűlő megkérdezi a gyereket hogy Hé te mekkora akarsz lenni ha ennyi helyed van? protected override Size MeasureOverride(Size availableSize) { … // Ask each child how big it would like to be, given a certain amount space foreach (UIElement child in Children) child.Measure(new Size(…)); // The child’s answer is now in child.DesiredSize } // Tell my parent how big I would like to be given the passed-in availableSpace return new Size(…); child.Measure(new Size(Double.PositiveInfinity, Double.PositiveInfinity)); Arrange : Megmondom mennyit kaptál és hova kerülsz RECT protected override Size ArrangeOverride(Size finalSize) // Tell each child how much space it is getting child.Arrange(new Rect(…)); // The child’s size is now in child.ActualHeight & child.ActualWidth // Set my own actual size (ActualHeight & ActualWidth)

20 Measure Szülő megkérdezi a Gyerekeket mennyi helyet szeretnének a rendelkezésre állóból… protected override Size MeasureOverride(Size availableSize) { // Ask each child how big it would like to be, given a certain amount space foreach (UIElement child in Children) child.Measure(new Size(…)); // The child’s answer is now in child.DesiredSize } return new Size(…);

21 Arrange A Szülő megmondja a Gyerekeknek mennyi helyet és hol kapnak
protected override Size ArrangeOverride(Size finalSize) { // Tell each child how much space it is getting foreach (UIElement child in Children) child.Arrange(new Rect(…)); // The child’s size is now in child.ActualHeight & child.ActualWidth } // Set my own actual size (ActualHeight & ActualWidth) return new Size(…); protected override Size ArrangeOverride(Size finalSize) { … // Tell each child how much space it is getting foreach (UIElement child in Children) child.Arrange(new Rect(…)); // The child’s size is now in child.ActualHeight & child.ActualWidth } // Set my own actual size (ActualHeight & ActualWidth) return new Size(…);

22 Kártyaasztal készítése

23 Amiről szó lesz… ELSŐ HARMADIK ÖTÖDIK HATODIK MÁSODIK NEGYEDIK

24 Fícsör feszt

25 Amiről szó volt… ELSŐ HARMADIK ÖTÖDIK MÁSODIK NEGYEDIK HATODIK

26 Összefoglalás: Volt egy cél, hogy értük el…
útravalók:

27 További információk