windows presentation foundation (wpf)

Windows Presentation Foundation (WPF)

WPF 2D és 3D grafika Dokumentumok Média Teljesen vektorgrafika orientált

könnyen nagyítható (pl. felhasználói felület)

DirectX szükséges Lebegőpontos koordináták, logikai

Felület létrehozása, komponensek használata

Felület létrehozása

C# kódból

XAML – Visual Studio, Expression Blend, Jegyzettömb

Felület C# kódból6

Felület XAML kódból

eXtensible Application Markup Language Cél: design és kód különválasztása Profi alkalmazásoknál külön tervező Deklaratív alkalmazásfejlesztési modell

XAML Gyökérelemek

Window Page Application

Elem Egy osztály

Attribútum Egy tulajdonság a komponens

osztályában

Binary Application Markup Language Az XAML-ben leírt felület bináris

változata Fordításkor keletkezik az XAML-ből EXE-be beágyazva ~\obj\Debug\*.BAML Betöltés az InitializeComponent-

C# - ban

Hivatkozás a nyomógombra a kódban XAML-ben Name="btPróba"

attribútum Az eseménykezelőben

btPróba.Background = Brushes.Red; btPróba.Content = "Felirat";

Document Outline Tervezési nézetben a

felületet leíró dokumentumhierarchiát megtekinthetjük a Document Outline ablakban

Fa hierarchiák WPF-ben Logikai fa Vizuális fa

Logikai fa Leírja a szülő és a gyerek

objektumok közötti összefüggést Rácsban nyomógomb, amiben

rács, amiben kép és szöveg Fontos a tulajdonságok öröklése

szempontjából Navigálás: GetParent,

GetChildren, FindLogicalNode

Vizuális fa

Meghatározza, hogy egy objektum hogyan lesz megjelenítve a grafikus alapelemek felhasználásával (vonalak, négyszögek, stb.)

Fontos a transzformációk szempontjából

Application osztály

System.Windows.ApplicationTulajdonságok: Current – a futó alkalmazás objektum –

pl. alkalmazás szintű változók, leállítás MainWindow – a fő ablak Windows – az alkalmazást létrehozó

szálból létrehozott ablakok gyűjteménye

Application osztály

StartupUri – az alkalmazás indításakor automatikusan megnyitott ablak/lap

Properties – az alkalmazásból bárhonnan elérhető adatok tárolása

Application.Current.Properties["Név"]=Érték;Események: Startup Exit

Vezérlők Nem kell új (származtatott) vezérlőt

írni ahhoz, hogy egy vezérlő megjelenését megváltoztassuk (pl. ellipszis alakú nyomógomb)

Sablonokkal (Template) megoldva Csak akkor kell új vezérlőt írni, ha a

viselkedést akarjuk megváltoztatni

Core user input controls Button, RadioButton, ComboBox, CheckBox, Calendar, DatePicker, Expander, DataGrid, ListBox, ListView, Slider, ToggleButton, TreeView, ContextMenu, ScrollBar, Slider, TabControl, TextBlock, TextBox, RepeatButton, RichTextBox, Label

Window and controldecoration

Menu, ToolBar, StatusBar, ToolTip, ProgressBar

Media controls

Image, MediaElement, SoundPlayerAction

Tárolók (rétegmenedzserek) Grid – sorok és oszlopok alakíthatók ki UniformGrid – minden cella azonos

méretű StackPanel – vízszintesen vagy

függőlegesen elhelyezett elemek DockPanel – dokkolás támogatása Canvas – koordináta alapú tárolás WrapPanel – az elemek egyenes

vonalban helyezkednek el A tárolók egymásba ágyazhatóak

Grid és DockPanel

StackPanel Térköz nélkül helyezi el az

elemeket alapból

Canvas

Jobbra igazított menüpont a főmenüben

Menüpontok függőlegesen középre igazítása

<Menu x:Name="mnFőmenü" Height="30"> <Menu.ItemsPanel> <ItemsPanelTemplate> <DockPanel

HorizontalAlignment="Stretch"/> </ItemsPanelTemplate> </Menu.ItemsPanel> <MenuItem Header="Kever" x:Name="miKever" VerticalAlignment="Center" />

GridSplitter

</Grid.ColumnDefinitions> <TextBox Grid.Column="0" MinWidth="100"

Text="TextBox"/><GridSplitter Grid.Column="0" Width="5" /><TextBox Grid.Column="1" TextWrapping="Wrap" Text="TextBox" />

</Grid>

Eszköztár<ToolBar Height="34" DockPanel.Dock="Top" >

</ToolBar>

Visual Studio Image Library: https://www.microsoft.com/en-us/download/details.aspx?id=35825

Ikonok befordítása a szerelvénybe1

Solution Explorerben egy mappa az ikonoknak

Ikonok bemásolása a mappába

Ikonok befordítása a szerelvénybe2

Properties Build Action=Resource Copy to Output Directory=Do not

Build/Rebuild Solution

Képek tárolása szerelvényen kívül

Properties Build Action=Content Copy to Output Directory=Copy

always Build/Rebuild Solution

Többsoros szövegmező

Események és viselkedés

Viselkedés

A viselkedést a vezérlő API-ja határozza meg

Parancsok (Commands) – műveletek támogatása: Copy, Cut, Paste, stb.

Viselkedés vagy a kinézet módosítása tulajdonságokkal: font, háttérszín, stb.

Események Funkcionalitást megvalósító metódusok:

Eseménykezelés

Eseményekre fel lehet iratkozni: Design nézetből a Properties ablakban

Alapértelemezett eseményre feliratkozás duplán rákattintva a vezérlőre (pl.: Button-nél a click)

XAML-ből Pl: <Button x:Name="btBack" Content="Vissza" Click="btBack_Click"/>

Eseménytípusok Továbbított esemény (Routed Events)

Ha egy vezérlő több elemből épül fel (pl. egy nyomógomb, amin van egy kép és egy szöveg)

Attól függetlenül, hogy a képen, a szövegen vagy a nyomógombon kattintunk ugyanolyan értesítés akarunk kapni

Direkt esemény (Direct Event) – a WinForm-mal azonos módon működik, az eseményt csak az előidéző objektumban dolgozhatjuk fel

Továbbított esemény

Buborék esemény (Bubbling Event) – először az eseményt kiváltó vezérlő kapja meg, majd az őt tartalmazó rács, majd a nyomógomb, és így tovább felfelé a hierarchiában a gyökér csomópontig.

Lefutó esemény (Tunneling Event) – Preview-al kezdődik a neve, a gyökértől kiindulva halad lefele az esemény előidéző vezérlőhöz. Általában az események blokkolására használják: e.Handled=true;

Először a TE ()majd a BE () következik be

Commands Egy műveletet több módon is

előidézhetünk: menü, gyorsbillentyű, eszköztár

Kössük őket össze, hogy egyszerűen megoldható legyen a letiltás/engedélyezés → Commands objektumok

Beépített és programozó által definiált parancs osztályok

Beépített parancs osztályok

ApplicationCommands: pl. vágólap, mentés, megnyitás, új, lezárás, nyomtatás

ComponentCommands: vezérlőktől származó parancsok és információk feldolgozása: pl. ScrollUp

EditingCommands: szövegszerkesztési parancsok: pl. félkövér, dőlt, igazítás

MediaCommands: video és audio lejátszását előíró parancsok: pl. lejátszás, szünet, hangerő, sávválasztás

CommandBinding A CommandBinding osztály kapcsolja

össze a parancsot és az eseménykezelőt

Eseményei: CanExecute: e.CanExecute=true; Executed

Példa: 05_Szovegszerk

Vezérlők csatolása

Űrlapok, adatbevitel és ellenőrzés

Párbeszédablakok típusai Megjelenítés módja szerint

Modális ( ShowDialog() ) Nem modális ( Show() )

A megoldás módja szerint Beépített (üzenetablak, common dialog boxes) Saját készítésű (custom dialog box)

Az űrlap egy külön ablakban (párbeszédablak) jelenik meg Az űrlap az alkalmazás főablakában van elhelyezve, de

alapból rejtett

Beépített párbeszédablakok

Üzenetablak: MessageBox Common Dialog Boxes – Közös

párbeszédablakok (Microsoft.Win32) SaveFileDialog OpenFileDialog PrintDialog

Egyszerű üzenetablak

MessageBox.Show("Egyszerű üzenetablak");

Kétgombos üzenetablak

Háromgombos üzenetablak

OpenFileDialog

SaveFileDialog

PrintDialog

Dokumentumok nyomtatása

PrintDialog pd = new System.Windows.Controls.PrintDialog();pd.PageRangeSelection = PageRangeSelection.AllPages;pd.UserPageRangeEnabled = true;// Megjelenítjük az ablakotNullable<bool> result = pd.ShowDialog();//mire kattintottak if (result == true){ //nyomtatás} J.Zs.Cs.: Vizuális programozás (c) 2017

Általános lépések

Párbeszédablak objektum létrehozása Kezdeti megjelenést szabályozó

tulajdonságok beállítása Megjelenítés Ha OK-val zárta be a felhasználó, akkor

módosított tulajdonságok kiolvasása

Egyéni párbeszédablak (Custom Dialog Box) készítése

Szokásos ablakfelépítés Ne jelenjen meg a tálcán: ShowInTaskbar="False" Jelenjen meg a szülő ablak területén:

WindowStartupLocation="CenterOwner" Melyik vezérlő rendelkezzen kezdetben input fókusszal

(ablak Window tagben beállítva)?FocusManager.FocusedElement= "{Binding ElementName=tbElső}"

OK gomb IsDefault="True" Mégse gomb IsCancel="True" DialogResult tulajdonság true/false

Űrlap külön ablakban –Jelszóbeviteli párbeszédablak

Csatolás

Használat

55Párbeszédablak

osztálya

Főablak osztálya

Legyen más osztályból is olvasható

Párbeszédablak kezdeti beállítással

Menüpont (főablak XAML)<MenuItem x:Name="miÚj" Header="Új ..." Click="miÚj_Click"/>

Ablak objektum létrehozása és kezdeti beállítások (főablak C#):

var wnd= new wndÚjAdat { Owner= this,

Személy={ Név= "Valaki Eduárd", Átlag= 2}};wndÚjAdat.ShowDialog();

A pb. ablak osztályában van egy publikus Személy típusú

tulajdonság

Beállítások a párbeszédablak osztályában

Személy objektum létrehozása az ablak

létrehozásakor

Objektum rácshoz „kötése”

Komplex adatkötés

Input fókusz és névtérhivatkozás beállítása a megjelenő párbeszédablakban

Űrlap az alkalmazás főablakában<Window x:Class="Hallgatok.wndFőablak"xmlns=http://schemas.microsoft.com/winfx/2006/xaml/presentation

xmlns:x=http://schemas.microsoft.com/winfx/2006/xaml

xmlns:hallgatok="clr-namespace:Hallgatok„

Title="Hallgatói adatok" Height="350" Width="525">…<hallgatok:ucHallgatóAdatrögzítés x:Name="ucHallgatóAdatrögzítés"

Grid.Row="1" Visibility= " Collapsed" /><hallgatok:ucHallgatoAdatmodositas

x:Name="ucHallgatóAdatmódosítás" Visibility="Collapsed"

Megjelenítés - elrejtésprivate void miHallgatóAdatrögzítés_Click(object sender,

RoutedEventArgs e){ ucHallgatóAdatmódosítás.Visibility =

Visibility.Collapsed;ucHallgatóAdatrögzítés.Visibility = Visibility.Visible;

}private void miHallgatóMódosítás_Click(object sender,

RoutedEventArgs e){ ucHallgatóAdatrögzítés.Visibility = Visibility.Collapsed;

ucHallgatóAdatmódosítás.Visibility = Visibility.Visible;}

Adatátadás párbeszédablakoknak és UserControl-oknak

Hagyományos megoldások Konstruktornak átadott paraméter Értékadás egy tulajdonságnak (akár inicializáló

listában) Osztály létrehozása "Globális célra" és abban

statikus adattagban WPF újdonság

Az alkalmazáshoz kapcsolódó tulajdonság gyűjtemény:

Application.Current.Properties

Tulajdonság gyűjtemény

Adatok megjelenítése amikor a komponens (UserControl) láthatóvá válik

private void UserControl_IsVisibleChanged(object sender,

DependencyPropertyChangedEventArgs e){ if(!this.IsVisible) return;

dsHallgatók=Application.Current.Properties["dsHallgatók"] as dsHallgatók;

if (dsHallgatók.dtSzakok.Rows.Count > 1){ cbARSzak.ItemsSource =

dsHallgatók.dtSzakok;cbARSzak.DisplayMemberPath = "Szaknév";cbARSzak.SelectedIndex = 0;

Bevitt adatok ellenőrzése (Validation)

Miért? Biztonság Későbbi kivételek elkerülése Idejében jelezni a felhasználó felé Teljesítménynövelés (pl. többrétegű

alkalmazásokban a kliens és az alkalmazási rétegek közötti felesleges többszörös adatáramlás elkerülése)

Hogyan? Az ablak OK gombbal történő lezárásához

eseménykezelőt készítünk, és ott egyenként ellenőrizzük az egyes mezőkbe beírt adatokat. Hiba esetén hibaüzenet és az ablakot nem zárjuk be ha az ablakot már bezártuk, akkor újból

megjelenítjük azt (új objektum példány) user control esetén a uc-t nem rejtjük el.

Ún. validációs szabályok segítségével.

Validációs szabály Egy osztály ValidationRule leszármazottja Egy adatkötéshez rendeljük – egy objektum egy tagját kötjük a

vezérlő ellenőrizni kívánt tulajdonságához Minden vezérlőhöz szabály, egy vezérlőhöz akár több szabály is using System.Windows.Controls; Validate metódus átdefiniálása

Komponens ObjektumAdatkötés

Validációs szabály

Tulajdonság Tulajdonság

Validate metódus

Validációs szabály vezérlőhöz rendelése – XAML kódban

69 A rácshoz egy daforrás objektumot fogunk rendelni

futási időben

Validációs szabályok kiértékelése már gépelés

közben

Hibás adatbevitelnél piros keret a szövegmező körül

A validációs metódusban megadott hibaüzenet megjelenítése

Gyorstippben (buborék - ToolTip)

Egy erre célra beépített vezérlőben (pl. TextBlock)

Megvalósítás Definiálunk egy osztályt, ami megvalósítja az

IValueConverter interfészt – cél a hibaüzenetek egyetlen sztringbe foglalása

Statikus erőforrásként felvesszük a párbeszédablak XAML leírásába

A szövegmező ToolTip tulajdonságának vagy a kiegészítő vezérlő Text tulajdonságának értékét adatkötéssel a szövegmező hibagyűjteményéből vesszük

Az átalakító osztály gondoskodik a sztringgé alakításról

Átalakító osztály

using System.Windows.Controls; using System.Windows.Data;

Statikus erőforrás

<Window.Resources><local:HibaÁtalakító

x:Key="Átalakító" /></Window.Resources>

Hibaüzenet gyorstippben

Hibaüzenet TextBlock-ban

Az OK gomb kezelése

Egy csomópont alatti összes csomópont hibaállapotának ellenőrzése

windows presentation foundation (wpf)

Documents

windows presentation foundation - penn...

wpf integracija -...

windows presentation foundation wpf ػصܚآ ܖظضل ܒیا...

windows presentation foundation: the opportunity for wpf...

windows communication foundation & wpf

windows programming...

sams teach yourself wpf in 24 hours -...

windows presentation foundation (wpf) alapismeretek...wpf...

hardcore wpf (windows presentation foundation) casey chesnut...

professional wpf programming - cdn.ttgtmedia.com ·...

wpf, windows presentation foundation a platform for building...

windows presentation foundation - binary studio › media...

intro to wpf & wf (3.0 & 3.5) - download.microsoft.com ·...

windows presentation foundation...

the microsoft technical roadshow 2006 windows presentation...

4º fastshow - wpf windows presentation foundation overview

windows presentation foundation .net wpf€¦ · windows...

windows presentation foundation (wpf) chapter 16 dr. abraham

windows presentation foundation (wpf)

windows presentation foundation...