Windows Phone Tutorial 8: kohandatud nupu loomine Expression Blend-I-s

Windows Phone Tutorial 8: kohandatud nupu loomine Expression Blend-I-s
Windows Phone Tutorial 8: kohandatud nupu loomine Expression Blend-I-s

Video: Windows Phone Tutorial 8: kohandatud nupu loomine Expression Blend-I-s

Video: Windows Phone Tutorial 8: kohandatud nupu loomine Expression Blend-I-s
Video: CS50 2014 - Week 1, continued - YouTube 2024, Märts
Anonim

Pärast seda, kui olete õppinud, kuidas luua ja rakendada rakendust CTP tööriistade Silverlighti versioonis, lähevad selle Windows Phone tutoriali seeria osana edasi Expression Blend'i. Expression Blend on professionaalsete disainerite loomingutarkvara, et luua kasutajakogemusi, mis on suunatud. NET 3.0 + platvormile, täpsemalt WPF-ile või Windows Presentation Foundationile.

Üldiselt on Silverlighti juhtnuppudel oma visuaalse väljanägemise järgi eraldi loogika, kasutades malli. A. ControlTemplate täpsustab juhtseadme visuaalset struktuuri ja visuaalset käitumist. Saate kohandada enamiku kontrollide välimust, muutes nende vaikeväärtusi ControlTemplate seaded. See võimaldab teil muuta seadme välimust ilma selle funktsioone muutmata. Näiteks võite oma rakendustes olevaid nuppe teha pigem ringikujuliseks kui vaikevälja kujuliseks, kuid nupp suurendab veelgi Klõpsake sündmus

Selles juhendis avatakse Visual Studio'i projekt, mille olete loonud Expression Blend'i eelmises teostuses ja asendate ControlTemplate nupu abil oma välimust muuta. Kuna loote a ControlTemplate XAMLis saate muuta juhatuse välimust ilma koodi kirjutamata.

1. Avage Windows Phonei jaoks Microsoft Visual Studio 2010 Express
1. Avage Windows Phonei jaoks Microsoft Visual Studio 2010 Express

2. Kui te lõpetasite eelmise harjutuse etapid, võite jätkata selle ülesande jaoks loodud lahendust.

3. Avage Expression Blendi praegune lahendus. Selleks Visual Studioist tehke paremklõps MainPage.xaml Solution Exploreris ja valige käsk Ava ekspression segus. Kui see valik pole saadaval- kõige tõenäolisem põhjus on see, et Expression Blendi praegune versioon ei toeta vajaliku projekti tüüpi - järgige järgmisi samme, et luua ajutine projekt, mida saate muuta, kasutades Expression Blend

4. Avage Microsoft Expression Blend

5. Looge uus rakendusprojekt, et oma disainilahendusi ajutiselt hoida. Selleks avage Faili menüü ja vali siis Uus projekt

6. Aastal Uus projekt dialoogis valige Silverlight projekti tüüp ja seejärel valige Silverlight 3 rakendus malli Määra nimi nimeks DesignHelloPhone, valige sobiv asukoht ja hoidke keelt nii nagu Visual C #ja seejärel klõpsake Okei.

Image
Image

7. Visual Studiois topeltklõpsake App.xaml sisse Lahenduste Explorer selle faili avamiseks redaktoris. Nüüd avage XAML vaade ja valige ja kopeerige see kogu Taotlus.Ressursid lõikepuhvrisse

8. Avage Expression Blend uuesti, laiendage DesignHelloPhone projekt Projektid paneel ja topeltklõpsake App.xaml faili avamiseks

9. Pöörake tähelepanu Aktiivne dokumendivaade aastal Vaade menüü ja vali XAML vaade.

10. Leia Taotlus.Ressursid selle faili jaotises peaks see olema tühi ja seejärel asetada lõikepuhvri sisu.

11. Nüüd leiate uue sisestatud jaotise, mis on piiratud kommentaariga " ***** LISTBOX / LISTBOXITEMI TEMPLATES *****"; see sisaldab stiile, mis ei ühildu Silverlight 3 projektiga. Kustuta kogu osa algus- ja lõppsaldojate vahel.

Image
Image

12. Nüüd leiate Taotlus faili ülaosas olev element ja sisestage uus nimeruumide deklaratsioon, et viidata Süsteem nimeruum mscorlib kokkupanek, nagu allpool näidatud.

xmlns:system='clr-namespace:System;assembly=mscorlib' > # FF1F1F1F Must ?> var13 ->

13. Nüüd salvestage see muudetud App.xaml Expression Blendis.

14. Seejärel avage Visual Studio uuesti ja avage MainPage.xaml fail XAML vaates. Seejärel valige ja kopeerige see Võrk element nimega LayoutRoot sealhulgas tema lapsed lõikepuhvrisse.

15. Tagasi Expression Blendisse, ava MainPage.xaml faili XAML vaates ja seejärel kleepige lõikepuhvri sisu tühjaks LayoutRootVõrk element selles failis.

16. aastal MainPage.xaml faili, leidke juur UserControl element ja muutke väärtusi Kõrgus omistada 800 ja Laius omistada 480.

17. Tagasi Visual Studio juurde, paremklõpsake MainPage.xaml.cs sisse Lahenduste Explorer ja vali Vaata koodi. Seejärel kopeerige see ClickMeButton_Click sündmuse käitleja lõikepuhvrisse.

18. Lõpuks naaske Expression Blendi, laiendage MainPage.xaml sõlme Projektid paneel, topeltklõpsake nuppu MainPage.xaml.cs faili avamiseks redaktoris ja kleepige see kood lõikepuhvrisse MainPage klassis.

Nüüd oleme edukalt koondanud oma projekti ekspressioonideks. Kohandatud nupu kujunduse loomiseks lugege palun järgmist homme avaldatavat õpetust.

Soovitan: