如何在不知道XAML中的尺寸的情况下以圆形方式剪切图像

Question

我的XAML中有一个图像元素，我不想指定它的尺寸，因为我希望它根据显示尺寸的分辨率进行缩放。

我需要将图像剪切成圆形，如何在不明确说明其尺寸的情况下进行剪切？

Answer 1

我解释你想要制作一个填充父容器的圆形图像的问题。使用带有Stretch="Uniform"的椭圆来创建一个圆，然后将Fill设置为放置在Grid内的图像，例如它将填充它的父级，例如：< / p>

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
    <Ellipse Stretch="Uniform">
        <Ellipse.Fill>
            <ImageBrush ImageSource="/Assets/avatarpic-l.png" />
        </Ellipse.Fill>
    </Ellipse>
</Grid>

这将得到以下结果：

还有一种替代方法可以使用OpacityMask生成相同的结果（通过改变Offset参数，您还可以获得一些不错的淡入淡出效果）：

<Image Source="/Assets/avatarpic-l.png">
    <Image.OpacityMask>
        <RadialGradientBrush GradientOrigin="0.5,0.5" Center="0.5,0.5" RadiusX="0.5" RadiusY="0.5">
            <GradientStop Color="#ffffffff" Offset="1.0" />
            <GradientStop Color="#00ffffff" Offset="1.0" /> 
        </RadialGradientBrush>
    </Image.OpacityMask>
</Image>

使用第二种方法，如果设置<Image Source="/Assets/avatarpic-l.png" Stretch="None" >...</Image>，您也可以让图像保持其原始尺寸。