Továbbított események További ablakok készítése Programozás III. Továbbított események További ablakok készítése

Továbbított események (Routed Events) Problémafelvetés: Tudjuk, hogy a WPF ablakokban sok felhasználóifelület-elem lehet – gombok, textboxok, egyebek Szeretnénk tudomást szerezni róla, ha a felhasználó bárhol a felhasználói felületen mozgatja az egeret! „Hagyományosan” csak egy megoldást tudunk: az összes felhasználóifelület-elem MouseMove-ját kezelni kell… Tudjuk, hogy a ContentControl-okban több elem is lehet Pl: Button, benne StackPanel és két Rectangle = pause gomb Mire kattintott a felhasználó? Akár a Button „látszó” részeire, akár a StackPanelre vagy a téglalapokra kattintott, nekünk a végén Click esemény kell! Sok esetben jó lenne, ha adott eseményekről nemcsak az adott elem, hanem a tartalmazói is tudomást szereznének Igazából a gombok akkor is több elemből állnak, ha nem rakunk beléjük semmit. Ezt meg lehet mutatni a vizuális fán.

Továbbított események (Routed Events) A WPF felhasználóifelület-elemek eseményei ún. továbbított események Nem csak azon az elemen váltódik ki az esemény, amelyiken tényleg megtörtént Az elem szülőiben is kiváltódik (kiváltódhat)  elképzelhető, hogy valamelyik szülő elem kezeli Az egymásba helyezett felhasználóifelület-elemek által alkotott faszerkezetet elemfának nevezzük ContentControl, ItemsControl elemeknél: Content, Items miatt Tartalommenedzserekben (Children) Felhasználóifelület-elemek belső szerkezete is bonyolult lehet! Nemcsak egyféle elemfát értelmezünk: logikai fa, vizuális fa

Felhasználóifelület-elemek fája Az elemek logikai fája (logical tree) mutatja a felhasználói felület elemeinek kapcsolatait Az elemek vizuális fája (visual tree) az egyes elemek belső struktúráját is tartalmazza, a logikai fánál bővebb fogalom Logikai fa: document outline-ban. Vizuális fa: breakpointtal beleállsz bárhova, watchből elérsz egy grafikusfelület-elemet, a nagyító ikonnal előszedheted a visualizert, ez a vizuális fát mutatja.

Felhasználóifelület-elemek fája MainWindow Border AdornerDecorator Logikai fa Pirossal Document Outline-ban ezt látjuk Vizuális fa Piros+cián Debugolás közben megjeleníthető AdornerLayer ContentPresenter Grid Label Button Border Border ContentPresenter ContentPresenter TextBlock TextBlock

Továbbított események A továbbított események az elemfán közlekednek Logikai fán: dinamikus erőforrások, adatkötéskor elemnevek keresése… Vizuális fán: elemek kirajzolása, átlátszóság, transzformációk, IsEnabled, találattesztelés Hibrid: dependency propertyk, továbbított események Továbbítási stratégiák: Felfelé közlekedő („bubbling”) továbbított esemény: először a kiváltó felhasználóifelület-elemen, utána pedig sorra a szülőkön, a gyökérig. Lefelé közlekedő („tunneling”) továbbított esemény: először a gyökéren, majd a kiváltó elem felé vezető szülőkön, legvégül a kiváltó elemen hívódnak meg az eseménykezelők „Direct” továbbított esemény: csak a kiváltó elemen hívódnak meg az eseménykezelők. A dokumentációban (MSDN) minden eseménynél megtalálható, hogy milyen továbbítási stratégiát alkalmaz A továbbított eseményeknél ha minden igaz, kb úgy van, hogy a bubbling események a vizuális fán mennek felfelé, amíg meg nem találják az első logikai elemet. Utána a logikai fán mennek felfelé. Lefelé talán csak a logikai fán mennek.

Preview események Bizonyos események, pl.: KeyDown KeyUp MouseDown MouseUp … … rendelkeznek egy Preview… nevű párral PreviewKeyDown PreviewKeyUp PreviewMouseDown PreviewMouseUp

Továbbított események A PreviewXXX-XXX eseménypárok közül: A PreviewXXX „tunneling” stratégiát alkalmaz Az XXX „bubbling” stratégiát alkalmaz A Preview mindig előbb következik be PreviewMouseDown, MouseDown példa PreviewMouseDown a MainWindow-n. PreviewMouseDown a Griden. PreviewMouseDown a Labelen. MouseDown a Labelen. MouseDown a Griden. MouseDown a MainWindow-n. MainWindow Grid Label Button Vannak működési variációk: pl. a Grid a Labelre való kattintáskor mindig érintett, de ha rajta kattintunk, a MouseDown csak akkor váltódik ki rajta, ha látható (pl. Background nem null). Ha nem így van, akkor a Griden nem, csak a MainWindow-n váltódik ki az esemény - Ezért nehéz a WPF, mert egy rakás ilyen apró kis működési mechanizmust meg kell tanulni. Szinte mindennek vannak ilyen kicsi működési trükkjei Vannak működési variációk: pl. a Grid a Labelre való kattintáskor mindig érintett, de ha rajta kattintunk, a MouseDown csak akkor váltódik ki rajta, ha látható (pl. Background nem null). Ha nem így van, akkor a Griden nem, csak a MainWindow-n váltódik ki az esemény!

Preview események A Preview… pár az adott esemény „tényleges” megtörténte előtt fut le Használati módjai: Eseményt megelőző tevékenységek elvégzése „Tényleges” esemény blokkolása (e.Handled) Léteznek kivételek a Preview→tényleges sorrend alól, pl: Button eseményei A Button „feladata” egy Click esemény létrehozása, a PreviewMouseDown-t és …Up-ot konvertálja Click eseménnyé és blokkolja a további események egy részét (= nem fog lefutni a PreviewMouseDown után a MouseDown pár) private void textBoxText_PreviewKeyDown(object sender, KeyEventArgs e) { e.Handled = true; //eredmény: nem lehet gépelni a textboxba }

Továbbított események Ha tudni kell, hogy honnan jött az esemény… sender: az az elem, amelyik éppen kezeli az eseményt. NEM a kiváltó elem! e.Source: az esemény kiváltója (logikai fán) e.OriginalSource: az esemény tényleges kiváltója (vizuális fán) Gyakorlati használat: Felhasználóifelület-elemek egymásba építése esetén a felhasználó felé egy elemnek kell tűnnie A „fő” tartalmazó kezeli az eseményeket Események lefutásának megakadályozása Akár az adott elem, akár a tartalmazók közül valamelyik kezelheti a PreviewXXX-t, és állíthatja az e.Handled-et Több felhasználóifelület-elem ugyanazt a tevékenységet végzi A közös tartalmazójuk kezelheti az eseményeket Pl. számológép! Számológép példánál a korrekt wpf-es megoldás az lenne, ha a buttonok közös tartalmazója – pl egy Panel utód – kezelné a buttonok clickjét. Ezt csak XAML-ban tudjuk megoldani!!!, mert egyik Panelnek sincs Clickje!!!, DE a MouseDown-nal már most is meg tudnánk oldani! A logikai fa-vizuális fa kavarás: http://www.informit.com/articles/article.aspx?p=689111&seqNum=3

Feladat – Egyszerűsített Android jelszómegadó A kép eredetije: http://www.groovypost.com/howto/security/how-to-enable-pattern-lock-security-on-android-devices/

További ablakok készítése Az ablakokat kétféle módon használhatjuk: Modális megjelenítés: amíg a felhasználó a modális ablakot be nem zárja, nem aktiválhat más ablakot Figyelmeztetés megjelenítése Hibaüzenetek közlése Megerősítések kérése Adatok bekérése Nem modális megjelenítés: más ablakokkal párhuzamosan használható Lehetőségek: MessageBox osztály előre elkészített dialógusablakai (csak modális) Microsoft.Win32 névtér dialógusablakai (csak modális) Saját készítésű ablakok Megmutathatod a powerpointon: ctrl+F nem modális, mentés ablak modális.

MessageBox osztály Funkció: olyan üzenetablak megjelenítése, amely tartalmazhat üzenetet, gombokat és ikonokat Nem hozunk létre példányt, hanem az osztály statikus Show tagfüggvényét hívjuk A függvény paraméterei határozzák meg, hogy milyen szöveg, gomb és ikon jelenik meg A visszatérési értéke a MessageBoxResult felsorolás egy eleme, és a bezárás módjáról ad információt Használata: MessageBox.Show("Egysoros üzenet"); MessageBox.Show("Többsoros\nüzenet\nfejléccel", "Üzenet fejléccel");

MessageBox paraméterek I. Megjelenítendő gombok: A megjelenítendő gombokat a MessageBoxButton felsorolás egy elemével határozzuk meg: A Show visszatérési értéke többnyire a megnyomott gomb nevével egyező nevű MessageBoxResult felsoroláselem: MessageBoxResult.OK, MessageBoxResult.Cancel, MessageBoxResult.Yes… A piros X gombbal való bezárás többnyire MessageBoxResult.Cancel, kivéve, ha a MessageBox csak OK értéket tud visszaadni (csak ilyen gombot tartalmaz), mert akkor ez is OK-nak számít. MessageBox.Show("Többsoros\nüzenet\nfejléccel", "Fejléc", MessageBoxButton.YesNoCancel); Felsorolás eleme Leírás OK A dialógus OK gombot tartalmaz OKCancel A dialógus OK és Cancel gombokat tartalaz YesNo A dialógus Yes és No gombokat tartalmaz (a kötelező választás érdekében letiltja a piros X-et!) YesNoCancel A dialógus Yes, No és Cancel gombokat tartalmaz

MessageBox paraméterek II. Megjelenítendő ikon: A megjeleníthető ikon a MessageBoxImage felsorolás egy eleme: MessageBox.Show("Többsoros\nüzenet\nfejléccel", "Fejléc", MessageBoxButton.YesNoCancel, MessageBoxImage.Error); A beállított ikonnak megfelelő hangot lehet hallani közben különben.

Microsoft.Win32 névtér dialógusablakai OpenFileDialog: fájl megnyitásához SaveFileDialog: fájl mentéséhez A ShowDialog() visszatérési értéke: bool? típusú (nullable bool) true: a felhasználó elvégezte az interakciót (a dialógusablakban megadott információ felhasználható) false: „mégsem” jellegű kilépés (a dialógusablakban megadott információ nem felhasználható) null: az ablak még nem záródott be MINDIG ellenőrizni kell! OpenFileDialog openFileDialog = new OpenFileDialog(); if (openFileDialog.ShowDialog() == true) { string kivalasztottFajl = openFileDialog.FileName; //... fájl megnyitása, kezelése... }

Feladat

Feladat – előző kiegészítése A TextBox TextChanged eseménye szükséges hozzá.

Saját ablakok készítése Saját ablakok használata: .xaml + .xaml.cs fájlok létrehozása: Project -> Add -> Window... Helyezzük el rajta a vezérlőket, állítsuk be a tulajdonságokat, készítsük el a működést Hozzuk létre a példányt, jelenítsük meg a hívó ablakból modálisan/nem modálisan Megjelenítés window.Show();  megjelenít nem modálisan window.ShowDialog();  megjelenít modálisan, bool? visszatérési értéke jelzi, hogy milyen módon zártuk be az ablakot MyWindow window = new MyWindow(); window.Show(); Show: a kód azonnal fut tovább ShowDialog: blokkol MyWindow window = new MyWindow(); if (window.ShowDialog() == true) { //... }

Saját ablakok készítése Ha a saját ablak bezárásának módjáról információt akarunk adni a ShowDialog() függvény visszatérési értékeként: this.DialogResult Ez be is zárja az ablakot Button példányok kapcsolódó tulajdonságai: IsCancel – ESC gomb lenyomására ez a gomb fog megnyomódni, és bezárja az ablakot (általában a Cancel) IsDefault – Enter gomb lenyomására ez a gomb fog megnyomódni (általában az OK) Nem zárja be az ablakot Általában az eseménykezelőben viszont DialogResult-ot állítunk private void Button_Click(object sender, RoutedEventArgs e) { this.DialogResult = true; }

Saját ablakok készítése Saját tervezésű modális ablakokban bekért értékeket tulajdonságokon keresztül szokás visszaadni Minden értékhez készítsünk egy-egy tulajdonságot x:Name="myTextBox" x:FieldModifier="private" A párbeszédablakot aktivizáló ablakban előbb a visszatérési értéket vizsgáljuk meg, majd ennek megfelelően használjuk a tulajdonságokat string nev; string szuletesiHely; int eletkor; SzemelyesAdatWindow adatBekero = new SzemelyesAdatWindow(); if (adatBekero.ShowDialog() == true) { nev = adatBekero.Nev; szuletesiHely = adatBekero.SzuletesiHely; eletkor = adatBekero.Eletkor; }

Ablakok tulajdonságai, metódusai, eseményei A Window ContentControl utód A ContentControl összes tulajdonságát és eseményét lehet használni (Width, Height, Foreground, Background… MouseDown, MouseUp, KeyDown, KeyUp, PreviewXXX… Loaded…) Főbb tulajdonságok: Title (címsor szövege) Topmost (felül marad) WindowStartupLocation (hova jelenjen meg) WindowState (állapot – maximalizált, minimalizált, normál)

Ablakok tulajdonságai, metódusai, eseményei Főbb metódusok: Show() – megjelenítés nem modálisan ShowDialog() – megjelenítés modálisan Close() – bezárás Activate() – előtérbe hozás és aktiválás Hide() – láthatatlanná tétel Főbb események: Closed – bezáródott Closing – bezáródna A Closed előtt történik. Ablak becsukása előtt végrehajtandó eseményekhez használjuk, pl. mentés Activated – aktiválódott Deactivated – deaktiválódott

Feladat