feat: add StatsBar component

This commit is contained in:
k0t9i 2023-01-30 19:33:48 +04:00
parent 35e3f5e487
commit 57d6a61791
5 changed files with 211 additions and 79 deletions

View File

@ -0,0 +1,14 @@
<UserControl x:Class="Client.Application.Components.StatsBar"
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:Client.Application.Components"
x:Name="root"
mc:Ignorable="d">
<Grid>
<Image Stretch="Fill" Source="{Binding BackgroundSource,ElementName=root,Mode=OneWay}" />
<Image Stretch="Fill" Source="{Binding ForegroundSource,ElementName=root,Mode=OneWay}" Width="{Binding ForegroundWidth,ElementName=root,Mode=OneWay}" HorizontalAlignment="Left" />
<TextBlock Text="{Binding Text,ElementName=root,Mode=OneWay}" Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Center" />
</Grid>
</UserControl>

View File

@ -0,0 +1,128 @@
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
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.Shapes;
namespace Client.Application.Components
{
public partial class StatsBar : UserControl
{
public static readonly DependencyProperty BackgroundSourceProperty =
DependencyProperty.Register("BackgroundSource", typeof(ImageSource), typeof(StatsBar), new PropertyMetadata(default(ImageSource)));
public static readonly DependencyProperty ForegroundSourceProperty =
DependencyProperty.Register("ForegroundSource", typeof(ImageSource), typeof(StatsBar), new PropertyMetadata(default(ImageSource)));
public static readonly DependencyProperty CurrentProperty =
DependencyProperty.Register("Current", typeof(double), typeof(StatsBar), new PropertyMetadata(0.0, OnDataChanged));
public static readonly DependencyProperty TotalProperty =
DependencyProperty.Register("Total", typeof(double), typeof(StatsBar), new PropertyMetadata(0.0, OnDataChanged));
public static readonly DependencyProperty FormatProperty =
DependencyProperty.Register("Format", typeof(string), typeof(StatsBar), new PropertyMetadata("{0}/{1}", OnFormatChanged));
public static readonly DependencyProperty ForegroundWidthProperty =
DependencyProperty.Register("ForegroundWidth", typeof(double), typeof(StatsBar), new PropertyMetadata(0.0, null, OnCoerceForegroundWidth));
public static readonly DependencyProperty TextProperty =
DependencyProperty.Register("Text", typeof(string), typeof(StatsBar), new PropertyMetadata("", null, OnCoerceText));
private static void OnDataChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
var model = (StatsBar)d;
model.CoerceValue(ForegroundWidthProperty);
model.CoerceValue(TextProperty);
}
private static void OnFormatChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
var model = (StatsBar)d;
model.CoerceValue(TextProperty);
}
private static object OnCoerceForegroundWidth(DependencyObject d, object baseValue)
{
var model = (StatsBar)d;
var actualWidth = (double)model.GetValue(ActualWidthProperty);
return actualWidth / 100 * model.GetPercent();
}
private static object OnCoerceText(DependencyObject d, object baseValue)
{
var model = (StatsBar)d;
return string.Format(model.Format, model.Current, model.Total, model.GetPercent());
}
public StatsBar()
{
InitializeComponent();
}
public override void OnApplyTemplate()
{
SizeChanged += StatsBar_SizeChanged;
}
private void StatsBar_SizeChanged(object sender, SizeChangedEventArgs e)
{
if (e.WidthChanged)
{
var model = (StatsBar)sender;
model.CoerceValue(ForegroundWidthProperty);
}
}
private double GetPercent()
{
var percent = Current;
if (Total > 0)
{
percent = Current / Total * 100;
}
return percent;
}
public ImageSource BackgroundSource
{
get { return (ImageSource)GetValue(BackgroundSourceProperty); }
set { SetValue(BackgroundSourceProperty, value); }
}
public ImageSource ForegroundSource
{
get { return (ImageSource)GetValue(ForegroundSourceProperty); }
set { SetValue(ForegroundSourceProperty, value); }
}
public double ForegroundWidth
{
get { return (double)GetValue(ForegroundWidthProperty); }
set { SetValue(ForegroundWidthProperty, value); }
}
public double Current
{
get { return (double)GetValue(CurrentProperty); }
set { SetValue(CurrentProperty, value); }
}
public double Total
{
get { return (double)GetValue(TotalProperty); }
set { SetValue(TotalProperty, value); }
}
public string Text
{
get { return (string)GetValue(TextProperty); }
set { SetValue(TextProperty, value); }
}
public string Format
{
get { return (string)GetValue(FormatProperty); }
set { SetValue(FormatProperty, value); }
}
}
}

View File

@ -0,0 +1,40 @@
<StackPanel x:Class="Client.Application.Components.StatsPanel"
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:Client.Application.Components"
mc:Ignorable="d">
<local:StatsBar
BackgroundSource="/Assets/icons/ps_cpbar_back.png"
ForegroundSource="/Assets/icons/ps_cpbar.png"
Current="{Binding VitalStats.Cp}"
Total="{Binding VitalStats.MaxCp}"
Height="15"
Margin="0 0 0 2"
/>
<local:StatsBar
BackgroundSource="/Assets/icons/ps_hpbar_back.png"
ForegroundSource="/Assets/icons/ps_hpbar.png"
Current="{Binding VitalStats.Hp}"
Total="{Binding VitalStats.MaxHp}"
Height="15"
Margin="0 0 0 2"
/>
<local:StatsBar
BackgroundSource="/Assets/icons/ps_mpbar_back.png"
ForegroundSource="/Assets/icons/ps_mpbar.png"
Current="{Binding VitalStats.Mp}"
Total="{Binding VitalStats.MaxMp}"
Height="15"
Margin="0 0 0 2"
/>
<local:StatsBar
BackgroundSource="/Assets/icons/ps_expbar_back.png"
ForegroundSource="/Assets/icons/ps_expbar.png"
Current="{Binding Experience.ExpPercent}"
Format="{}{0:F2}%"
Height="15"
Margin="0 0 0 2"
/>
</StackPanel>

View File

@ -0,0 +1,27 @@
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
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.Shapes;
namespace Client.Application.Components
{
/// <summary>
/// Interaction logic for StatsPanel.xaml
/// </summary>
public partial class StatsPanel : StackPanel
{
public StatsPanel()
{
InitializeComponent();
}
}
}

View File

@ -6,6 +6,7 @@
xmlns:local="clr-namespace:Client" xmlns:local="clr-namespace:Client"
xmlns:scm="clr-namespace:System.ComponentModel;assembly=WindowsBase" xmlns:scm="clr-namespace:System.ComponentModel;assembly=WindowsBase"
xmlns:converters="clr-namespace:Client.Application.Converters" xmlns:converters="clr-namespace:Client.Application.Converters"
xmlns:components="clr-namespace:Client.Application.Components"
mc:Ignorable="d" mc:Ignorable="d"
Title="MainWindow" Height="600" Width="1024"> Title="MainWindow" Height="600" Width="1024">
<Window.Resources> <Window.Resources>
@ -19,7 +20,6 @@
<scm:SortDescription PropertyName="Distance" Direction="Ascending" /> <scm:SortDescription PropertyName="Distance" Direction="Ascending" />
</CollectionViewSource.SortDescriptions> </CollectionViewSource.SortDescriptions>
</CollectionViewSource> </CollectionViewSource>
<converters:PercentWidthConverter x:Key="PercentWidthConverter"/>
</Window.Resources> </Window.Resources>
<Grid> <Grid>
<Grid.ColumnDefinitions> <Grid.ColumnDefinitions>
@ -109,84 +109,7 @@
</TextBlock.Text> </TextBlock.Text>
</TextBlock> </TextBlock>
</StackPanel> </StackPanel>
<StackPanel x:Name="statsPanel"> <components:StatsPanel DataContext="{Binding .}" />
<Grid Height="15" Margin="0 0 0 2">
<Image Stretch="Fill" Source="/Assets/icons/ps_cpbar_back.png"></Image>
<Image Stretch="Fill" Source="/Assets/icons/ps_cpbar.png" HorizontalAlignment="Left">
<Image.Width>
<MultiBinding Converter="{StaticResource PercentWidthConverter}">
<Binding Path="VitalStats.CpPercent"/>
<Binding Path="ActualWidth" ElementName="statsPanel"/>
</MultiBinding>
</Image.Width>
</Image>
<TextBlock Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Center">
<TextBlock.Text>
<MultiBinding StringFormat="{}{0}/{1}">
<Binding Path="VitalStats.Cp"/>
<Binding Path="VitalStats.MaxCp"/>
</MultiBinding>
</TextBlock.Text>
</TextBlock>
</Grid>
<Grid Height="15" Margin="0 0 0 2">
<Image Stretch="Fill" Source="/Assets/icons/ps_hpbar_back.png"></Image>
<Image Stretch="Fill" Source="/Assets/icons/ps_hpbar.png" HorizontalAlignment="Left">
<Image.Width>
<MultiBinding Converter="{StaticResource PercentWidthConverter}">
<Binding Path="VitalStats.HpPercent"/>
<Binding Path="ActualWidth" ElementName="statsPanel"/>
</MultiBinding>
</Image.Width>
</Image>
<TextBlock Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Center">
<TextBlock.Text>
<MultiBinding StringFormat="{}{0}/{1}">
<Binding Path="VitalStats.Hp"/>
<Binding Path="VitalStats.MaxHp"/>
</MultiBinding>
</TextBlock.Text>
</TextBlock>
</Grid>
<Grid Height="15" Margin="0 0 0 2">
<Image Stretch="Fill" Source="/Assets/icons/ps_mpbar_back.png"></Image>
<Image Stretch="Fill" Source="/Assets/icons/ps_mpbar.png" HorizontalAlignment="Left">
<Image.Width>
<MultiBinding Converter="{StaticResource PercentWidthConverter}">
<Binding Path="VitalStats.MpPercent"/>
<Binding Path="ActualWidth" ElementName="statsPanel"/>
</MultiBinding>
</Image.Width>
</Image>
<TextBlock Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Center">
<TextBlock.Text>
<MultiBinding StringFormat="{}{0}/{1}">
<Binding Path="VitalStats.Mp"/>
<Binding Path="VitalStats.MaxMp"/>
</MultiBinding>
</TextBlock.Text>
</TextBlock>
</Grid>
<Grid Height="15">
<Grid.ColumnDefinitions></Grid.ColumnDefinitions>
<Image Stretch="Fill" Source="/Assets/icons/ps_expbar_back.png"></Image>
<Image Stretch="Fill" Source="/Assets/icons/ps_expbar.png" HorizontalAlignment="Left">
<Image.Width>
<MultiBinding Converter="{StaticResource PercentWidthConverter}">
<Binding Path="Experience.ExpPercent"/>
<Binding Path="ActualWidth" ElementName="statsPanel"/>
</MultiBinding>
</Image.Width>
</Image>
<TextBlock Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Center">
<TextBlock.Text>
<MultiBinding StringFormat="{}{0:F2}%">
<Binding Path="Experience.ExpPercent"/>
</MultiBinding>
</TextBlock.Text>
</TextBlock>
</Grid>
</StackPanel>
<DockPanel> <DockPanel>
<StackPanel DockPanel.Dock="Left" Margin="0 0 5 0"> <StackPanel DockPanel.Dock="Left" Margin="0 0 5 0">
<TextBlock Padding="0 0 0 3">Position:</TextBlock> <TextBlock Padding="0 0 0 3">Position:</TextBlock>