如何将背景图像设置为形状

Question

我是Xamarin Forms的新手，之前使用WPF。在WPF中，很容易将背景图像（远程）设置为形状。 在Xamarin Forms中是否有相应的事情？

- user3258225

---

https://github.com/luberda-molinet/FFImageLoading/wiki/Transformations-Guide - Nick Kovalsky

Answer 1

在引入形状和路径到Xamarin.Forms之后，您可以在一个网格(Grid)内实现它：

<Grid HorizontalOptions="Center" VerticalOptions="Center">
    <Ellipse Stroke="blue" StrokeThickness="5" Fill="Black" Aspect="Fill"/>
    <Image Source="xamarin.png" WidthRequest="300" HeightRequest="300"/>
</Grid>

---

使用 Frame 实现圆角：

<Grid HorizontalOptions="Center" VerticalOptions="Center">
    <Frame WidthRequest="200" CornerRadius="80"
           BackgroundColor="Black" HeightRequest="200"/>
    <Image Source="xamarin.png" WidthRequest="200" HeightRequest="200"/>
</Grid>

---

使用 Path：

<Grid HorizontalOptions="Center" VerticalOptions="Center">
    <Path Stroke="blue"
          Data="m123.87668,219.80811l21.30223,-42.92685l36.89384,-24.78565l42.60447,0l36.89384,24.78565l21.30223,42.92685l0,49.57131l-21.30223,42.92685l-36.89384,24.78564l-42.60447,0l-36.89384,-24.78564l-21.30223,-42.92685l0,-49.57131z"
          StrokeThickness="5" WidthRequest="200" HeightRequest="200"
          Aspect="Fill" Fill="Black"/>

    <Image Source="xamarin.png" WidthRequest="200" HeightRequest="200"/>
</Grid>

---

相关文档

• 微软博客: 使用 Xamarin.Forms 的形状和路径绘制 UI.

• 微软官方文档: Xamarin.Forms 形状.

• GitHub: 规范: 形状与路径

- Cfun