Setelah mempelajari tentang cara membuat dan menyebarkan aplikasi dalam versi Silverlight alat CTP, sebagai bagian dari seri tutorial Windows Phone ini, kita beralih ke Expression Blend. Expression Blend adalah sistem authoring bagi desainer profesional untuk membangun pengalaman pengguna yang menargetkan platform.NET 3.0 +, dan lebih khusus lagi, WPF atau Windows Presentation Foundation.
Secara umum, kontrol Silverlight memiliki logika terpisah dari tampilan visual mereka menggunakan template. SEBUAH ControlTemplate menentukan struktur visual dan perilaku visual dari suatu kontrol. Anda dapat menyesuaikan tampilan sebagian besar kontrol dengan memodifikasi default-nya ControlTemplate pengaturan. Ini memungkinkan Anda untuk mengubah tampilan kontrol tanpa mengubah fungsinya. Misalnya, Anda dapat membuat tombol di aplikasi Anda berbentuk bulat daripada bentuk persegi default, tetapi tombol akan tetap menaikkan Klik peristiwa.
Dalam tutorial ini, Anda membuka proyek Visual Studio yang Anda buat dalam latihan sebelumnya dalam Expression Blend dan ganti ControlTemplate tombol untuk mengubah tampilan dan nuansa. Karena Anda membuat ControlTemplate di XAML, Anda dapat mengubah tampilan kontrol tanpa menulis kode apa pun.
2. Jika Anda menyelesaikan langkah-langkah dalam latihan sebelumnya, Anda dapat melanjutkan solusi yang Anda buat untuk latihan itu.
3. Buka solusi saat ini dalam Expression Blend. Untuk melakukan ini dari Visual Studio, klik kanan MainPage.xaml di Solution Explorer, lalu pilih Buka dalam Campuran Ekspresi. Jika opsi ini tidak tersedia- alasan yang paling mungkin adalah bahwa versi Expression Blend Anda saat ini tidak mendukung jenis proyek yang diperlukan - ikuti langkah selanjutnya untuk membuat proyek sementara yang dapat Anda edit menggunakan Campuran Ekspresi
4. Buka Campuran Microsoft Expression
5. Buat proyek aplikasi baru untuk menahan aset desain Anda sementara. Untuk melakukan ini, buka Mengajukan menu lalu pilih Proyek baru
6. Di dalam Proyek baru dialog, pilih Silverlight jenis proyek dan kemudian pilih Aplikasi Silverlight 3 template. Setel nama menjadi DesignHelloPhone, pilih lokasi yang sesuai, dan jaga bahasa sebagai Visual C #, lalu klik baik.
7. Dalam Visual Studio, klik dua kali App.xaml di Penjelajah solusi untuk membuka file ini di editor. Sekarang, buka tampilan XAML, lalu pilih dan salin keseluruhan Aplikasi. Sumber daya bagian ke clipboard
8. Buka Ekspresi Campuran lagi, perluas DesignHelloPhone proyek dalam Proyek panel, dan klik dua kali App.xaml untuk membuka file
9. Tunjuk ke Tampilan Dokumen Aktif dalam Melihat menu dan pilih XAML View.
10. Temukan Aplikasi. Sumber daya bagian dalam file ini - file harus kosong - lalu tempel konten papan klip untuk menggantikannya.
11. Sekarang, cari bagian dalam teks yang baru disisipkan yang dibatasi dengan komentar “ ***** LISTBOX / LISTBOXITEM TEMPLATES ***** ; ini berisi gaya yang tidak kompatibel dengan proyek Silverlight 3. Hapus seluruh bagian antara pembatas awal dan akhir.
12. Sekarang cari Aplikasi elemen di bagian atas file dan masukkan deklarasi namespace baru untuk referensi Sistem namespace dalam mscorlib perakitan, seperti yang ditunjukkan di bawah ini.
xmlns:system='clr-namespace:System;assembly=mscorlib' > # FF1F1F1F Hitam ?> var13 ->
13. Sekarang simpan yang diubah App.xaml dalam Campuran Ekspresi.
14. Selanjutnya, buka Visual Studio lagi dan buka MainPage.xaml file dalam tampilan XAML. Kemudian, pilih dan salin Kisi elemen bernama LayoutRoot termasuk anak-anaknya ke clipboard.
15. Kembali ke Expression Blend, buka MainPage.xaml file dalam tampilan XAML, lalu tempel konten clipboard untuk mengganti yang kosong LayoutRootKisi elemen dalam file ini.
16. Di dalam MainPage.xaml file, cari akarnya UserControl elemen dan mengubah nilai dari Tinggi atribut untuk 800 dan Lebar atribut untuk 480.
17. Kembali ke Visual Studio, klik kanan MainPage.xaml.cs di Penjelajah solusi dan pilih Lihat Kode. Kemudian, salin ClickMeButton_Click pengendali event ke clipboard.
18. Akhirnya, kembali ke Expression Blend, perluas MainPage.xaml node dalam Proyek panel, klik dua kali MainPage.xaml.cs untuk membuka file di editor, dan tempelkan kode di clipboard ke dalam Halaman Utama kelas.
Sekarang kami telah berhasil mereplikasi proyek kami menjadi perpaduan ekspresi. Untuk membuat desain untuk tombol khusus, silakan baca tutorial berikutnya yang akan dipublikasikan besok.
