创建圆形图像 Xaml答案

【问题标题】：Create Circular Image Xaml创建圆形图像 Xaml
【发布时间】：2014-12-04 03:29:47
【问题描述】：

在 windows phone 8 中，我想将图像放在一个圆圈中。是否有类似网格的圆形容器？我知道有椭圆位不是容器

【问题讨论】：

在正方形上设置 50% 的圆角半径可能达到你想要的效果吗？
我不是很了解。你是想说我必须创建正方形，将半径设置为 50%，然后添加图像吗？（我不能这样做，因为正方形不是容器）
我没用过Windows phone 8，但是在其他一些标记中你可以设置正方形每个角的边框半径来做一个圆。在 css 中你会这样做：jsfiddle.net/M97Fz/1

【解决方案1】：

这是我的做法。

<Ellipse Width="100"
         Height="100">
    <Ellipse.Fill>
        <ImageBrush>
            <ImageBrush.ImageSource>
                <BitmapImage UriSource="/YourImage.png" />
            </ImageBrush.ImageSource>
        </ImageBrush>
    </Ellipse.Fill>
</Ellipse>

作为最佳做法，请考虑将 DecodePixelWidth 和 DecodePixelHeight 设置为与椭圆相同的大小。

【讨论】：

当使用内存中加载的图像（不是来自 URI）执行此操作时，我最终直接绑定到 ImageBrush 元素上的 ImageSource 属性。

【解决方案2】：

mleroy 回答的另一种选择（因为如果我记得正确的 WP 是基于 silverlight 的，我经常遇到缺乏刷子可用性来做类似的事情。）你可以使用 Clip 属性来做到这一点。

例如；

<Image 
  Source="blah\yourpicture.jpg" 
  Width="100" Height="100">
  <Image.Clip>
    <EllipseGeometry
      RadiusX="100"
      RadiusY="100"
      Center="100,100"/>
  </Image.Clip>
</Image>

希望对你有帮助，干杯

编辑添加：您还可以将半径 X/Y 绑定到图像的宽度/高度，以便在动态大小的图像上更加灵活。

【讨论】：

请注意，EllipseGeometry 在 Windows 10 通用应用程序中不可用。
是的，但问题不在于这个，而且已经有一年多了。不过很好传递。