代码改变世界

WPF/E CTP Quick Start - 第六部分:图像(翻译)

2006-12-10 23:11 Jeffrey Zhao 阅读(...) 评论(...) 编辑 收藏

Image元素能使您在WPF/E中显示位图信息。

这篇文档包含了以下部分:

 

Image元素

Image元素为您提供了一个简单的方法在WPF/E中显示JPG和PNG格式的图像。为了显示一副图像,您需要将Image对象的Source属性设置为图像文件。下面的例子使用了一个Image元素来显示一幅141x131的位图图像。因为没有指定Image元素的WidthHeight属性,这副图将以它的原始大小显示出来。

<Canvas Width="300" Height="300"
    xmlns="http://schemas.microsoft.com/client/2007"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Image Source="star.png" />
</Canvas>

重新开始查看内容

 

Stretch属性

Image元素的大小和位图信息的大小不同时,Stretch属性会决定这幅位图会如何进行缩放,以配合Image元素。Stretch元素可以使用以下值:None、Fill、Uniform、UniformToFill。下面的示例分别展示了None、Uniform和Fill的效果。

<Canvas Width="300" Height="300"
    xmlns="http://schemas.microsoft.com/client/2007"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Image Source="star.png" Stretch="None"
        Height="100" Width="200" Canvas.Left="100" />

    <Image Source="star.png" Stretch="Fill"
        Height="100" Width="200" Canvas.Top="100" Canvas.Left="100" />   
  
    <Image Source="star.png" Stretch="Uniform"
        Height="100" Width="200" Canvas.Top="200" Canvas.Left="100" /> 
     
    <TextBlock Canvas.Left="5" Canvas.Top="0">None</TextBlock>
    <TextBlock Canvas.Left="5" Canvas.Top="100">Fill</TextBlock>
    <TextBlock Canvas.Left="5" Canvas.Top="200">Uniform</TextBlock> 
</Canvas>

重新开始查看内容

您可以查看WPF/E SDK中有关Stretch属性的内容,以得到有关图像伸缩设置的更多信息。

 

使用位图的其它方法

有关如何使用ImageBrush对象将位图作为背景的更多内容,请查看“绘图与填充”。

 

下面该做什么呢?

在下一部分“文本”中,您会了解TextBlock元素的使用方式,它使您能够为WPF/E内容添加文本。