WebElektronika
WPF-es alkalmazás készítése
A .NET 3.0 keretkörnyezetben jelent meg a WPF (Windows Presentation Foundation). Segítségével modern megjelenést tudunk készíteni az alkalmazásainknak, elhagyhatjuk a GDI-t.
Nem fogjuk részletesen tárgyalni a WPF felépítését, újdonságait, hiszen ezek megtalálhatók az interneten, ezért inkább kisebb példákat, érdekességeket fogunk bemutatni a cikkeinkben.
Szakítsunk most a Windows Form-os megjelenítéssel, készítsünk el egy WPF-es alkalmazást, de olyat, amely még véletlenül sem hasonlít a Form-os megjelenésre.
Indítsuk el a Visual Studio 2012-t, majd a File / New project menüpont után válasszuk ki a WPF alkalmazást. A projekt neve legyen "WpfMegjelenes1".
Válasszunk ki az interneten egy háttérnélküli képet és másoljuk be a projektünk "Kepek" mappájába (1. ábra).
1. ábra A projektünk felépítése
Indítsuk el az alkalmazásunkat az F5 megnyomásával. Ekkor egy egyszerű, üres form-ot látunk (2. ábra).
2. ábra Futási eredmény
Cseréljük le most ezt a megjelenést, legyen az a háttérnélküli kép a form-unk helyett, amely már a projektünk "Kepek" mappájában van.
Először egészítsük ki a MainWindow.xaml file tartalmát a következő ábra segítségével. A kijelölt sorokat írjuk be a MainWindow.xaml file-ba.
3. ábra A kiegészített MainWindow.xaml file
Ezekkel a sorokkal engedélyeztük a transparens megjelenítést és az alkalmazásunk a képernyő közepén fog megjelenni, amikor elindítjuk.
Igen ám, de mivel az átláthatóságot engedélyeztük, hiába indítjuk el debug módban az alkalmazásunkat, nem fogjuk látni a desktop-on. Tegyük láthatóvá úgy, hogy vigyünk fel a felületünkre egy képet (Image) és egy nyomógombot (Button). Ha rátesszük a felületünkre a design nézetre, akkor a következő xaml kódot kapjuk (4. ábra).
4. ábra Ismét módosítottuk a MainWindow.xaml file tartalmát
Ekkor a design nézetben a következő megjelenés látható (5. ábra)
5. ábra Design nézete az xaml file-nak
Ha most futtatjuk debug módban az alkalmazásunkat, akkor megjelenik már a kép a nyomógombbal, de nem tudjuk mozgatni az egérrel, illetve a nyomógombra is hiába kattintunk.
Egészítsük tehát ki az xaml kódunkat, vegyünk fel eseményeket az xaml kódunkban (6. ábra)! Szeretnénk a képet a bal egérgomb lenyomásával mozgatni, illetve azt is meg fogjuk valósítani, hogy amikor rákattintunk a nyomógombra, akkor kilépjünk az alkalmazásunkból.
6. ábra Események a MainWindow.xaml file-ban
Az adott eseményekhez tartozó kódok a 7. ábrán láthatók. Írjuk be ezeket a MainWindow.xaml.cs file-ba.
7. ábra A kiegészített MainWindow.xaml.cs file
Indítsuk el újra az alkalmazásunkat debug módban. Megjelenik a képünk a nyomógombbal (8. ábra), és az alkamazásunk az egérrel mozgatható, illetve a nyomógomb megnyomásával bezárjuk az alkalmazásunk működését.
8. ábra Az alkalmazás futási eredménye