如何在XAML中设计非平面UI

本文关键字:平面 UI XAML | 更新日期: 2023-09-27 18:17:23

是否有可能在 c# 中创建非平面设计?XAML似乎没有一个功能来实现内部阴影的buttons, dropdowns和其他控制形式没有任何边界?

  • http://imagr.eu/up/RSsvY_presentation_2.jpg
  • http://imagr.eu/up/3uaE1_presentation_3.jpg

如何在XAML中设计非平面UI

要创建非平面控件,请使用线性和径向渐变画笔填充背景。

如果你不知道如何在XAML中创建笔刷,你可以使用Blend来设计笔刷。

对于无边框窗口,将窗口的WindowStyle设置为None。

下面是一个例子:

<Button HorizontalAlignment="Center"
        VerticalAlignment="Center"
        Content="Click Me"
        Foreground="White">
    <Button.Template>
        <ControlTemplate TargetType="Button">
            <Grid>
                <Rectangle>
                    <Rectangle.Fill>
                        <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                            <GradientStop Offset="0" Color="#FF4D4C4C" />
                            <GradientStop Offset="1" Color="#FF1D1D1D" />
                        </LinearGradientBrush>
                    </Rectangle.Fill>
                </Rectangle>
                <ContentPresenter Margin="10"
                                    HorizontalAlignment="Center"
                                    VerticalAlignment="Center" />
            </Grid>
        </ControlTemplate>
    </Button.Template>
</Button>