win8,win8.1应用中生成显示button的三种步骤以及设置button背景图片的三种方法

win8,win8.1应用中生成显示button的三种方法以及设置button背景图片的三种方法

首先这篇博客其实不只是针对button的显示，很多其他的控件都可以用这三种方法，这里只是拿button做一个示例罢了，可以举一反三的。

建一个win8或者win8.1的空应用，我们要在设计模板上放一个button，有以下三种方法：

1.，拖曳在工具箱中的button控件到模板视图中就行了，在模板视图中可以自行通过拖拉设置它的大小和位置，以及双击生成事件和修改它的content的内容(就是按钮上显示的文字，和HTML中的button的value是一个意思)

2.代码直接写

3.后台写，显示到前台(这种方法其实是很重要的，也是很多人都搞不清楚的或者忽略的方法)，在win8,win8.1中不支持C#在网站应用程序中的this.controls.add()这种写法，因为它不是窗体，根本就没有容器让你去填进去，所以这个时候就要在前台先放一个容器，比如stackpanel，给它一个x:Name="stackpanel3"

Button btn = new Button();

btn.Text="自己定义";

stackpanel3.children.add(btn);

这样就能在前台成功添加这个按钮了。

第二个问题就是给Button按钮加上背景图片，这个也有三种方法:

1.先在页面上放置一个Button按钮

注意不要采取自我闭合的方式，简言之就是不能这样：<Button .../>，而是采用<Button ..></Button>的方式。这样才可以里面进一步定义它的属性，这也是微软的一大好处，你有多少属性需要嵌套都可以。

<Button x:Name="btnBackImage" Content="">
	<!--第一种写法-->
	<Button.Background>
		<ImageBrush ImageSource="Assets/Images/buttonBg.png"/>
	</Button.Background>
</Button>

2.采用静态资源的方式定义样式引用

类似在传统的html,css中的采用在head标签中写<style type="text/css"></style>的方式。而在win8或win8.1应用中采用<page.Resource></page.Resource>的方式定义样式。其中x:Key="btnBg"是ImageBrush的唯一指定，然后对应的在Button中引用这个静态资源就可以了：Background="{StaticeResource btnBg}"

<!--第二种方法-->
    <Page.Resources>
        <ImageBrush x:Key="btnBg" ImageSource="Assets/Images/buttonBg.png"/>
    </Page.Resources>
    <!--在下面的Button中加上Background="{StaticResource btnBg}"-->

        <Button x:Name="btnBackImage" Background="{StaticResource btnBg}" Content="" HorizontalAlignment="Left" Margin="380,113,0,0" VerticalAlignment="Top" Height="295" Width="401">
        </Button>

3.在后台动态添加背景图片。这边看上去是比较麻烦的，因为不能直接指定它的背景是一个图片(图片索引)

这里必须先渲染这个图片，然后画刷才能得到这个图片，最后才能指定给相应的Button。

注意：如果索引直接写图片的相对或者绝对地址，是取不到图片的。这里图片的索引地址前必须加上"ms-appx:///",这个是微软的硬性规定，虽然看起来很累赘，不过也没办法。

var uri = "ms-appx:///Assets/Images/back.png";
Uri imgUri = new Uri(uri, UriKind.RelativeOrAbsolute);
BitmapImage imgSource = new BitmapImage(imgUri);
ImageBrush brush = new ImageBrush();
brush.ImageSource = imgSource;
btnBackImage.Background = brush;

win8,win8.1应用中生成显示button的三种步骤以及设置button背景图片的三种方法

相关推荐