在.net MAUI 8 中向边框添加阴影

Question

我正在尝试创建带有阴影的卡片，如 .net maui 8.0 中的所示

我使用

Border

作为父级，内部有一个网格用于卡片的布局。但是，当我向

Border

添加阴影时，阴影只会添加到网格内的所有元素上。就像这张的图片一样。官方文档要求我们使用

Border

代替

Frame

并使用

Shadow

代替

HasShadow

但没有提供任何示例。

这是我正在使用的代码：

<Grid ColumnDefinitions="5*, 2*"
        Margin="10, 10, 10, 5" >

<Label Text="Your Chores"
            FontSize="Large"
            FontAttributes="Bold" />

<!--Add Button-->

<Border BackgroundColor="{AppThemeBinding Light={StaticResource White}, Dark={StaticResource DarkBackground}}" 
        Stroke="{StaticResource ButtonColor}"
        StrokeShape="RoundRectangle 4"
        Grid.Column="1" >

    <Grid 
        Padding="10, 8, 4, 8"
        ColumnDefinitions="20, *"
        BackgroundColor="Transparent" >

        <Grid HeightRequest="20">
            <Ellipse Fill="{StaticResource ButtonColor}" />
            <Label Text="+"
                        FontAttributes="Bold"
                        HorizontalTextAlignment="Center"
                        VerticalTextAlignment="Center"
                        TextColor="{StaticResource White}" />
        </Grid>

        <Label Text="Add"
                    Grid.Column="1"
                    VerticalTextAlignment="Center"
                    HorizontalTextAlignment="Center"
                    TextColor="{StaticResource ButtonColor}" />



    </Grid>

</Border>

该项目仅在Android上运行。

是否可以指定一个属性来要求子 UI 元素上避免出现阴影？

如何让边框有阴影？

Answer 1

`

.
.
.
       <Border.Shadow>
            <Shadow
                Brush="{AppThemeBinding Light={StaticResource SampleLight},
                                        Dark={StaticResource SampleDark}}"
                Opacity=".5"
                Offset="15,15" />
        </Border.Shadow>
    </Border>

`