【win8开发 -- XAML中琐碎知识点】

1、 Canvas、StackPanel、Grid

Width、Height的可选值:Auto,自动:*,表示百分号时为:0.3*
2、Button在Grid中占两列的代码:Grid.ColumnSpa

n="2"
3、点击Button在StackPanel中动态添加元素:

TextBox tb=new TextBox();
tb.Text=DataTime.Now.ToString();
StackPanel.Children.Add(tb);

4、在Button的Click事件中动态生成元素

复制代码
 1 private void btn1_Click(object sender, RoutedEventArgs e)
 2         {           
 3             for (int row = 0; row < 3; row++)
 4             {
 5                 for (int column = 0; column < 3; column++)
 6                 {
 7                     TextBox tb = new TextBox();
 8                     tb.Text = row + "," + column;
 9                     Grid.SetRow(tb,row); //在Grid下设置行,相当于XAML中设置tb的Grid.Row属性
10                     Grid.SetColumn(tb, column);
11                     grid1.Children.Add(tb);//动态添加到grid1中TextBox的子元素
12                 }
13             }
14         }
复制代码

5、连连看,随机生成并显示图片

复制代码
 1 protected override void OnNavigatedTo(NavigationEventArgs e)
 2         {
 3             //定义10行8列
 4             for (int i = 0; i < 10; i++)
 5             {
 6                RowDefinition rowdf=new RowDefinition();
 7                 grid1.RowDefinitions.Add(rowdf);
 8             }
 9             for (int i = 0; i < 8; i++)
10             {
11                 ColumnDefinition coldf = new ColumnDefinition();
12                 grid1.ColumnDefinitions.Add(coldf);
13             }
14             //在定义好的行列中添加图片来显示进行连连看     
15             //随机生成代码一定要写在for循环外面
16             Random rd = new Random();
17             for (int row = 0; row < 10; row++)
18             {
19                 for (int column = 0; column < 8; column++)
20                 {
21                     Image img = new Image();
22                     //随机生成6个图片,取不到上限值所以上限值为7
23                     int sum = rd.Next(1, 7);
24                     //通过代码来为Image赋值,如果图片位于项目中,则需要添加“ms-appx:///”
25                     string filename = "ms-appx:///Images/" + sum + ".png";
26                      // img.Source=new Windows.UI.Xaml.Media.Imaging.BitmapImage(new Uri(filename));
27                    //任何一个类型都不能强转string类型,因为任何类都没有继承于string,string是密封类。Source为ImageSource类型
28                     //img.Source的类型为ImageSource类型,BitmapImage继承于BitmapSource,BitmapSource继承于ImageSource
29                     img.Source = new BitmapImage(new Uri(filename));
30                     grid1.Children.Add(img);
31                     Grid.SetColumn(img, column);
32                     Grid.SetRow(img, row);
33                 }
34             }
35         }
复制代码

  注意: //通过代码来为Image赋值,如果图片位于项目中,则需要添加“ms-appx:///”,如果不添加的话会出现以下错误信息:“Invalid URI:The format of the URI could not be determined”
6、Button
想在Button中添加多个控件,需要加上StackPanel容器
7、画刷(Brush)
实心颜色画刷:SolidColorBrush
渐变画刷:LinearGradienBrush
图片画刷:ImageBrush
Brush类型的属性都可以指定各种Brush,例如Button的Foreground、Rectangle的Fill
   Brush在Button中设计的代码:

复制代码
 1 <Button Content="Button" >
 2             <Button.Background>   //渐变画刷
 3                 <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> //去掉 EndPoint="0.5,1" StartPoint="0.5,0"后,显示出来的是横向渐变
 4                     <LinearGradientBrush.RelativeTransform>   //相对转换格式
 5                         <CompositeTransform CenterY="0.5" CenterX="0.5" SkewX="-3"/>  //复合型转换格式
 6                     </LinearGradientBrush.RelativeTransform>
 7                     <GradientStop Color="Black" Offset="0"/>   //Offset:抵消
 8                     <GradientStop Color="Yellow" Offset="0.7"/>  
 9                     <GradientStop Color="red" Offset="1"/>
10                 </LinearGradientBrush>                
12             </Button.Background>
13  </Button>
复制代码

8、歌词动态显示
(1)实现字体的瞬间变化

复制代码
 1  <TextBlock Text="我有一只小毛驴,从来也不骑。。。" Margin="105,302,0,0">
 2             <TextBlock.Foreground>
 3                 <LinearGradientBrush>
 4                     <GradientStop Color="Yellow"></GradientStop>
 5                     <GradientStop x:Name="gds1" Color="Yellow" Offset="0.38"></GradientStop>
 6                     <GradientStop x:Name="gds2" Color="Red" Offset="0.38"></GradientStop>
 7                     <GradientStop Color="Red" Offset="1"></GradientStop>
 8                 </LinearGradientBrush>
 9             </TextBlock.Foreground>
10         </TextBlock>
复制代码

(2)实现歌词的动态显示

复制代码
 1   protected override void OnNavigatedTo(NavigationEventArgs e)
 2         {
 3             //asp.net中有Timer控件来指定随时间变化发生的事情,在win8中用的是DispatcherTimer
 4             DispatcherTimer timer = new DispatcherTimer();
 5             timer.Interval = TimeSpan.FromMilliseconds(200); //Interval:间隔、间距、幕间休息,TimeSpan:时间间隔
 6             timer.Tick += timer_Tick;
 7             timer.Start();
 8         }
 9          void timer_Tick(object sender, object e)
10         {  //Offset之间间隔0.05来更改颜色的变化,满值为 1
11             gds1.Offset += 0.05;
12             gds2.Offset += 0.05;
13         }    
复制代码

9、变换和投射
以Button为例:
(1)变换Transform:旋转变换(RotateTransform)、缩放变换(ScaleTransform)、平移变换(TranslateTransform)

复制代码
<Button.RenderTransform>  //Render:致使、打底、交纳
     //混合变换   <CompositeTransform  CenterY="20" CenterX="10" Rotation="11.978" ScaleX="1.5" SkewX="4" SkewY="2" TranslateX="12" TranslateY="33" />
                <RotateTransform Angle="19" CenterX="12" CenterY="25"/>
                <ScaleTransform ScaleX="1.7" ScaleY="1.5"/>
                <TranslateTransform X="12" Y="20"/>
      </Button.RenderTransform>
复制代码

(2)投射Projection:

<Image HorizontalAlignment="Left" Height="400" Margin="544,260,0,0" VerticalAlignment="Top" Width="552" Source="Assets/1.png" Stretch="Fill">
            <Image.Projection>
                <PlaneProjection x:Name="pp1" RotationY="12"/>
            </Image.Projection>
    </Image>

10、页面导航
(1)缓存
wp中回退的页面的值是自动保存的缓存,而win8中的缓存是不存在的,可以自动添加

 public BlankPage1()
        {
            this.InitializeComponent();
            //启用缓存,当回退到该页面时之前做的修改仍存在,必须写在构造函数中
            NavigationCacheMode = Windows.UI.Xaml.Navigation.NavigationCacheMode.Enabled;
        }

(2)导航、传参、返回

复制代码
     <1> Frame.Navigate(typeof(BlankPage1), 1); //导航到BlankPage1页面,并传参
     <2> protected override void OnNavigatedTo(NavigationEventArgs e)
        {          
            //e.Parameter 为导航到这个页面(此时页面为BlancPage1页面)时传入的参数
            int i =(int) e.Parameter;
            if (i==1)
            {
                this.tbx1.Text = "我是一";
            }
            else if (i==2)
            {
                this.tbx1.Text = "我是二";
            }
        }
     <3> Frame.GoBack();  //返回上一个页面
复制代码

(3)判断该页面是否是新页面(New)、前进页面(Forward)、后退页面(Back)或者是自身页面的导航(Refresh)

if (e.NavigationMode==NavigationMode.New)
    {  

    }

   如图:

        
11、样式
在silverlight中,微软定义的就是 属性等同于样式,win8中的样式和wp中的样式是一样的
在win8中,可以新添加一个资源字典把所有要定义的样式存放到一起,然后再引用

<Page.Resources>
        <ResourceDictionary Source="Dictionary1.xaml" />
 </Page.Resources>

VS2012也自定义了一些样式,在默认的StandardStyles.xaml
12、消息框(MessageDialog)
MessageDialog在 Using Windows.UI.Popups中; 

  MessageDialog mdialog = new MessageDialog("我是个好孩子", "提示");
     mdialog.ShowAsync();  //对话框显示的异步操作

  (1)、自定义消息框。下面是自己定义的消息框,命令是你想要的操作,此处略(用ToDo来表示)

 
复制代码
private async void CustomCommandButton_Click2(object sender, RoutedEventArgs e)
 {
    //设置内容和标题
    var messageDialog = new MessageDialog("确定离开该页面吗?", "提示");
    messageDialog.Commands.Add(new UICommand("Don't install", (command) =>
    {
        //ToDo:
    })); 
    messageDialog.Commands.Add(new UICommand("Install updates", (command) =>
    {
        //ToDo:
    }));
    //设置默认按钮
    messageDialog.DefaultCommandIndex = 1;
    await messageDialog.ShowAsync();
}
复制代码

    (2)、 什么按钮都没有增加的时候,默认会有一个Close按钮。

private async void DefaultCloseCommandButton_Click2(object sender, RoutedEventArgs e)
{
    var messageDialog = new MessageDialog("哈哈,我是好孩子");
    await messageDialog.ShowAsync();
} // 此时弹出的文本框只有内容,没有标题。

    (3)、使用命令ID,根据用户选择的命令ID分别做不同的操作。

复制代码
private async void CompletedCallbackButton_Click(object sender, RoutedEventArgs e)
{      
    var messageDialog = new MessageDialog("确定离开该页面吗?", "提示!");
    // 增加命令和命令ID
    messageDialog.Commands.Add(new UICommand("取消", null, 0));
    messageDialog.Commands.Add(new UICommand("确认", null, 1));
    messageDialog.DefaultCommandIndex = 1; 
    var commandChosen = await messageDialog.ShowAsync();
    switch (commandChosen.Id.ToString())
    {
        case "0":
            //Todo:
          break;
        case "1":
            //ToDo:
          break;             
    }          
}
复制代码

    (4)、当按下Esc时,取消命令去作用

复制代码
private async void CancelCommandButton_Click2(object sender, RoutedEventArgs e)
{
    var messageDialog = new MessageDialog("No internet connection has been found.");
    //两个命令的CallBack函数是一样的,与上面inline的形式不同。
    messageDialog.Commands.Add(new UICommand("Try again", new UICommandInvokedHandler(this.CommandInvokedHandler2)));
    messageDialog.Commands.Add(new UICommand("Close", new UICommandInvokedHandler(this.CommandInvokedHandler2)));
    messageDialog.DefaultCommandIndex = 0;
    // 当按下Esc时,取消命令去作用
    messageDialog.CancelCommandIndex = 1;
    await messageDialog.ShowAsync();
}
private void CommandInvokedHandler2(IUICommand command)
{
    //ToDo:
}
复制代码

直接在键盘上按下Esc退出按钮,直接调用退出命令。此处要注意,两个命令调用同一个函数CommandInvokedHandler2
     (5)、当然也可以封装一下

复制代码
 public async static void Show(string str)
        {
            var messageDialog = new MessageDialog(str);
            await messageDialog.ShowAsync();
        }
 //例如自定义一个对话框
   MessageDialog msg = new MessageDialog("恭喜您胜利了!" + "\n步数:" + this.txblock2.Text + "\n时间:");
                msg.Commands.Add(new UICommand("重玩", (command) =>
                {
                    ClearPic();
                    BindingPic(random());
                    this.txblock2.Text = "0";
                }));
                msg.Commands.Add(new UICommand("菜单", (command) =>
                {
                    this.Frame.Navigate(typeof(GroupedItemsPage));
                }));
                msg.DefaultCommandIndex = 1;
                msg.ShowAsync();
复制代码

 来源:  http://www.cnblogs.com/kefira/archive/2013/03/07/windows8.html

你可能感兴趣的:(windows,8,XAML)