星期日, 1月 01, 2012

[Expression Blend ] Silverlight - 畫面置中

PPT.cc縮圖服務

今天KT要來介紹一下,
如何使用 「Expression Blend」,讓 Silverlight 的設計畫面,置中呈現。





這是一般沒有設定置中的畫面:
(初始預設效果是靠左上)


PPT.cc縮圖服務





設定置中的畫面效果,如今天預期目標效果:


  • 預期效果:
PPT.cc縮圖服務





  • 詳細步驟:
1.開啟Expression Blend 
PPT.cc縮圖服務

2.檔案>新增專案
PPT.cc縮圖服務



3.選擇 「Silverlight應用程式+網站」,然後設定專案名稱與路徑,點選確定後開始使用。
(KT這邊將專案名稱取為:Center_Demo,
然後設定專案存放路徑放到Silverlight Demo的夾夾裡面)

PPT.cc縮圖服務


4.在左上角專案頁面,裡面有一個MainPage.xaml
( 可以把 MainPage.xaml 想像成是一張空白的圖畫紙,
我們可以在上面盡情揮灑無限的創意)
PPT.cc縮圖服務

5.點選左下的「LayoutRoot」後,
PPT.cc縮圖服務

然後到右邊的「版面配置」裡去調整圖畫紙(版面)的大小,
KT這邊設定為大小手動640*480、垂直水平對齊置中
PPT.cc縮圖服務







6.點選左邊面板的裡UserControl,
PPT.cc縮圖服務


再到右邊的版面配置視窗中,設定寬高自動填滿,
PPT.cc縮圖服務




7.但是如果這樣,就按快速鍵F5快速執行,
全白畫面 ><""",會感受不到效果,
所以我們在畫面上設計一些花樣,
加些文字、圖片、順便換一下背景顏色如:


PPT.cc縮圖服務




8.「專案」=>「執行專案」(也可以使用 F5 快速鍵執行)
PPT.cc縮圖服務

執行結果:
PPT.cc縮圖服務


  • 影片教學:

[Expression Blend ] Silverlight - 畫面置中 (KT 國語,繁體中文教學版)





    範例原始碼下載:



    0 意見 :

    張貼留言

    回覆意見時,麻煩輸入一下暱稱
    (隨便取個名字也好~ ^_^)
    好讓我方便回覆您的問題,
    選擇「名稱/網址」輸入您的暱稱,
    麻煩一下,謝謝大家。

    關閉廣告 [X]