Osana meie Windows Phone tutorial seeriast, nüüd õpime looma UI elemendid HelloPhone taotlus. Taotlus on väga lihtne. Kui see on valmis, sisaldab rakenduse kasutajaliides pealdis, tekstikasti ja nupp.
Rakenduse kasutamiseks sisestate mõne teksti tekstikasti ja siis, kui klõpsate nupul, kuvab rakendus teie valitud tekstiga bänneri. See näeb välja nagu järgmine joonis.
1. In Lahenduste Explorer, topeltklõps MainPage.xaml selle faili avamiseks disaineril.
Disainer pakub XAML-failide redigeerimiseks kahte erinevat vaadet Disain ja XAML vaade Disainirežiimis on teil emulaatori disain, kus saate tööriistakastist juhtelemente lohistada ja valida, olemasolevate juhiste omaduste muutmiseks, muutmiseks, teisaldamiseks ja seadistamiseks. XAML-i režiimis on teil märgendiregister, mis võimaldab teil muuta lehe XAML-koodi. Võite töötada mõlema režiimiga. Teil on ka jagatud režiim koos redaktoriaknaga, mis näitavad korraga mõlemat vaadet.
2. Selle ülesande puhul keskendume peamiselt XAMLi käsitsi redigeerimisele. Kui kodeeriv osa on valmis, saate tulemuste nägemiseks tagasi projekteerija vaate juurde. Võite kasutada ka täisekraanvaate XAML-i vaadet.
3. Windows Phonei vaikimisi rakendusmalli abil loodud XAMLi märgistuses leidke Võrk konteineri element nimega LayoutRoot. Selle eesmärk on korraldada lehe elemente. Selle sees RowDefinition vara, sisestage täiendav rida kahe olemasoleva rida ja määrake selle väärtus Kõrgus vara Automaatne. See rida varsti sisaldab tekstiboksi ja nuppu.
4. Root Võrk element sisaldab ka mõnda lingitud elementi, mille igaüks on määratud välise võrgu teisele reale, määratledes a Grid.Row vara. Nüüd leidke nimega Grid element TitleGrid ja määrake sisemise võrgu sees oleva esimese teksti ploki elemendi teksti väärtus " Windows Phone 7 seeria ". Samamoodi Tere, telefon lisatakse järgmisele tekstiklile.
5. Nüüd leia Võrk element nimega ContentGrid määrake see reale 1, mis on algselt tühi ja kleepige selle elemendi sees järgmine XAML-märgistus.
6. Lehe disaini lõpuleviimiseks lisage kasutaja poolt sisestatud sõnumiga bänneri sisaldav kolmas rida. Selle rea loomiseks sisestage järgmine XAML-märgistus vahetult enne välimist võrgu lõppjärjestust.
7. Klõpsake nupul Disain Vaadake ja kontrollige lehe juhiste paigutust.
Meie järgmises õpetuses õpime kuidas "Kasutage kasutajaliidese toiminguid".
