LanMontainDesktop/Views/Components/WeatherWidget.axaml

<UserControl xmlns="https://github.com/avaloniaui"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:fi="using:FluentIcons.Avalonia"
             mc:Ignorable="d"
             d:DesignWidth="320"
             d:DesignHeight="320"
             x:Class="LanMontainDesktop.Views.Components.WeatherWidget">

    <Border x:Name="RootBorder"
            CornerRadius="30"
            ClipToBounds="True"
            Background="#68A9EC">
        <Grid>
            <Border x:Name="BackgroundImageLayer"
                    CornerRadius="30"
                    ClipToBounds="True" />

            <Border x:Name="BackgroundMotionLayer"
                    CornerRadius="30"
                    ClipToBounds="True"
                    Opacity="0.20"
                    RenderTransformOrigin="0.5,0.5">
                <Border.RenderTransform>
                    <TransformGroup>
                        <ScaleTransform ScaleX="1.05"
                                        ScaleY="1.05" />
                        <TranslateTransform />
                    </TransformGroup>
                </Border.RenderTransform>
            </Border>

            <Border x:Name="BackgroundTintLayer"
                    CornerRadius="30"
                    ClipToBounds="True"
                    Opacity="0.16" />

            <Border x:Name="BackgroundLightLayer"
                    CornerRadius="30"
                    ClipToBounds="True"
                    Opacity="0.62">
                <Border.Background>
                    <LinearGradientBrush StartPoint="0,0"
                                         EndPoint="1,1">
                        <GradientStop Color="#52FFFFFF"
                                      Offset="0" />
                        <GradientStop Color="#1AFFFFFF"
                                      Offset="0.30" />
                        <GradientStop Color="#00000000"
                                      Offset="0.56" />
                    </LinearGradientBrush>
                </Border.Background>
            </Border>

            <Border x:Name="BackgroundShadeLayer"
                    CornerRadius="30"
                    ClipToBounds="True"
                    Opacity="0.74">
                <Border.Background>
                    <LinearGradientBrush StartPoint="0,0"
                                         EndPoint="0,1">
                        <GradientStop Color="#00000000"
                                      Offset="0.46" />
                        <GradientStop Color="#2009182D"
                                      Offset="1" />
                    </LinearGradientBrush>
                </Border.Background>
            </Border>

            <Canvas x:Name="ParticleLayer"
                    IsHitTestVisible="False"
                    ClipToBounds="True" />

            <Border x:Name="ContentPaddingBorder"
                    Padding="18,16"
                    Background="Transparent">
                <Grid x:Name="LayoutRoot">
                    <Grid x:Name="ContentGrid"
                          RowDefinitions="Auto,*,Auto"
                          RowSpacing="0">
                        <Grid x:Name="TopRowGrid"
                              Grid.Row="0"
                              ColumnDefinitions="Auto,*,Auto"
                              ColumnSpacing="6">
                            <TextBlock x:Name="TemperatureTextBlock"
                                       Grid.Column="0"
                                       Text="7°"
                                       FontSize="88"
                                       FontWeight="Light"
                                       FontFeatures="tnum"
                                       VerticalAlignment="Top"
                                       Margin="-1,-7,0,0"
                                       TextTrimming="CharacterEllipsis"
                                       MaxLines="1" />

                            <Image x:Name="WeatherIconImage"
                                   Grid.Column="2"
                                   Width="84"
                                   Height="84"
                                   HorizontalAlignment="Right"
                                   VerticalAlignment="Top"
                                   Margin="0,-4,0,0"
                                   Stretch="Uniform" />
                        </Grid>

                        <StackPanel x:Name="BottomInfoStack"
                                    Grid.Row="2"
                                    VerticalAlignment="Bottom"
                                    HorizontalAlignment="Left"
                                    Spacing="0"
                                    Margin="0,0,0,2">
                            <StackPanel x:Name="ConditionStack"
                                        Orientation="Vertical"
                                        Spacing="2"
                                        HorizontalAlignment="Left"
                                        VerticalAlignment="Bottom"
                                        Margin="0,0,0,1">
                                <TextBlock x:Name="ConditionTextBlock"
                                           Text="雾"
                                           FontSize="26"
                                           FontWeight="SemiBold"
                                           HorizontalAlignment="Left"
                                           TextAlignment="Left"
                                           TextTrimming="CharacterEllipsis"
                                           MaxLines="1" />
                                <TextBlock x:Name="RangeTextBlock"
                                           Text="11°/4°"
                                           FontSize="28"
                                           FontWeight="SemiBold"
                                           FontFeatures="tnum"
                                           HorizontalAlignment="Left"
                                           TextAlignment="Left"
                                           TextTrimming="CharacterEllipsis"
                                           MaxLines="1" />
                            </StackPanel>
                            <Border x:Name="CityInfoBadge"
                                    Background="Transparent"
                                    CornerRadius="0"
                                    Padding="0"
                                    HorizontalAlignment="Left">
                                <StackPanel Orientation="Horizontal"
                                            Spacing="0"
                                            HorizontalAlignment="Left"
                                            VerticalAlignment="Center">
                                    <fi:SymbolIcon x:Name="LocationIcon"
                                                   Symbol="Location"
                                                   FontSize="12"
                                                   IsVisible="False"
                                                   VerticalAlignment="Center" />
                                    <TextBlock x:Name="CityTextBlock"
                                               Text="北京"
                                               FontSize="17"
                                               FontWeight="Regular"
                                               HorizontalAlignment="Left"
                                               TextAlignment="Left"
                                               VerticalAlignment="Center"
                                               TextTrimming="CharacterEllipsis"
                                               MaxLines="1" />
                                </StackPanel>
                            </Border>
                        </StackPanel>
                    </Grid>
                </Grid>
            </Border>
        </Grid>
    </Border>
</UserControl>
0.2.3 小白板，天气，时钟 2026-03-03 04:56:04 +08:00			`<UserControl xmlns="https://github.com/avaloniaui"`
			`xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"`
			`xmlns:d="http://schemas.microsoft.com/expression/blend/2008"`
			`xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"`
			`xmlns:fi="using:FluentIcons.Avalonia"`
			`mc:Ignorable="d"`
			`d:DesignWidth="320"`
			`d:DesignHeight="320"`
			`x:Class="LanMontainDesktop.Views.Components.WeatherWidget">`

			`<Border x:Name="RootBorder"`
0.2.6 媒体播放组件，录音组件 2026-03-03 18:26:29 +08:00			`CornerRadius="30"`
0.2.3 小白板，天气，时钟 2026-03-03 04:56:04 +08:00			`ClipToBounds="True"`
			`Background="#68A9EC">`
			`<Grid>`
			`<Border x:Name="BackgroundImageLayer"`
0.2.6 媒体播放组件，录音组件 2026-03-03 18:26:29 +08:00			`CornerRadius="30"`
0.2.3 小白板，天气，时钟 2026-03-03 04:56:04 +08:00			`ClipToBounds="True" />`

			`<Border x:Name="BackgroundMotionLayer"`
0.2.6 媒体播放组件，录音组件 2026-03-03 18:26:29 +08:00			`CornerRadius="30"`
0.2.3 小白板，天气，时钟 2026-03-03 04:56:04 +08:00			`ClipToBounds="True"`
0.2.7 修改天气组件，ci工作流 2026-03-04 02:02:34 +08:00			`Opacity="0.20"`
0.2.3 小白板，天气，时钟 2026-03-03 04:56:04 +08:00			`RenderTransformOrigin="0.5,0.5">`
			`<Border.RenderTransform>`
			`<TransformGroup>`
			`<ScaleTransform ScaleX="1.05"`
			`ScaleY="1.05" />`
			`<TranslateTransform />`
			`</TransformGroup>`
			`</Border.RenderTransform>`
			`</Border>`

			`<Border x:Name="BackgroundTintLayer"`
0.2.6 媒体播放组件，录音组件 2026-03-03 18:26:29 +08:00			`CornerRadius="30"`
0.2.3 小白板，天气，时钟 2026-03-03 04:56:04 +08:00			`ClipToBounds="True"`
0.2.7 修改天气组件，ci工作流 2026-03-04 02:02:34 +08:00			`Opacity="0.16" />`
0.2.3 小白板，天气，时钟 2026-03-03 04:56:04 +08:00
			`<Border x:Name="BackgroundLightLayer"`
0.2.6 媒体播放组件，录音组件 2026-03-03 18:26:29 +08:00			`CornerRadius="30"`
0.2.3 小白板，天气，时钟 2026-03-03 04:56:04 +08:00			`ClipToBounds="True"`
0.2.7 修改天气组件，ci工作流 2026-03-04 02:02:34 +08:00			`Opacity="0.62">`
0.2.3 小白板，天气，时钟 2026-03-03 04:56:04 +08:00			`<Border.Background>`
			`<LinearGradientBrush StartPoint="0,0"`
			`EndPoint="1,1">`
0.2.7 修改天气组件，ci工作流 2026-03-04 02:02:34 +08:00			`<GradientStop Color="#52FFFFFF"`
0.2.3 小白板，天气，时钟 2026-03-03 04:56:04 +08:00			`Offset="0" />`
0.2.7 修改天气组件，ci工作流 2026-03-04 02:02:34 +08:00			`<GradientStop Color="#1AFFFFFF"`
0.2.3 小白板，天气，时钟 2026-03-03 04:56:04 +08:00			`Offset="0.30" />`
			`<GradientStop Color="#00000000"`
0.2.7 修改天气组件，ci工作流 2026-03-04 02:02:34 +08:00			`Offset="0.56" />`
0.2.3 小白板，天气，时钟 2026-03-03 04:56:04 +08:00			`</LinearGradientBrush>`
			`</Border.Background>`
			`</Border>`

			`<Border x:Name="BackgroundShadeLayer"`
0.2.6 媒体播放组件，录音组件 2026-03-03 18:26:29 +08:00			`CornerRadius="30"`
0.2.3 小白板，天气，时钟 2026-03-03 04:56:04 +08:00			`ClipToBounds="True"`
0.2.7 修改天气组件，ci工作流 2026-03-04 02:02:34 +08:00			`Opacity="0.74">`
0.2.3 小白板，天气，时钟 2026-03-03 04:56:04 +08:00			`<Border.Background>`
			`<LinearGradientBrush StartPoint="0,0"`
			`EndPoint="0,1">`
0.2.7 修改天气组件，ci工作流 2026-03-04 02:02:34 +08:00			`<GradientStop Color="#00000000"`
			`Offset="0.46" />`
			`<GradientStop Color="#2009182D"`
0.2.3 小白板，天气，时钟 2026-03-03 04:56:04 +08:00			`Offset="1" />`
			`</LinearGradientBrush>`
			`</Border.Background>`
			`</Border>`

			`<Canvas x:Name="ParticleLayer"`
			`IsHitTestVisible="False"`
			`ClipToBounds="True" />`

			`<Border x:Name="ContentPaddingBorder"`
0.2.7 修改天气组件，ci工作流 2026-03-04 02:02:34 +08:00			`Padding="18,16"`
0.2.3 小白板，天气，时钟 2026-03-03 04:56:04 +08:00			`Background="Transparent">`
0.2.6 媒体播放组件，录音组件 2026-03-03 18:26:29 +08:00			`<Grid x:Name="LayoutRoot">`
			`<Grid x:Name="ContentGrid"`
			`RowDefinitions="Auto,*,Auto"`
0.2.7 修改天气组件，ci工作流 2026-03-04 02:02:34 +08:00			`RowSpacing="0">`
0.2.6 媒体播放组件，录音组件 2026-03-03 18:26:29 +08:00			`<Grid x:Name="TopRowGrid"`
			`Grid.Row="0"`
0.2.7 修改天气组件，ci工作流 2026-03-04 02:02:34 +08:00			`ColumnDefinitions="Auto,*,Auto"`
			`ColumnSpacing="6">`
0.2.3 小白板，天气，时钟 2026-03-03 04:56:04 +08:00			`<TextBlock x:Name="TemperatureTextBlock"`
0.2.6 媒体播放组件，录音组件 2026-03-03 18:26:29 +08:00			`Grid.Column="0"`
0.2.7 修改天气组件，ci工作流 2026-03-04 02:02:34 +08:00			`Text="7°"`
			`FontSize="88"`
0.2.6 媒体播放组件，录音组件 2026-03-03 18:26:29 +08:00			`FontWeight="Light"`
0.2.3 小白板，天气，时钟 2026-03-03 04:56:04 +08:00			`FontFeatures="tnum"`
0.2.6 媒体播放组件，录音组件 2026-03-03 18:26:29 +08:00			`VerticalAlignment="Top"`
0.2.7 修改天气组件，ci工作流 2026-03-04 02:02:34 +08:00			`Margin="-1,-7,0,0"`
0.2.3 小白板，天气，时钟 2026-03-03 04:56:04 +08:00			`TextTrimming="CharacterEllipsis"`
			`MaxLines="1" />`

0.2.6 媒体播放组件，录音组件 2026-03-03 18:26:29 +08:00			`<Image x:Name="WeatherIconImage"`
0.2.7 修改天气组件，ci工作流 2026-03-04 02:02:34 +08:00			`Grid.Column="2"`
			`Width="84"`
			`Height="84"`
0.2.6 媒体播放组件，录音组件 2026-03-03 18:26:29 +08:00			`HorizontalAlignment="Right"`
			`VerticalAlignment="Top"`
0.2.7 修改天气组件，ci工作流 2026-03-04 02:02:34 +08:00			`Margin="0,-4,0,0"`
0.2.6 媒体播放组件，录音组件 2026-03-03 18:26:29 +08:00			`Stretch="Uniform" />`
			`</Grid>`

0.2.7 修改天气组件，ci工作流 2026-03-04 02:02:34 +08:00			`<StackPanel x:Name="BottomInfoStack"`
			`Grid.Row="2"`
			`VerticalAlignment="Bottom"`
			`HorizontalAlignment="Left"`
			`Spacing="0"`
			`Margin="0,0,0,2">`
			`<StackPanel x:Name="ConditionStack"`
			`Orientation="Vertical"`
			`Spacing="2"`
			`HorizontalAlignment="Left"`
			`VerticalAlignment="Bottom"`
			`Margin="0,0,0,1">`
0.2.3 小白板，天气，时钟 2026-03-03 04:56:04 +08:00			`<TextBlock x:Name="ConditionTextBlock"`
0.2.7 修改天气组件，ci工作流 2026-03-04 02:02:34 +08:00			`Text="雾"`
			`FontSize="26"`
0.2.3 小白板，天气，时钟 2026-03-03 04:56:04 +08:00			`FontWeight="SemiBold"`
0.2.7 修改天气组件，ci工作流 2026-03-04 02:02:34 +08:00			`HorizontalAlignment="Left"`
			`TextAlignment="Left"`
0.2.3 小白板，天气，时钟 2026-03-03 04:56:04 +08:00			`TextTrimming="CharacterEllipsis"`
			`MaxLines="1" />`
			`<TextBlock x:Name="RangeTextBlock"`
0.2.7 修改天气组件，ci工作流 2026-03-04 02:02:34 +08:00			`Text="11°/4°"`
			`FontSize="28"`
0.2.3 小白板，天气，时钟 2026-03-03 04:56:04 +08:00			`FontWeight="SemiBold"`
			`FontFeatures="tnum"`
0.2.7 修改天气组件，ci工作流 2026-03-04 02:02:34 +08:00			`HorizontalAlignment="Left"`
			`TextAlignment="Left"`
0.2.3 小白板，天气，时钟 2026-03-03 04:56:04 +08:00			`TextTrimming="CharacterEllipsis"`
			`MaxLines="1" />`
			`</StackPanel>`
0.2.6 媒体播放组件，录音组件 2026-03-03 18:26:29 +08:00			`<Border x:Name="CityInfoBadge"`
0.2.7 修改天气组件，ci工作流 2026-03-04 02:02:34 +08:00			`Background="Transparent"`
			`CornerRadius="0"`
			`Padding="0"`
0.2.6 媒体播放组件，录音组件 2026-03-03 18:26:29 +08:00			`HorizontalAlignment="Left">`
			`<StackPanel Orientation="Horizontal"`
0.2.7 修改天气组件，ci工作流 2026-03-04 02:02:34 +08:00			`Spacing="0"`
			`HorizontalAlignment="Left"`
0.2.6 媒体播放组件，录音组件 2026-03-03 18:26:29 +08:00			`VerticalAlignment="Center">`
			`<fi:SymbolIcon x:Name="LocationIcon"`
			`Symbol="Location"`
0.2.7 修改天气组件，ci工作流 2026-03-04 02:02:34 +08:00			`FontSize="12"`
0.2.6 媒体播放组件，录音组件 2026-03-03 18:26:29 +08:00			`IsVisible="False"`
			`VerticalAlignment="Center" />`
			`<TextBlock x:Name="CityTextBlock"`
0.2.7 修改天气组件，ci工作流 2026-03-04 02:02:34 +08:00			`Text="北京"`
			`FontSize="17"`
			`FontWeight="Regular"`
			`HorizontalAlignment="Left"`
			`TextAlignment="Left"`
0.2.6 媒体播放组件，录音组件 2026-03-03 18:26:29 +08:00			`VerticalAlignment="Center"`
			`TextTrimming="CharacterEllipsis"`
			`MaxLines="1" />`
			`</StackPanel>`
			`</Border>`
			`</StackPanel>`
0.2.3 小白板，天气，时钟 2026-03-03 04:56:04 +08:00			`</Grid>`
0.2.6 媒体播放组件，录音组件 2026-03-03 18:26:29 +08:00			`</Grid>`
0.2.3 小白板，天气，时钟 2026-03-03 04:56:04 +08:00			`</Border>`
			`</Grid>`
			`</Border>`
			`</UserControl>`