add widget preview for ringchart/coin privacy tile
MODIFY
WalletWasabi.Fluent/Controls/RingChartControl.cs
WalletWasabi.Fluent/Controls/RingChartControl.cs
@@ -13,15 +13,14 @@ namespace WalletWasabi.Fluent.Controls
{
static RingChartControl()
{
- AffectsRender<RingChartControl>(DataPointsProperty, RadiusProperty, ThicknessProperty, StartAngleProperty, EndAngleProperty);
- AffectsMeasure<RingChartControl>(DataPointsProperty, RadiusProperty, ThicknessProperty, StartAngleProperty, EndAngleProperty);
+ AffectsRender<RingChartControl>(DataPointsProperty, ThicknessProperty, StartAngleProperty,
+ EndAngleProperty);
+ AffectsMeasure<RingChartControl>(DataPointsProperty, ThicknessProperty, StartAngleProperty,
+ EndAngleProperty);
}
- public static readonly StyledProperty<IList<(IBrush, double)>> DataPointsProperty =
- AvaloniaProperty.Register<RingChartControl, IList<(IBrush, double)>>("DataPoints");
-
- public static readonly StyledProperty<double> RadiusProperty =
- AvaloniaProperty.Register<RingChartControl, double>("Radius", 60);
+ public static readonly StyledProperty<IList<(string ColorHex, double PercentShare)>> DataPointsProperty =
+ AvaloniaProperty.Register<RingChartControl, IList<(string ColorHex, double PercentShare)>>("DataPoints");
public static readonly StyledProperty<double> StartAngleProperty =
AvaloniaProperty.Register<RingChartControl, double>("StartAngle", 0);
@@ -32,7 +31,7 @@ namespace WalletWasabi.Fluent.Controls
public static readonly StyledProperty<double> ThicknessProperty =
AvaloniaProperty.Register<RingChartControl, double>("Thickness", 6);
- public IList<(IBrush color, double value)> DataPoints
+ public IList<(string ColorHex, double PercentShare)> DataPoints
{
get => GetValue(DataPointsProperty);
set => SetValue(DataPointsProperty, value);
@@ -45,7 +44,9 @@ namespace WalletWasabi.Fluent.Controls
protected override Size MeasureOverride(Size availableSize)
{
- return new ((Radius * 2) + Thickness, (Radius * 2) + Thickness);
+ Radius = (Math.Min(availableSize.Height, availableSize.Width) / 2) - Thickness;
+ var s = new Size((Radius * 2) + Thickness, (Radius * 2) + Thickness);
+ return s;
}
private Geometry GetArcGeometry(double startAngle, double endAngle, bool isPathClosed = false)
@@ -99,11 +100,7 @@ namespace WalletWasabi.Fluent.Controls
return (Math.PI / 180d) * angle;
}
- public double Radius
- {
- get => GetValue(RadiusProperty);
- set => SetValue(RadiusProperty, value);
- }
+ private double Radius { get; set; }
public double StartAngle
{
@@ -130,20 +127,22 @@ namespace WalletWasabi.Fluent.Controls
return;
}
- var total = DataPoints.Sum(x => x.value);
+ var total = DataPoints.Sum(x => x.PercentShare);
if (total <= 1.0)
{
var lastAngle = StartAngle;
var lastData = 0d;
- foreach (var dataPoint in DataPoints.OrderBy(x => x.value))
+ foreach (var dataPoint in DataPoints.OrderBy(x => x.PercentShare))
{
- lastData += dataPoint.value;
- var curValue = Map((dataPoint.value == 1.0 ? 0.99 : lastData), 0, 1, StartAngle, EndAngle);
+ var brush = new ImmutableSolidColorBrush(Color.Parse(dataPoint.ColorHex));
+
+ lastData += dataPoint.PercentShare;
+ var curValue = Map((dataPoint.PercentShare == 1.0 ? 0.99 : lastData), 0, 1, StartAngle, EndAngle);
- context.DrawGeometry(null, new ImmutablePen(dataPoint.color, Thickness),
- GetArcGeometry(lastAngle, curValue, (dataPoint.value == 1.0d)));
+ context.DrawGeometry(null, new ImmutablePen(brush, Thickness),
+ GetArcGeometry(lastAngle, curValue, (dataPoint.PercentShare == 1.0d)));
lastAngle = curValue;
}

ADD
WalletWasabi.Fluent/Converters/ColorStringConverters.cs
+using Avalonia.Data.Converters;
+using Avalonia.Media;
+using Avalonia.Media.Immutable;
+
+namespace WalletWasabi.Fluent.Converters
+{
+ public static class ColorStringConverters
+ {
+ public static readonly IValueConverter HexColorToBrush =
+ new FuncValueConverter<string?, IBrush>(x => x switch
+ {
+ null => Brushes.Magenta,
+ { } => new ImmutableSolidColorBrush(Color.Parse(x))
+ });
+ }
+}
\ No newline at end of file

MODIFY
WalletWasabi.Fluent/ViewModels/Wallets/WalletViewModel.cs
WalletWasabi.Fluent/ViewModels/Wallets/WalletViewModel.cs
@@ -2,6 +2,7 @@ using NBitcoin;
using ReactiveUI;
using Splat;
using System;
+using System.Collections.Generic;
using System.Reactive;
using System.Reactive.Disposables;
using System.Reactive.Linq;
@@ -14,8 +15,27 @@ using WalletWasabi.Wallets;
namespace WalletWasabi.Fluent.ViewModels.Wallets
{
+ public readonly struct DataLegend
+ {
+ public DataLegend(Money amount, string label, string hexColor, double percentShare)
+ {
+ Amount = amount;
+ Label = label;
+ HexColor = hexColor;
+ PercentShare = percentShare;
+ }
+
+ public Money Amount { get; }
+ public string Label { get; }
+ public string HexColor { get; }
+ public double PercentShare { get; }
+ }
+
public partial class WalletViewModel : WalletViewModelBase
{
+ [AutoNotify] private IList<(string color, double percentShare)> _testDataPoints;
+ [AutoNotify] private IList<DataLegend> _testDataPointsLegend;
+
protected WalletViewModel(UiConfig uiConfig, Wallet wallet) : base(wallet)
{
Disposables = Disposables is null ? new CompositeDisposable() : throw new NotSupportedException($"Cannot open {GetType().Name} before closing it.");
@@ -42,6 +62,18 @@ namespace WalletWasabi.Fluent.ViewModels.Wallets
}
})
.DisposeWith(Disposables);
+
+ TestDataPoints = new List<(string, double)>()
+ {
+ ("#72BD81", 0.8d),
+ ("#F9DE7D", 0.2d)
+ };
+
+ TestDataPointsLegend = new List<DataLegend>
+ {
+ new (Money.Parse("0.77508"),"Private", "#F9DE7D", 0.2 ),
+ new (Money.Parse("3.10032"),"Not Private", "#72BD81", 0.8)
+ };
}
private CompositeDisposable Disposables { get; set; }

MODIFY
WalletWasabi.Fluent/Views/Wallets/WalletView.axaml
WalletWasabi.Fluent/Views/Wallets/WalletView.axaml
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:controls="clr-namespace:WalletWasabi.Fluent.Controls"
xmlns:wallets="clr-namespace:WalletWasabi.Fluent.ViewModels.Wallets"
+ xmlns:converters="clr-namespace:WalletWasabi.Fluent.Converters"
mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
x:DataType="wallets:WalletViewModel"
x:CompileBindings="True"
x:Class="WalletWasabi.Fluent.Views.Wallets.WalletView">
- <controls:ContentArea Title="{Binding Title}"
- Caption="Wallet Home Page, currently under construction." />
+ <Panel>
+ <Panel Width="228" Height="260" VerticalAlignment="Center" HorizontalAlignment="Center">
+ <Border CornerRadius="4" Background="#2B2B2B" Padding="16">
+ <DockPanel LastChildFill="True" TextBlock.FontSize="11">
+
+ <StackPanel DockPanel.Dock="Top">
+ <TextBlock>Coin Privacy</TextBlock>
+ <TextBlock Opacity="0.5">in Percentage %</TextBlock>
+ </StackPanel>
+
+ <ItemsRepeater DockPanel.Dock="Bottom" Margin="0,0,0,-8" Items="{Binding TestDataPointsLegend}">
+ <ItemsRepeater.ItemTemplate>
+ <DataTemplate x:DataType="wallets:DataLegend">
+ <DockPanel Margin="0,8">
+ <Ellipse DockPanel.Dock="Left" Margin="0,0,8,0" HorizontalAlignment="Left" Width="10" Height="10" Fill="{Binding HexColor, Converter={x:Static converters:ColorStringConverters.HexColorToBrush}}" />
+ <TextBlock DockPanel.Dock="Left" HorizontalAlignment="Left" Text="{Binding Amount, Converter={x:Static converters:MoneyConverters.MoneyToString}}" />
+ <TextBlock DockPanel.Dock="Right" Margin="8,0,0,0" HorizontalAlignment="Right" Text="{Binding PercentShare, StringFormat=\{0:P1\}}" />
+ <TextBlock DockPanel.Dock="Right" HorizontalAlignment="Right" Text="{Binding Label}" />
+ </DockPanel>
+ </DataTemplate>
+ </ItemsRepeater.ItemTemplate>
+ <ItemsRepeater.Layout>
+ <StackLayout></StackLayout>
+ </ItemsRepeater.Layout>
+ </ItemsRepeater>
+
+ <Panel Margin="8" VerticalAlignment="Center" HorizontalAlignment="Center">
+ <controls:RingChartControl DataPoints="{Binding TestDataPoints}" />
+ </Panel>
+ </DockPanel>
+ </Border>
+ </Panel>
+ </Panel>
</UserControl>
\ No newline at end of file

add widget preview for ringchart/coin privacy tile