我们有一个简单的页面。它包含一个ListView
和一个Grid
。grid
包含两个Images
...
这两个图像分别是一个灰色矩形和一个白色梯形。
当我们在梯形上叠加矩形时,图像的大小/比例(不确定哪个)不正确。愿望是对其进行分层,以使图像排成一行。.
现在的实现是将两张图像添加到具有单行单列的网格中。 RowDefinition
和ColumnDefinition
设置为(one)1并且自动。对于水平和垂直选项,两个图像均设置为CenterAndExpand
。
有没有一种方法可以调整第二张图像(灰色矩形)的大小,该图像叠在第一张图像(白色梯形)上,以使矩形与梯形对齐?当前的想法是围绕网格进行操作定义并使用边距/填充将其对齐,但确信此解决方案不会转换为各种设备显示尺寸。
一如既往的感谢您的阅读。非常感谢。
[有许多解决方案可以实现它。由于您已经使用Grid。您最好将行的高度设置为静态值,以使图像的高度适合该行。
您可以检查以下代码
<Grid BackgroundColor="Black">
<Grid.RowDefinitions>
<RowDefinition Height="50" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width=".20*" />
<ColumnDefinition Width=".30*" />
<ColumnDefinition Width=".30*" />
<ColumnDefinition Width=".20*" />
</Grid.ColumnDefinitions>
<Image Grid.Column="0" Grid.ColumnSpan="4" Source="pic1" Aspect="AspectFill"/> //white trapezoid
<Image Grid.Column="1" Grid.ColumnSpan="2" Source="pic2" Aspect="AspectFill"/> //grey rectangle
</Grid>
对于其他设备,您只需要更改height的值(数据绑定)。