Miután megtudta, hogyan hozhat létre és telepíthet alkalmazást a CTP-eszközök Silverlight verziójában, a Windows Phone bemutatósorozat részeként továbblépünk az Expression Blend-re. Az Expression Blend egy professzionális tervezői számára készült szerzői rendszer, amely a.NET 3.0 + platformot, pontosabban a WPF vagy a Windows Presentation Foundation programot célzó felhasználói élményeket hoz létre.
Általánosságban elmondható, hogy a Silverlight-vezérlők külön logikával rendelkeznek vizuális megjelenésükből sablonok segítségével. A ControlTemplate meghatározza a vezérlés vizuális szerkezetét és vizuális viselkedését. A legtöbb vezérlő megjelenését testreszabhatja az alapértelmezett módosításával ControlTemplate beállítások. Ezzel megváltoztathatja a vezérlő megjelenését a funkciók megváltoztatása nélkül. Például az alkalmazásban lévő gombokat az alapértelmezett négyzet alak helyett kerekítheti, de a gomb továbbra is felemeli Kattints esemény.
Ebben a bemutatóban megnyitjuk az Expression Blend előző gyakorlatában létrehozott Visual Studio projektet, és kicseréljük azt ControlTemplate a gomb megnyomásával megváltoztathatja a megjelenését. Mert létrehoz egy ControlTemplate az XAML-ben a vezérlő megjelenését bármiféle kód írása nélkül módosíthatja.
2. Ha befejezte az eddigi lépések lépéseit, továbbra is folytathatja az adott gyakorlathoz létrehozott megoldást.
3. Nyissa meg az Expression Blend jelenlegi megoldását. Ehhez a Visual Studio programból kattintson a jobb gombbal MainPage.xaml a Megoldás Explorerben, majd válassza az Open in Expression Blend lehetőséget. Ha ez az opció nem érhető el- a legvalószínűbb oka az, hogy a Expression Blend jelenlegi verziója nem támogatja a szükséges projekttípust - kövesse a következő lépéseket egy ideiglenes projekt létrehozásához, amelyet szerkeszthet a Expression Blend segítségével
4. Nyissa meg a Microsoft Expression Blend alkalmazást
5. Hozzon létre egy új alkalmazási projektet, amely ideiglenesen megőrzi a tervezési eszközeit. Ehhez nyissa meg a fájl majd válassza ki Új projekt
6. A Új projekt párbeszédablakban válassza ki a Silverlight projekt típusát, majd válassza ki a Silverlight 3 alkalmazás sablon. Állítsa be a nevet DesignHelloPhone, válasszon megfelelő helyet, és tartsa a nyelvet Visual C #, majd kattintson az OK gombra rendben.
7. A Visual Studio programban kattintson duplán App.xaml ban ben Megoldás kereső hogy megnyissa ezt a fájlt a szerkesztőben. Most nyissa meg a XAML nézetet, majd válassza ki és másolja át a teljes képet Application.Resources a vágólapra
8. Nyissa meg újra az Expression Blend kifejezést, bontsa ki a DesignHelloPhone projekt a projektek és kattintson duplán App.xaml megnyitni a fájlt
9. Mutasson a Aktív dokumentum nézet ban,-ben Kilátás menüben és válasszuk ki XAML nézet.
10. Keresse meg a Application.Resources ebben a fájlban - üresnek kell lennie -, majd illessze be a vágólap tartalmát annak helyére.
11. Most keresse meg az újonnan beillesztett szöveget, amelyet a ***** LISTBOX / LISTBOXITEM TEMPLATES ***** „ olyan stílusokat tartalmaz, amelyek nem kompatibilisek a Silverlight 3 projekttel. Törölje a teljes részt a kezdő és a véghatárolók között.
12. Most keresse meg a Alkalmazás elemet a fájl tetején, és helyezzen be egy új névtér nyilatkozatot a hivatkozásra Rendszer névtér a mscorlib összeszerelést, az alábbiak szerint.
xmlns:system='clr-namespace:System;assembly=mscorlib' > # FF1F1F1F Fekete ?> var13 ->
13. Most mentse el a megváltozott App.xaml a Expression Blend-ben.
14. Ezután nyissa meg ismét a Visual Studio programot, és nyissa meg a MainPage.xaml fájlt XAML nézetben. Ezután válassza ki és másolja a Rács elem neve LayoutRoot beleértve a gyerekeket a vágólapra.
15. Visszatérés a Expression Blend-hez, nyissa meg a MainPage.xaml fájlt XAML nézetben, majd illessze be a vágólap tartalmát az üres helyére LayoutRootRács elem ebben a fájlban.
16. A MainPage.xaml fájl, keresse meg a gyökeret UserControl elemet és módosítsa a Magasság tulajdonít neki 800 és a Szélesség tulajdonít neki 480.
17. Menjen vissza a Visual Studio programba, kattintson a jobb gombbal MainPage.xaml.cs ban ben Megoldás kereső és válasszuk ki Kód megtekintése. Ezután másolja a ClickMeButton_Click eseménykezelőt a vágólapra.
18. Végül térj vissza az Expression Blend-hez, bontsd ki a MainPage.xaml csomópont a projektek kattintson duplán a MainPage.xaml.cs hogy megnyissa a fájlt a szerkesztőben, és illessze be a kódot a vágólapba a Főoldal osztály.
Most sikeresen reprodukáltuk projektünket kifejezésmódra. Ha szeretne létrehozni egy tervet az egyedi gombra, kérjük, olvassa el a következő útmutatót, amelyet holnap közzé kell tenni.
