Windows Phone 8.1中圆形图片或头像的制作、优化以及Stretch的四个属性值的区别

开篇之前，认识一下Stretch的四个不同的属性值：

现在很多应用的头像或者其他UI设计都偏向于圆形，当然也存在方块形的Metro风格的布局。在Win10手机预览版里的

联系人头像都改成圆形显示了。其实真不知道微软怎么想的，有些自己创造或者发起的东西自己又不坚持了，然后被

苹果安卓的发扬光大，这不是给别人做嫁妆嘛。这样市场怎么起得来，真是恨铁不成钢啊。

算了，废话一大堆，在程序员看来，有需求就必须要实现，也必须有实现的方法。很简单方法如下：

两种方式，前者普遍，后者重在优化。

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition/>
        <RowDefinition/>
    </Grid.RowDefinitions>
    <Grid Grid.Row="0">
        <Ellipse Height="200" Width="200">
            <Ellipse.Fill>
                <ImageBrush ImageSource="Assets/Images/icon.jpg" Stretch="UniformToFill" />
            </Ellipse.Fill>
        </Ellipse>
    </Grid>
    <Grid Grid.Row="1">
        <Ellipse Height="200" Width="200">
            <Ellipse.Fill>
                <ImageBrush>
                    <ImageBrush.ImageSource>
                        <BitmapImage DecodePixelHeight="200" DecodePixelWidth="200" UriSource="Assets/Images/icon.jpg"/>
                    </ImageBrush.ImageSource>
                    <ImageBrush.Stretch>
                        <Stretch>UniformToFill</Stretch>
                    </ImageBrush.Stretch>
                </ImageBrush>
            </Ellipse.Fill>
        </Ellipse>
    </Grid>
</Grid>

既定显示效果：

以上两种方法，乍一看没啥区别。就是多了DecodePixelHeight和DecodePixelWidth 这两个属性设置。而后者是为

了节省内存而存在的。试想这么两个情况：

情况一：如果你原图是一个电脑壁纸，相当于1920*1200的那种，而你显示圆形图片或头像只需要显示其中的一部

分，那么你初期LOAD的时候，应用要用这个图片需要进行解码，这么大一个图片，解码就要耗很大的内存。当然这

种情况一般不会出现，我们预设的图片肯定是已经裁剪到适当尺码的。但是这种情况也需要考虑到。

情况二：当我们大量显示这种圆形图片的时候，比如应用里显示很多的用户信息，就免不了用户头像的集中陈列了，

而就算你预设的图片尺寸适当，但是当数量至上的时候，自然是很耗费内存的，程序也会因此而崩溃掉的。

所以基于两种情形，我们可以总结两种方法之间的差异是ImageBrush的到底是不是根据实际大小渲染图片这一区

别，而实际情况下使用ImageBrush将不会得到自动根据需要渲染大小来进行解码的功能。那我们怎么来实现根据实

际大小来渲染图片呢？就是那两个属性帮忙了。所以说DecodePixelHeight和DecodePixelWidth还是很好的伙伴

的。对于内存的优化还是蛮有用的。

这里引用一句话：

注意：自动根据需要渲染大小来解码的这个功能是指即使一个图片是比较大的，但只解码需要渲染的大小。所以，如

果你有一个 2000 像素乘以 2000 像素大小的图片，但仅仅需要渲染成 100 像素乘以 100 像素大小的时候，我们将

图片解码为 100 像素乘以 100 像素的话，就可以节省大量的内存了。

推荐链接：

BitmapImage.DecodePixelType Property

BitmapImage.DownloadProgress Event