radial progressbar

This commit is contained in:
Rene Schwarz
2021-04-14 00:53:57 +02:00
parent cf7b9abcf0
commit e220c09ec3
61 changed files with 2449 additions and 262 deletions

View File

@@ -0,0 +1,287 @@
<Window x:Class="Server_Dashboard.Views.DashboardPages.ModuleCRUD.CreateModulePopup"
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"
xmlns:local="clr-namespace:Server_Dashboard.Views.DashboardPages.ModuleCRUD"
xmlns:root="clr-namespace:Server_Dashboard"
d:DataContext="{d:DesignInstance Type=root:DashboardModuleViewModel}"
mc:Ignorable="d"
WindowStyle="None"
ResizeMode="NoResize"
Height="450"
Width="300"
AllowsTransparency="True"
>
<Border
Width="300"
Height="450"
>
<Border.Background>
<SolidColorBrush Color="#2D2D2D" Opacity="1"/>
</Border.Background>
<Border.Effect>
<DropShadowEffect Direction="0" BlurRadius="5" ShadowDepth="0"/>
</Border.Effect>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="30"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid
Background="{StaticResource BackgroundSurface_04dp}"
Grid.Row="0"
>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition Width="40"/>
</Grid.ColumnDefinitions>
<TextBlock
Grid.Column="0"
Text="Create a new Server"
Margin="5 0 0 0"
Foreground="{StaticResource DeepPurple_200}"
/>
<Button
Style="{StaticResource CloseButton}"
Grid.Column="2"
Content="✕"
Command="{Binding ClosePopupCommand}"
/>
</Grid>
<Grid
Background="{StaticResource BackgroundSurface_04dp}"
Grid.Row="1"
Margin="20"
>
<Grid.Effect>
<DropShadowEffect Direction="0" BlurRadius="5" ShadowDepth="0"/>
</Grid.Effect>
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<StackPanel VerticalAlignment="Center" Grid.Row="0" Margin="20 0 20 0">
<StackPanel Orientation="Horizontal">
<TextBlock
Text="Server Name"
FontSize="16"
Margin="0 0 0 5"
>
<TextBlock.Foreground>
<SolidColorBrush Color="White" Opacity="0.87"/>
</TextBlock.Foreground>
</TextBlock>
<TextBlock
Text="*"
Foreground="{StaticResource ErrorRed}"
FontSize="16"
/>
</StackPanel>
<Grid>
<Grid.Effect>
<DropShadowEffect Direction="0" BlurRadius="5" ShadowDepth="0"/>
</Grid.Effect>
<TextBox
Text="{Binding ServerName}"
Grid.Column="1"
Height="30"
FontSize="14"
x:Name="ServerName"
/>
<TextBlock
VerticalAlignment="Center"
HorizontalAlignment="Left"
Text="My Awesome Server"
FontSize="14"
Visibility="{Binding ElementName=ServerName, Path=Text.IsEmpty, Converter={StaticResource UserNameVisibillity}}"
Grid.Column="1"
IsHitTestVisible="False"
Margin="5 0 0 0"
>
<TextBlock.Foreground>
<SolidColorBrush Color="White" Opacity="0.12"/>
</TextBlock.Foreground>
</TextBlock>
</Grid>
</StackPanel>
<StackPanel VerticalAlignment="Center" Grid.Row="1" Margin="20 0 20 0">
<StackPanel Orientation="Horizontal">
<TextBlock
Text="Password"
FontSize="16"
Margin="0 0 0 5"
>
<TextBlock.Foreground>
<SolidColorBrush Color="White" Opacity="0.87"/>
</TextBlock.Foreground>
</TextBlock>
<TextBlock
Text="*"
Foreground="{StaticResource ErrorRed}"
FontSize="16"
/>
</StackPanel>
<Grid>
<Grid.Effect>
<DropShadowEffect Direction="0" BlurRadius="5" ShadowDepth="0"/>
</Grid.Effect>
<PasswordBox
Width="220"
VerticalAlignment="Center"
HorizontalAlignment="Left"
root:MonitorPasswordProperty.Value="True"
Grid.Column="1"
FontSize="14"
x:Name="Password"
Height="30"
>
</PasswordBox>
<TextBlock
Visibility="{Binding ElementName=Password, Path=(root:HasTextProperty.Value), Converter={StaticResource UserNameVisibillity}}" x:Name="PasswordHint"
Text="********"
Grid.Column="1"
IsHitTestVisible="False"
VerticalAlignment="Center"
HorizontalAlignment="Left"
Margin="5 0 0 0"
FontSize="14"
>
<TextBlock.Foreground>
<SolidColorBrush Color="White" Opacity="0.12"/>
</TextBlock.Foreground>
</TextBlock>
</Grid>
</StackPanel>
<StackPanel VerticalAlignment="Center" Grid.Row="2" Margin="20 0 20 0">
<StackPanel Orientation="Horizontal">
<TextBlock
Text="Username"
FontSize="16"
Margin="0 0 0 5"
>
<TextBlock.Foreground>
<SolidColorBrush Color="White" Opacity="0.87"/>
</TextBlock.Foreground>
</TextBlock>
<TextBlock
Text="*"
Foreground="{StaticResource ErrorRed}"
FontSize="16"
/>
</StackPanel>
<Grid>
<Grid.Effect>
<DropShadowEffect Direction="0" BlurRadius="5" ShadowDepth="0"/>
</Grid.Effect>
<TextBox
Text="{Binding Username}"
Grid.Column="1"
Height="30"
FontSize="14"
x:Name="UserName"
/>
<TextBlock
VerticalAlignment="Center"
HorizontalAlignment="Left"
Text="Name"
FontSize="14"
Visibility="{Binding ElementName=UserName, Path=Text.IsEmpty, Converter={StaticResource UserNameVisibillity}}"
Grid.Column="1"
IsHitTestVisible="False"
Margin="5 0 0 0"
>
<TextBlock.Foreground>
<SolidColorBrush Color="White" Opacity="0.12"/>
</TextBlock.Foreground>
</TextBlock>
</Grid>
</StackPanel>
<StackPanel VerticalAlignment="Center" Grid.Row="3" Margin="20 0 20 0">
<StackPanel Orientation="Horizontal">
<TextBlock
Text="IP Adress"
FontSize="16"
Margin="0 0 0 5"
>
<TextBlock.Foreground>
<SolidColorBrush Color="White" Opacity="0.87"/>
</TextBlock.Foreground>
</TextBlock>
<TextBlock
Text="*"
Foreground="{StaticResource ErrorRed}"
FontSize="16"
/>
</StackPanel>
<Grid>
<Grid.Effect>
<DropShadowEffect Direction="0" BlurRadius="5" ShadowDepth="0"/>
</Grid.Effect>
<TextBox
Text="{Binding IPAdress}"
Grid.Column="1"
Height="30"
FontSize="14"
x:Name="IPAdress"
/>
<TextBlock
VerticalAlignment="Center"
HorizontalAlignment="Left"
Text="sample.ssh.com"
FontSize="14"
Visibility="{Binding ElementName=IPAdress, Path=Text.IsEmpty, Converter={StaticResource UserNameVisibillity}}"
Grid.Column="1"
IsHitTestVisible="False"
Margin="5 0 0 0"
>
<TextBlock.Foreground>
<SolidColorBrush Color="White" Opacity="0.12"/>
</TextBlock.Foreground>
</TextBlock>
</Grid>
</StackPanel>
<StackPanel VerticalAlignment="Center" Grid.Row="4" Margin="20 0 20 0">
<TextBlock
Text="Port"
FontSize="16"
Margin="0 0 0 5"
>
<TextBlock.Foreground>
<SolidColorBrush Color="White" Opacity="0.87"/>
</TextBlock.Foreground>
</TextBlock>
<Grid>
<Grid.Effect>
<DropShadowEffect Direction="0" BlurRadius="5" ShadowDepth="0"/>
</Grid.Effect>
<TextBox
Text="{Binding Port}"
Grid.Column="1"
Height="30"
FontSize="14"
x:Name="Port"
/>
<TextBlock
VerticalAlignment="Center"
HorizontalAlignment="Left"
Text="22"
FontSize="14"
Visibility="{Binding ElementName=Port, Path=Text.IsEmpty, Converter={StaticResource UserNameVisibillity}}"
Grid.Column="1"
IsHitTestVisible="False"
Margin="5 0 0 0"
>
<TextBlock.Foreground>
<SolidColorBrush Color="White" Opacity="0.12"/>
</TextBlock.Foreground>
</TextBlock>
</Grid>
</StackPanel>
</Grid>
</Grid>
</Border>
</Window>

View File

@@ -0,0 +1,13 @@
using System.Windows.Controls;
using System.Windows;
namespace Server_Dashboard.Views.DashboardPages.ModuleCRUD {
/// <summary>
/// Interaktionslogik für CreateModulePopup.xaml
/// </summary>
public partial class CreateModulePopup : Window {
public CreateModulePopup() {
InitializeComponent();
}
}
}

View File

@@ -0,0 +1,19 @@
<UserControl x:Class="Server_Dashboard.Controls.ProgressBar.HalfRoundProgressbar"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:Server_Dashboard.Controls.ProgressBar"
xmlns:ed="http://schemas.microsoft.com/expression/2010/drawing"
xmlns:root="clr-namespace:Server_Dashboard"
mc:Ignorable="d"
d:DesignHeight="200" d:DesignWidth="200">
<UserControl.Resources>
<local:ValueToAngle x:Key="valueToAngle"/>
</UserControl.Resources>
<Grid>
<Ellipse x:Name="Background" Fill="{Binding ElementName=_this, Path=BackgroundBrush}" Margin="0" Stroke="Blue"/>
<ed:Arc x:Name="Indicator" ArcThickness="8" ArcThicknessUnit="Pixel" EndAngle="{Binding Converter={StaticResource valueToAngle}, ElementName=_this, Path=Value}" Fill="{Binding ElementName=_this, Path=IndicatorBrush}" Stretch="None" StartAngle="0"/>
<Ellipse x:Name="Border" Fill="{Binding ElementName=_this, Path=ProgressBorderBrush}" Margin="8" Stroke="Blue"/>
</Grid>
</UserControl>

View File

@@ -0,0 +1,75 @@
using System;
using System.Collections.Generic;
using System.Globalization;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
namespace Server_Dashboard.Controls.ProgressBar {
/// <summary>
/// Interaktionslogik für HalfRoundProgressbar.xaml
/// </summary>
public partial class HalfRoundProgressbar : UserControl {
public static readonly DependencyProperty IndicatorBrushProperty = DependencyProperty.Register("IndicatorBrush", typeof(Brush), typeof(HalfRoundProgressbar));
public Brush IndicatorBrush {
get{
return (Brush)this.GetValue(IndicatorBrushProperty);
}
set{
this.SetValue(IndicatorBrushProperty, value);
}
}
public static readonly DependencyProperty BackgroundBrushProperty = DependencyProperty.Register("BackgroundBrush", typeof(Brush), typeof(HalfRoundProgressbar));
public Brush BackgroundBrush {
get {
return (Brush)this.GetValue(BackgroundBrushProperty);
}
set {
this.SetValue(BackgroundBrushProperty, value);
}
}
public static readonly DependencyProperty ProgressBorderBrushProperty = DependencyProperty.Register("ProgressBorderBrush", typeof(Brush), typeof(HalfRoundProgressbar));
public Brush ProgressBorderBrush {
get {
return (Brush)this.GetValue(ProgressBorderBrushProperty);
}
set {
this.SetValue(ProgressBorderBrushProperty, value);
}
}
public static readonly DependencyProperty ValueProperty = DependencyProperty.Register("Value", typeof(int), typeof(HalfRoundProgressbar));
public int Value {
get {
return (int)this.GetValue(ValueProperty);
}
set {
this.SetValue(ValueProperty, value);
}
}
public HalfRoundProgressbar() {
InitializeComponent();
}
}
[ValueConversion(typeof(int), typeof(double))]
public class ValueToAngle : IValueConverter {
public object Convert(object value, Type targetType, object parameter, CultureInfo culture) {
return (double)(((int)value * 0.01) * 360);
}
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) {
return (int)((double)value / 360) * 100;
}
}
}

View File

@@ -4,8 +4,9 @@
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:Server_Dashboard.Controls.ServerModules"
xmlns:progressbar="clr-namespace:Server_Dashboard.Controls.ProgressBar"
mc:Ignorable="d">
<Border MinHeight="100" MinWidth="300" Width="Auto" Height="Auto" Margin="20">
<Border Background="{StaticResource BackgroundSurface_02dp}" MinHeight="100" MinWidth="300" Width="Auto" Height="Auto" Margin="10">
<Border.Effect>
<DropShadowEffect BlurRadius="5" ShadowDepth="0"/>
</Border.Effect>
@@ -17,7 +18,6 @@
<Border
Grid.Row="0"
Background="{StaticResource BackgroundSurface_08dp}"
CornerRadius="12 12 0 0"
>
<Grid>
<Grid.ColumnDefinitions>
@@ -27,26 +27,55 @@
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<Image Grid.Column="0" Margin="7.5 0 7.5 0" Height="25" Width="25" Source="{Binding ModuleIcon}"/>
<TextBlock Grid.Column="1" HorizontalAlignment="Left" Text="{Binding ModulName}"/>
<Border Background="{Binding StatusIndicator}" Grid.Column="3" CornerRadius="0 11 0 0">
<TextBlock Grid.Column="1" VerticalAlignment="Center" HorizontalAlignment="Left" Text="{Binding ModulName}"/>
<Border Background="{Binding StatusIndicator}" Grid.Column="3">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<TextBlock Margin="7 0 30 0" VerticalAlignment="Center" HorizontalAlignment="Left" Grid.Column="0" Foreground="{StaticResource White}" FontSize="20" Text="Status"/>
<Border Grid.Column="1" CornerRadius="0 11 0 0" HorizontalAlignment="Right" Background="{Binding StatusIndicatorBG}" Padding="6">
<Border Grid.Column="1" HorizontalAlignment="Right" Background="{Binding StatusIndicatorBG}" Padding="6">
<Ellipse Fill="{Binding StatusIndicator}" StrokeThickness="0" Width="25" Height="25"/>
</Border>
</Grid>
</Border>
</Grid>
</Border>
<Grid Grid.Row="2" Background="{StaticResource BackgroundSurface_02dp}">
<Grid Grid.Row="2" Margin="10" Width="Auto">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1.5*"/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<TextBlock Grid.Row="1" Text="Hostname" FontSize="14" Margin="2 2 5 2"/>
<TextBlock Grid.Row="2" Text="User" FontSize="14" Margin="2 2 5 2"/>
<TextBlock Grid.Row="3" Text="Public IP" FontSize="14" Margin="2 2 5 2"/>
<TextBlock Grid.Row="4" Text="Private IP" FontSize="14" Margin="2 2 5 2"/>
<TextBlock Grid.Row="1" Grid.Column="1" Text="{Binding ServerInfo.HostName}" FontSize="14" Margin="5 2 2 2"/>
<TextBlock Grid.Row="2" Grid.Column="1" Text="{Binding ServerInfo.OSHostName}" FontSize="14" Margin="5 2 2 2"/>
<TextBlock Grid.Row="3" Grid.Column="1" Text="{Binding ServerInfo.PublicIpAdress}" FontSize="14" Margin="5 2 2 2"/>
<TextBlock Grid.Row="4" Grid.Column="1" Text="{Binding ServerInfo.PrivateIpAdress}" FontSize="14" Margin="5 2 2 2"/>
</Grid>
<Grid Grid.Column="1">
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<progressbar:HalfRoundProgressbar Height="50" Width="50" x:Name="prgess" Value="180" IndicatorBrush="Blue" Foreground="Black"/>
</Grid>
</Grid>
</Grid>
</Border>