Skip to content

Commit

Permalink
Add loading indicators
Browse files Browse the repository at this point in the history
  • Loading branch information
@benruehl
benruehl committed Nov 21, 2018
1 parent 3485a5f commit 7f5de6b
Show file tree
Hide file tree
Showing 9 changed files with 379 additions and 26 deletions.
12 changes: 12 additions & 0 deletions AdonisUI.ClassicTheme/AdonisUI.ClassicTheme.csproj
View file
Original file line number Diff line number Diff line change
Expand Up @@ -169,6 +169,18 @@
<SubType>Designer</SubType>
<Generator>MSBuild:Compile</Generator>
</Page>
<Page Include="Templates\LoadingDots.xaml">
<Generator>MSBuild:Compile</Generator>
<SubType>Designer</SubType>
</Page>
<Page Include="Templates\LoadingBars.xaml">
<Generator>MSBuild:Compile</Generator>
<SubType>Designer</SubType>
</Page>
<Page Include="Templates\LoadingCircle.xaml">
<Generator>MSBuild:Compile</Generator>
<SubType>Designer</SubType>
</Page>
<Page Include="Templates\ValidationErrorTemplate.xaml">
<SubType>Designer</SubType>
<Generator>MSBuild:Compile</Generator>
Expand Down
2 changes: 1 addition & 1 deletion AdonisUI.ClassicTheme/Dimensions.xaml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,6 @@

<CornerRadius x:Key="{x:Static adonisUi:Dimensions.CornerRadius}">0</CornerRadius>

<system:Double x:Key="{x:Static adonisUi:Dimensions.CursorSpotlightRelativeSize}">0.3</system:Double>
<system:Double x:Key="{x:Static adonisUi:Dimensions.CursorSpotlightRelativeSize}">0.75</system:Double>

</ResourceDictionary>
3 changes: 3 additions & 0 deletions AdonisUI.ClassicTheme/Resources.xaml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,9 @@
<ResourceDictionary Source="pack://application:,,,/AdonisUI.ClassicTheme;component/Dimensions.xaml"/>

<ResourceDictionary Source="pack://application:,,,/AdonisUI.ClassicTheme;component/Templates/Icons.xaml"/>
<ResourceDictionary Source="pack://application:,,,/AdonisUI.ClassicTheme;component/Templates/LoadingBars.xaml"/>
<ResourceDictionary Source="pack://application:,,,/AdonisUI.ClassicTheme;component/Templates/LoadingCircle.xaml"/>
<ResourceDictionary Source="pack://application:,,,/AdonisUI.ClassicTheme;component/Templates/LoadingDots.xaml"/>
<ResourceDictionary Source="pack://application:,,,/AdonisUI.ClassicTheme;component/Templates/ValidationErrorTemplate.xaml"/>

<ResourceDictionary Source="pack://application:,,,/AdonisUI.ClassicTheme;component/DefaultStyles/Button.xaml"/>
Expand Down
69 changes: 69 additions & 0 deletions AdonisUI.ClassicTheme/Templates/LoadingBars.xaml
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,69 @@
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:AdonisUI.ClassicTheme.Templates"
xmlns:adonisUi="clr-namespace:AdonisUI;assembly=AdonisUI">

<DataTemplate x:Key="{x:Static adonisUi:Templates.LoadingBars}">
<Grid>
<Viewbox Stretch="Uniform">
<Viewbox.Resources>
<Storyboard x:Key="Animation0" BeginTime="00:00:00.0" Duration="00:00:01.6" RepeatBehavior="Forever">
<DoubleAnimation Storyboard.TargetName="Rectangle0"
Storyboard.TargetProperty="(RenderTransform).(ScaleTransform.ScaleY)"
From="0.6"
To="1"
Duration="00:00:0.4"
AutoReverse="True"/>
</Storyboard>

<Storyboard x:Key="Animation1" BeginTime="00:00:00.2" Duration="00:00:01.6" RepeatBehavior="Forever">
<DoubleAnimation Storyboard.TargetName="Rectangle1"
Storyboard.TargetProperty="(RenderTransform).(ScaleTransform.ScaleY)"
From="0.6"
To="1"
Duration="00:00:0.4"
AutoReverse="True"/>
</Storyboard>

<Storyboard x:Key="Animation2" BeginTime="00:00:00.4" Duration="00:00:01.6" RepeatBehavior="Forever">
<DoubleAnimation Storyboard.TargetName="Rectangle2"
Storyboard.TargetProperty="(RenderTransform).(ScaleTransform.ScaleY)"
From="0.6"
To="1"
Duration="00:00:0.4"
AutoReverse="True"/>
</Storyboard>
</Viewbox.Resources>

<Viewbox.Triggers>
<EventTrigger RoutedEvent="Viewbox.Loaded">
<BeginStoryboard Storyboard="{StaticResource Animation0}" x:Name="Storyboard0" />
<BeginStoryboard Storyboard="{StaticResource Animation1}" x:Name="Storyboard1"/>
<BeginStoryboard Storyboard="{StaticResource Animation2}" x:Name="Storyboard2"/>
</EventTrigger>
</Viewbox.Triggers>

<StackPanel Orientation="Horizontal">
<StackPanel.Resources>
<Style TargetType="Rectangle">
<Setter Property="Width" Value="4"/>
<Setter Property="Height" Value="32" />
<Setter Property="Fill" Value="{Binding Foreground, RelativeSource={RelativeSource FindAncestor, AncestorType=Control}}" />
<Setter Property="RenderTransformOrigin" Value="0.5, 0.5"/>
<Setter Property="RenderTransform">
<Setter.Value>
<ScaleTransform ScaleX="1" ScaleY="0.8"/>
</Setter.Value>
</Setter>
</Style>
</StackPanel.Resources>

<Rectangle x:Name="Rectangle0" />
<Rectangle x:Name="Rectangle1" Margin="3, 0, 0, 0"/>
<Rectangle x:Name="Rectangle2" Margin="3, 0, 0, 0"/>
</StackPanel>
</Viewbox>
</Grid>
</DataTemplate>

</ResourceDictionary>
112 changes: 112 additions & 0 deletions AdonisUI.ClassicTheme/Templates/LoadingCircle.xaml
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,112 @@
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:AdonisUI.ClassicTheme.Templates"
xmlns:adonisUi="clr-namespace:AdonisUI;assembly=AdonisUI">

<DataTemplate x:Key="{x:Static adonisUi:Templates.LoadingCircle}">
<Grid>
<Viewbox Stretch="Uniform">
<Viewbox.Resources>
<Storyboard x:Key="Animation0" BeginTime="00:00:00.0" RepeatBehavior="Forever">
<DoubleAnimation Storyboard.TargetName="Ellipse0"
Storyboard.TargetProperty="Opacity"
From="1"
To="0"
Duration="00:00:01.6"/>
</Storyboard>

<Storyboard x:Key="Animation1" BeginTime="00:00:00.2" RepeatBehavior="Forever">
<DoubleAnimation Storyboard.TargetName="Ellipse1"
Storyboard.TargetProperty="Opacity"
From="1"
To="0"
Duration="00:00:01.6"/>
</Storyboard>

<Storyboard x:Key="Animation2" BeginTime="00:00:00.4" RepeatBehavior="Forever">
<DoubleAnimation Storyboard.TargetName="Ellipse2"
Storyboard.TargetProperty="Opacity"
From="1"
To="0"
Duration="00:00:01.6"/>
</Storyboard>

<Storyboard x:Key="Animation3" BeginTime="00:00:00.6" RepeatBehavior="Forever">
<DoubleAnimation Storyboard.TargetName="Ellipse3"
Storyboard.TargetProperty="Opacity"
From="1"
To="0"
Duration="00:00:01.6"/>
</Storyboard>

<Storyboard x:Key="Animation4" BeginTime="00:00:00.8" RepeatBehavior="Forever">
<DoubleAnimation Storyboard.TargetName="Ellipse4"
Storyboard.TargetProperty="Opacity"
From="1"
To="0"
Duration="00:00:01.6"/>
</Storyboard>

<Storyboard x:Key="Animation5" BeginTime="00:00:01.0" RepeatBehavior="Forever">
<DoubleAnimation Storyboard.TargetName="Ellipse5"
Storyboard.TargetProperty="Opacity"
From="1"
To="0"
Duration="00:00:01.6"/>
</Storyboard>

<Storyboard x:Key="Animation6" BeginTime="00:00:01.2" RepeatBehavior="Forever">
<DoubleAnimation Storyboard.TargetName="Ellipse6"
Storyboard.TargetProperty="Opacity"
From="1"
To="0"
Duration="00:00:01.6"/>
</Storyboard>

<Storyboard x:Key="Animation7" BeginTime="00:00:01.4" RepeatBehavior="Forever">
<DoubleAnimation Storyboard.TargetName="Ellipse7"
Storyboard.TargetProperty="Opacity"
From="1"
To="0"
Duration="00:00:01.6"/>
</Storyboard>
</Viewbox.Resources>

<Viewbox.Triggers>
<EventTrigger RoutedEvent="Viewbox.Loaded">
<BeginStoryboard Storyboard="{StaticResource Animation0}" x:Name="Storyboard0" />
<BeginStoryboard Storyboard="{StaticResource Animation1}" x:Name="Storyboard1"/>
<BeginStoryboard Storyboard="{StaticResource Animation2}" x:Name="Storyboard2"/>
<BeginStoryboard Storyboard="{StaticResource Animation3}" x:Name="Storyboard3"/>
<BeginStoryboard Storyboard="{StaticResource Animation4}" x:Name="Storyboard4"/>
<BeginStoryboard Storyboard="{StaticResource Animation5}" x:Name="Storyboard5"/>
<BeginStoryboard Storyboard="{StaticResource Animation6}" x:Name="Storyboard6"/>
<BeginStoryboard Storyboard="{StaticResource Animation7}" x:Name="Storyboard7"/>
</EventTrigger>
</Viewbox.Triggers>

<Canvas Height="49" Width="48.75">
<Canvas.Resources>
<Style TargetType="Ellipse">
<Setter Property="Width" Value="10"/>
<Setter Property="Height" Value="10" />
<Setter Property="Fill" Value="{Binding Foreground, RelativeSource={RelativeSource FindAncestor, AncestorType=Control}}" />
<Setter Property="Opacity" Value="0" />
</Style>
</Canvas.Resources>

<Ellipse x:Name="Ellipse0" Canvas.Left="0" Canvas.Top="20.25"/>
<Ellipse x:Name="Ellipse1" Canvas.Left="4.75" Canvas.Top="6.25"/>
<Ellipse x:Name="Ellipse2" Canvas.Left="18.75" Canvas.Top="0"/>
<Ellipse x:Name="Ellipse3" Canvas.Left="33" Canvas.Top="6"/>
<Ellipse x:Name="Ellipse4" Canvas.Left="38.75" Canvas.Top="20" />
<Ellipse x:Name="Ellipse5" Canvas.Left="33" Canvas.Top="33.75"/>
<Ellipse x:Name="Ellipse6" Canvas.Left="19" Canvas.Top="39"/>
<Ellipse x:Name="Ellipse7" Canvas.Left="5.25" Canvas.Top="33.5" />
<!--<Ellipse Width="39.5" Height="39.5" Canvas.Left="8.75" Canvas.Top="8" Visibility="Hidden"/>-->
</Canvas>
</Viewbox>
</Grid>
</DataTemplate>

</ResourceDictionary>
118 changes: 118 additions & 0 deletions AdonisUI.ClassicTheme/Templates/LoadingDots.xaml
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,118 @@
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:AdonisUI.ClassicTheme.Templates"
xmlns:adonisUi="clr-namespace:AdonisUI;assembly=AdonisUI">

<DataTemplate x:Key="{x:Static adonisUi:Templates.LoadingDots}">
<Grid>
<Viewbox Stretch="Uniform">
<Viewbox.Resources>
<Storyboard x:Key="Animation0" BeginTime="00:00:00" Duration="00:00:00.8" RepeatBehavior="Forever">
<DoubleAnimation Storyboard.TargetName="Ellipse0Container"
Storyboard.TargetProperty="(RenderTransform).(ScaleTransform.ScaleX)"
From="0"
To="1"
Duration="00:00:0.8"
BeginTime="00:00:0.0"/>
<DoubleAnimation Storyboard.TargetName="Ellipse0Container"
Storyboard.TargetProperty="(RenderTransform).(ScaleTransform.ScaleY)"
From="0"
To="1"
Duration="00:00:0.8"
BeginTime="00:00:0.0"/>
<DoubleAnimation Storyboard.TargetName="Ellipse0"
Storyboard.TargetProperty="(RenderTransform).(TranslateTransform.X)"
From="0"
To="24"
Duration="00:00:0.8"/>
</Storyboard>

<Storyboard x:Key="Animation1" BeginTime="00:00:00" Duration="00:00:00.8" RepeatBehavior="Forever">
<DoubleAnimation Storyboard.TargetName="Ellipse1"
Storyboard.TargetProperty="(RenderTransform).(TranslateTransform.X)"
From="0"
To="24"
Duration="00:00:0.8"/>
</Storyboard>

<Storyboard x:Key="Animation2" BeginTime="00:00:00" Duration="00:00:00.8" RepeatBehavior="Forever">
<DoubleAnimation Storyboard.TargetName="Ellipse2"
Storyboard.TargetProperty="(RenderTransform).(TranslateTransform.X)"
From="0"
To="24"
Duration="00:00:0.8"/>
</Storyboard>

<Storyboard x:Key="Animation3" BeginTime="00:00:00" Duration="00:00:00.8" RepeatBehavior="Forever">
<DoubleAnimation Storyboard.TargetName="Ellipse3"
Storyboard.TargetProperty="(RenderTransform).(TranslateTransform.X)"
From="0"
To="24"
Duration="00:00:0.8"/>
<DoubleAnimation Storyboard.TargetName="Ellipse3Container"
Storyboard.TargetProperty="(RenderTransform).(ScaleTransform.ScaleX)"
From="1"
To="0"
Duration="00:00:0.8"
BeginTime="00:00:0.0"/>
<DoubleAnimation Storyboard.TargetName="Ellipse3Container"
Storyboard.TargetProperty="(RenderTransform).(ScaleTransform.ScaleY)"
From="1"
To="0"
Duration="00:00:0.8"
BeginTime="00:00:0.0"/>
</Storyboard>
</Viewbox.Resources>

<Viewbox.Triggers>
<EventTrigger RoutedEvent="Viewbox.Loaded">
<BeginStoryboard Storyboard="{StaticResource Animation0}" x:Name="Storyboard0" />
<BeginStoryboard Storyboard="{StaticResource Animation1}" x:Name="Storyboard1"/>
<BeginStoryboard Storyboard="{StaticResource Animation2}" x:Name="Storyboard2"/>
<BeginStoryboard Storyboard="{StaticResource Animation3}" x:Name="Storyboard3"/>
</EventTrigger>
</Viewbox.Triggers>

<StackPanel Orientation="Horizontal"
Height="16"
Width="94"
Margin="-22, 0, 0, 0">
<StackPanel.Resources>
<Style TargetType="Ellipse">
<Setter Property="Width" Value="16"/>
<Setter Property="Height" Value="16" />
<Setter Property="Fill" Value="{Binding Foreground, RelativeSource={RelativeSource FindAncestor, AncestorType=Control}}" />
<Setter Property="RenderTransformOrigin" Value="0.5, 0.5"/>
<Setter Property="RenderTransform">
<Setter.Value>
<TranslateTransform X="0" Y="0"/>
</Setter.Value>
</Setter>
</Style>
</StackPanel.Resources>

<Grid x:Name="Ellipse0Container" RenderTransformOrigin="2, 0.5">
<Grid.RenderTransform>
<ScaleTransform ScaleX="0" ScaleY="0"/>
</Grid.RenderTransform>

<Ellipse x:Name="Ellipse0"/>
</Grid>

<Ellipse x:Name="Ellipse1" Margin="8, 0, 0, 0"/>
<Ellipse x:Name="Ellipse2" Margin="8, 0, 0, 0"/>

<Grid x:Name="Ellipse3Container" Margin="8, 0, 0, 0" RenderTransformOrigin="1, 0.5">
<Grid.RenderTransform>
<ScaleTransform ScaleX="1" ScaleY="1"/>
</Grid.RenderTransform>

<Ellipse x:Name="Ellipse3"/>
</Grid>

</StackPanel>
</Viewbox>
</Grid>
</DataTemplate>

</ResourceDictionary>
2 changes: 2 additions & 0 deletions AdonisUI.Demo/MainWindow.xaml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -85,12 +85,14 @@

<Button Content="Change Theme"
Style="{DynamicResource {x:Static adonisUi:Styles.ToolbarButton}}"
BorderThickness="0"
Click="ChangeTheme"
HorizontalAlignment="Stretch"
Padding="8"/>

<Button Content="Check Issues"
Style="{DynamicResource {x:Static adonisUi:Styles.ToolbarButton}}"
BorderThickness="0"
Click="OpenIssueDialog"
HorizontalAlignment="Stretch"
Padding="8"/>
Expand Down
Loading

0 comments on commit 7f5de6b

Please sign in to comment.