Questo tutorial è una continuazione di Part-I, come parte dell'esercitazione di Windows Phone: copiando e incollando il codice da Visual solo Studio alla combinazione di espressioni, abbiamo creato una replica dell'app Silverlight in Expression Blend. Ora stiamo progettando un pulsante personalizzato seguendo i seguenti passaggi:
1. Confermare che il MainPage.xaml è aperto nella finestra del designer e l'area di lavoro corrente è impostata su Design. Per visualizzare l'area di lavoro corrente, selezionare Aree di lavoro nel Finestra menu e assicurarsi che il Design l'opzione è selezionata.
2. Nella finestra di progettazione, fare clic con il tasto destro del mouse su "Cliccami"Pulsante, punta a Modifica modello e selezionare Crea vuoto.
3. Nel Crea risorsa ControlTemplate dialogo, impostare il Nome aFancyButton, mantieni il valore corrente di " Questo documento" nel Definisci dentro opzione e fare clic ok.
4. Assicurati che il pannello Oggetti e Timeline sia visibile, altrimenti seleziona Finestra e poi Oggetti e cronologia per mostrare questo pannello. Altrimenti puoi resettare il tuo spazio di lavoro.
5. Modificare il contenitore del layout radice corrente del modello. Nel Oggetti e cronologia pannello, fare clic con il tasto destro del mouse sul bambino Griglia elemento dentro Modello, indicare Cambia tipo di layout, e selezionare Confine.
6. Con il Confine elemento ancora selezionato nel Oggetti e cronologia pannello, passare a Proprietà pannello e sotto Aspetto, imposta il valore di BorderThickness proprietà a2 per ciascuno dei lati e quindi impostare il valore del Raggio dell'angolo proprietà a15.
7. Avanti, nel Spazzole sezione, selezionare il sfondo proprietà e scegliere il Pennello sfumato opzione. Quindi, seleziona il gradiente di graduazione a sinistra e imposta il suo valore su un colore grigio chiaro, ad esempio#FFADADAD. Quindi, seleziona il giusto arresto del gradiente e imposta il suo valore su un colore grigio scuro, ad esempio# FF0A0A0A.
8. Ora, nel Spazzole sezione, selezionare il BorderBrush proprietà, scegliere a Pennello in tinta unita e scegli un colore grigio chiaro, per esempio# FFC0C0C0.
9. Il prossimo passo è aggiungere una didascalia. Innanzitutto, assicurati che il Confine elemento rimane selezionato nel Oggetti e cronologia pannello.
10. Ora, passa al Risorse pannello, selezionare il controlli categoria, e scorrere verso il basso l'elenco visualizzato a destra della categoria per individuare il TextBlock controllo. Quindi, fare doppio clic sull'elemento nell'elenco per inserire un'istanza di questo controllo nidificato all'interno di Confine elemento del modello.
11. Ora, nel Utensili pannello, scegli il Selezione strumento o stampa V per ripristinare la modalità di selezione.
12. Nel Oggetti e cronologia pannello, selezionare il nuovo aggiunto TextBlock elemento. Quindi, nel Proprietà pannello, espandere il Spazzole categoria e impostare il Primo piano pennello per un colore chiaro, per esempio#FFFFFFFF.
13. Ora, espandi il disposizione categoria e impostare il valore del Allineamento orizzontale e Allineamento verticale proprietà aCentro. Quindi, imposta il valore di Margine proprietà a10 per i lati sinistro e destro, e per4 per i lati superiore e inferiore.
14. Collega il Testo proprietà del Casella di testo controllo nel modello al Soddisfare proprietà del controllo basato sui pulsanti. Per fare questo:
- Espandi il Proprietà comuni categoria
- Clic Opzioni immobiliari avanzate-indicato da un'icona quadrata accanto al valore della proprietà
- Selezionare Template Binding per visualizzare un elenco di proprietà nel controllo basato sui modelli che può essere associato a questa proprietà
- Scegli il Soddisfare proprietà da questa lista. Noti che il valore di Testo modifiche di proprietà a "Cliccami"- il valore attualmente impostato per Soddisfare proprietà del pulsante e che ora la proprietà viene mostrata con un contorno giallo per indicare che è associata al modello.
15. Premere CTRL + S per salvare il file aggiornato.
16. Ora sei pronto per testare il nuovo pulsante personalizzato. stampa F5 per creare ed eseguire l'applicazione
Articoli correlati:
- Collegamenti offline di Windows Live Essentials per tutte le lingue
- Elenco completo delle scorciatoie da tastiera di Windows Live Writer
- Modello di stile Metro di Windows gratuito per utenti di Visual Basic
- Windows Phone Tutorial 11: Creazione di un'animazione per il testo del banner
- Prova il sistema operativo Windows in VirtualBox - Guida dettagliata agli screenshot
