<Page
    x:Class="SubCabinetSolution.Views.InventoryPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    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"
    Title="InventoryPage"
    d:DesignHeight="450"
    d:DesignWidth="800"
    Background="White"
    DataContext="{Binding InventoryPage, Source={StaticResource Locator}}"
    mc:Ignorable="d">

    <Page.Resources>
        <Style x:Key="TextBlockStyle" TargetType="TextBlock">
            <Setter Property="FontSize" Value="30" />
            <Setter Property="FontWeight" Value="Bold" />
            <Setter Property="Foreground" Value="{StaticResource MainThemeColor}" />
            <Setter Property="FontFamily" Value="微软雅黑" />
            <Setter Property="TextAlignment" Value="Center" />
        </Style>
    </Page.Resources>
    <Grid Background="White">
        <Grid.Resources>
            <Style x:Key="ellipse" TargetType="Ellipse">
                <Setter Property="Width" Value="15" />
                <Setter Property="Height" Value="15" />
                <Setter Property="Canvas.Left" Value="142.5" />
                <Setter Property="Fill" Value="{StaticResource MainThemeColor}" />
                <Setter Property="RenderTransformOrigin" Value="0.5,10" />
            </Style>

            <PowerEase
                x:Key="powerease"
                EasingMode="EaseInOut"
                Power="3" />
        </Grid.Resources>

        <Canvas Width="300" Height="300">
            <Canvas.Triggers>
                <EventTrigger RoutedEvent="Loaded">
                    <BeginStoryboard>
                        <Storyboard RepeatBehavior="Forever" Storyboard.TargetProperty="(UIElement.RenderTransform).(RotateTransform.Angle)">
                            <DoubleAnimation
                                AccelerationRatio="0.1"
                                DecelerationRatio="0.9"
                                EasingFunction="{StaticResource powerease}"
                                Storyboard.TargetName="e1"
                                To="360"
                                Duration="0:0:2" />
                            <DoubleAnimation
                                AccelerationRatio="0.3"
                                DecelerationRatio="0.7"
                                EasingFunction="{StaticResource powerease}"
                                Storyboard.TargetName="e2"
                                To="360"
                                Duration="0:0:2" />
                            <DoubleAnimation
                                AccelerationRatio="0.5"
                                DecelerationRatio="0.5"
                                EasingFunction="{StaticResource powerease}"
                                Storyboard.TargetName="e3"
                                To="360"
                                Duration="0:0:2" />
                            <DoubleAnimation
                                AccelerationRatio="0.7"
                                DecelerationRatio="0.3"
                                EasingFunction="{StaticResource powerease}"
                                Storyboard.TargetName="e4"
                                To="360"
                                Duration="0:0:2" />
                            <DoubleAnimation
                                AccelerationRatio="0.9"
                                DecelerationRatio="0.1"
                                EasingFunction="{StaticResource powerease}"
                                Storyboard.TargetName="e5"
                                To="360"
                                Duration="0:0:2" />
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
            </Canvas.Triggers>

            <!--  背景  -->
            <Ellipse
                Width="300"
                Height="300"
                Fill="#f2f4f6" />

            <Ellipse Name="e1" Style="{StaticResource ellipse}">
                <Ellipse.RenderTransform>
                    <RotateTransform Angle="0" />
                </Ellipse.RenderTransform>
            </Ellipse>
            <Ellipse Name="e2" Style="{StaticResource ellipse}">
                <Ellipse.RenderTransform>
                    <RotateTransform Angle="0" />
                </Ellipse.RenderTransform>
            </Ellipse>
            <Ellipse Name="e3" Style="{StaticResource ellipse}">
                <Ellipse.RenderTransform>
                    <RotateTransform Angle="0" />
                </Ellipse.RenderTransform>
            </Ellipse>
            <Ellipse Name="e4" Style="{StaticResource ellipse}">
                <Ellipse.RenderTransform>
                    <RotateTransform Angle="0" />
                </Ellipse.RenderTransform>
            </Ellipse>
            <Ellipse Name="e5" Style="{StaticResource ellipse}">
                <Ellipse.RenderTransform>
                    <RotateTransform Angle="0" />
                </Ellipse.RenderTransform>
            </Ellipse>
        </Canvas>

        <StackPanel
            HorizontalAlignment="Center"
            VerticalAlignment="Center"
            Orientation="Vertical">
            <TextBlock Style="{StaticResource TextBlockStyle}" Text="RFID" />
            <TextBlock Style="{StaticResource TextBlockStyle}" Text="读取中" />
        </StackPanel>
    </Grid>
</Page>