Image控件
开发Windows应用商店应用时,除了在界面中显示文字信息以外,还可以加入图片来配合说明及增加美观度。使用Image控件能够实现显示图片的功能,开发者可以根据需求使图片按照不同的方式显示在界面中。
在XAML文件中,Image控件的用法如下所示:
<Image .../>
下面介绍一下Image控件的两个常用属性:
- Source属性,获取或设置图片的地址源。
- Stretch属性,表示图片的呈现状态,共有4种属性值,分别为None、Uniform、UniformToFill、Fill。None值表示图像不会拉伸以填充溢出部分的尺寸。Uniform值表示图像将被按比例拉伸以适应输出尺寸,即图像有一边满足规定的尺寸即可,图像的原始宽高比例将被保存下来,该值为Stretch属性的默认值。UniformToFill值表示图像将被按比例拉伸以完全填充输出区域,图像的原始宽高比例将被保存下来。Fill值表示图像将被按比例拉伸以适应输出尺寸。
接下来通过一个简单的示例来说明Image控件的使用方法。
新建一个名为"ImageDemo"的Windows应用商店的空白应用程序项目,在项目中的Assets文件夹内放置一个图片文件win8Logo.png,打开MainPage.xaml文件,在Grid元素中添加如下代码。
<Image HorizontalAlignment="Left" Source="Assets/win8Logo.png" Width="240" Margin="551,339,0,282" Stretch="Fill"/>
<TextBlock HorizontalAlignment="Left" TextWrapping="Wrap" Text="Windows 8 Logo显示为:" FontSize="25" Margin="263,396,0,335"/>
在上面的代码中,添加了一个Image控件和一个TextBlock控件,设置Image控件的Source属性为所显示图片的路径地址,接着设置TextBlock控件的Text属性值为"Windows 8 Logo显示为:"。
运行程序,可以看到Windows 8的Logo,效果如图4-23所示。
图4-23 使用Image控件显示Windows 8 Logo
冯瑞涛