win8的第一个应用

赶上有个microsoft的应用提交比赛,迅速的学习了一下win8 app的开发,原来对wp7和sl没有什么了解，现学现卖了哈~

学习过程中，除了microsoft的培训之外，主要还是系统的学习了传智播客.net培训Windows 8开发视频教程",讲的深入浅出,看着不累,适合初学者

记录一下我做这个简单地不能再简单的应用的过程吧~

target:简单的实现了,文字连连看

step1.首先写配置界面,可以自己定义创建Grid的行列数,以及用于连连看中配对的文字

<Grid Name="llkConfig" Background="{StaticResource ApplicationPageBackgroundThemeBrush}">    <TextBox x:Name="txtRow" HorizontalAlignment="Left" Margin="508,391,0,0" TextWrapping="Wrap" Text="10" VerticalAlignment="Top"/>    <TextBox x:Name="txtCol" HorizontalAlignment="Left" Margin="720,391,0,0" TextWrapping="Wrap" Text="10" VerticalAlignment="Top"/>    <TextBox x:Name="txtText" HorizontalAlignment="Left" Margin="508,458,0,0" TextWrapping="Wrap" Text="传智播客培训开发视频教程" VerticalAlignment="Top" Width="276"/>    <Button x:Name="btnRun" Style="{StaticResource AppNextAppBarButtonStyle}" HorizontalAlignment="Left" Margin="840,391,0,0" VerticalAlignment="Top" Height="99" Width="130"  Click="btnRun_Click"/>    <TextBlock x:Name="lblRow" HorizontalAlignment="Left" Margin="402,391,0,0" TextWrapping="Wrap" Text="行数：" VerticalAlignment="Top" Width="101" FontSize="30"/>    <TextBlock x:Name="lblCol" HorizontalAlignment="Left" Margin="614,391,0,0" TextWrapping="Wrap" Text="列数：" VerticalAlignment="Top" Width="101" FontSize="30"/>    <TextBlock x:Name="lblText" HorizontalAlignment="Left" Margin="346,454,0,0" TextWrapping="Wrap" Text="显示文本：" VerticalAlignment="Top" Width="157" FontSize="30"/>    <TextBlock x:Name="lblTitle" Style="{StaticResource TitleTextStyle}"  HorizontalAlignment="Left" Margin="508,178,0,0" TextWrapping="Wrap" Text="文字连连看" VerticalAlignment="Top" FontSize="72"/></Grid>

step2.根据输入的参数生成Grid，并且随机生成Grid中的元素

private void InitGridPanel(){    // 生成10行10列布局的Grid    for (int i = 0; i < RowDef; i++)    {        RowDefinition rowDef = new RowDefinition();        llkGrid.RowDefinitions.Add(rowDef);    }    for (int j = 0; j < ColDef; j++)    {        ColumnDefinition colDef = new ColumnDefinition();        llkGrid.ColumnDefinitions.Add(colDef);    }    // 创建文字数组    string[] badge = new string[Text.Length];    for (int i = 0; i < Text.Length; i++)    {        badge[i] = Text[i].ToString();    }    // 将文字数组放到指定行列的Grid数组中    List<string> stringList = new List<string>();    for (int i = 0; i < RowDef * ColDef / 2; i++)    {        int num = new Random(i + DateTime.Now.Millisecond).Next(badge.Length);        stringList.Add(badge[num]);         stringList.Add(badge[num]);    }    for (int row = 0; row < RowDef; row++)    {        for (int col = 0; col < ColDef; col++)        {            int num = new Random(row + col + DateTime.Now.Millisecond).Next(stringList.Count);            Button button = new Button();            // 给Button的Content赋值            button.Content = stringList[num];            // 移除已被赋值的stringList            stringList.RemoveAt(num);            // 给Button指定样式            button.FontSize = 50;            button.FontFamily = new FontFamily("宋体");            // 增加点击事件            button.Click += new RoutedEventHandler(this.button_Click);            llkGrid.Children.Add(button);            // 这里设置button在Grid中的位置，因为button已经在上一行确定了在哪个Grid，所以这里不用指定Grid了            Grid.SetRow(button, row);            Grid.SetColumn(button, col);        }    }}

step3.添加对按钮的监听事件

private void button_Click(object sender, RoutedEventArgs e){    Button button = (Button)sender;    if (OriginalButton == null)    {        // 第一次点击，或上一次点击消除了一对按钮        OriginalButton = button;        button.Foreground = GetColorFromHexa("#FFF50000");    }    else    {        if (OriginalButton.Equals(button))        {            OriginalButton.Foreground = GetColorFromHexa("#FFFFFFFF");        }        else        {            if (OriginalButton.Content.ToString().Equals(button.Content.ToString()))            {                // 两次点击的相同，消除按钮                button.Content = "";                OriginalButton.Content = "";                button.Visibility = Visibility.Collapsed;                OriginalButton.Visibility = Visibility.Collapsed;                Sum -= 2;                if (Sum == 0)                {                    ShowMessageDialog("游戏通关", "提示");                    GoToMainPage();                }            }            else            {                OriginalButton.Foreground = GetColorFromHexa("#FFFFFFFF");            }        }        OriginalButton = null;    }}

finally,对输入行列数做一个验证，行列成绩须为偶数等等细节，就可以了~

开始实验一把~

通关~

请多指教~