2012/09/05

WP7 Hello Windows Phone7

最近想重新開始寫WP7,所以這次也順便來寫一篇筆記文吧
其實WP7出來應該有一陣子了,只是寫得人似乎也不是來的特別多吧
可能是因為之前Android大紅大紫,不過現在寫Android的人可能會發覺一些無法解決的問題




下方是xaml檔案,我們所看到的介面就是用這種標記語言所寫出來的
我們來看看幾個比較看到的屬性
x:Name:物件的名稱,不過像Button這個物件的名稱就是指定在Name而已
Margin:物件離容器有多遠的距離
Text:物件的文字,像Button的文字就要在Content設定
Height:物件高度
Width:物件寬度

<phone:PhoneApplicationPage 
    x:Class="WP1.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait" Orientation="Portrait"
    shell:SystemTray.IsVisible="True">

    <!--LayoutRoot 是放置所有頁面的根資料格-->
    <Grid x:Name="LayoutRoot" Background="Transparent">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <!--TitlePanel 包含應用程式的名稱和頁面標題-->
        <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
            <TextBlock x:Name="ApplicationTitle" Text="我的應用程式" Style="{StaticResource PhoneTextNormalStyle}"/>
            <TextBlock x:Name="PageTitle" Text="頁面名稱" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
        </StackPanel>

        <!--ContentPanel - 其他內容置於此-->
        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <Button Content="Button" Height="72" HorizontalAlignment="Left" Margin="131,116,0,0" Name="button1" VerticalAlignment="Top" Width="160" Click="button1_Click" />
        </Grid>
    </Grid>
 
    <!--顯示 ApplicationBar 使用方式的程式碼範例-->
    <!--<phone:PhoneApplicationPage.ApplicationBar>
        <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">
            <shell:ApplicationBarIconButton IconUri="/Images/appbar_button1.png" Text="按鈕 1"/>
            <shell:ApplicationBarIconButton IconUri="/Images/appbar_button2.png" Text="按鈕 2"/>
            <shell:ApplicationBar.MenuItems>
                <shell:ApplicationBarMenuItem Text="功能表項目 1"/>
                <shell:ApplicationBarMenuItem Text="功能表項目 2"/>
            </shell:ApplicationBar.MenuItems>
        </shell:ApplicationBar>
    </phone:PhoneApplicationPage.ApplicationBar>-->

</phone:PhoneApplicationPage>


畫面就像下面的圖案一樣


程式碼如下:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using Microsoft.Phone.Controls;

namespace WP1
{
    public partial class MainPage : PhoneApplicationPage
    {
        bool b = false;
        // 建構函式
        public MainPage()
        {
            InitializeComponent();
            PageTitle.FontSize = 40; //改變字型大小
            PageTitle.Foreground = new SolidColorBrush(Colors.Blue); //改變字體顏色
        }

        private void button1_Click(object sender, RoutedEventArgs e)
        {
            b = (b ^ true);
            if (b)
            {
                ApplicationTitle.Text = "Cheng You Feng的應用程式";
                PageTitle.Text = "Hello WP7.";
                button1.Content = "第一個";
            }
            else
            {
                PageTitle.Text = "歡迎來到我的部落格.";
                button1.Content = "第二個";
            }

        }
    }
}



按下按鈕第一次時,按鈕文字會改變成「第一個」、標題會改變成「Cheng You Feng的應用程式」以及文字方塊會變成「Hello WP7.」





按下第二次時,按鈕文字會改變成「第二個」以及文字方塊會變成「歡迎來到我的部落格」,不過標題文字不變