add line chart to send ux.
MODIFY
WalletWasabi.Fluent/ViewModels/Wallets/Send/SendViewModel.cs
WalletWasabi.Fluent/ViewModels/Wallets/Send/SendViewModel.cs
+using System.Collections.Generic;
using WalletWasabi.Fluent.ViewModels.NavBar;
namespace WalletWasabi.Fluent.ViewModels.Wallets.Send
@@ -18,6 +19,54 @@ namespace WalletWasabi.Fluent.ViewModels.Wallets.Send
}
+ public double XAxisCurrentValue { get; set; } = 36;
+
+ public double XAxisMinValue { get; set; } = 1;
+
+ public double XAxisMaxValue { get; set; } = 1008;
+
+ public List<string> XAxisLabels => new List<string>()
+ {
+ "1w",
+ "3d",
+ "1d",
+ "12h",
+ "6h",
+ "3h",
+ "1h",
+ "30m",
+ "20m",
+ "fastest"
+ };
+
+ public List<double> XAxisValues => new List<double>()
+ {
+ 1008,
+ 432,
+ 144,
+ 72,
+ 36,
+ 18,
+ 6,
+ 3,
+ 2,
+ 1,
+ };
+
+ public List<double> YAxisValues => new List<double>()
+ {
+ 4,
+ 4,
+ 7,
+ 22,
+ 57,
+ 97,
+ 102,
+ 123,
+ 123,
+ 185
+ };
+
}
}
\ No newline at end of file

MODIFY
WalletWasabi.Fluent/Views/Wallets/Send/SendView.axaml
WalletWasabi.Fluent/Views/Wallets/Send/SendView.axaml
x:DataType="vm:SendViewModel"
x:CompileBindings="True"
x:Class="WalletWasabi.Fluent.Views.Wallets.Send.SendView">
+ <UserControl.Styles>
+ <!-- Slider Fee -->
+ <Style Selector="Slider.cursor">
+ <Setter Property="RenderTransform">
+ <RotateTransform Angle="-180"></RotateTransform>
+ </Setter>
+ </Style>
+ <Style Selector="Slider.cursor /template/ RepeatButton#PART_IncreaseButton">
+ <Setter Property="Background" Value="{DynamicResource SliderTrackValueFill}" />
+ </Style>
+ <Style Selector="Slider:pressed.cursor /template/ RepeatButton#PART_IncreaseButton">
+ <Setter Property="Background" Value="{DynamicResource SliderTrackValueFillPressed}" />
+ </Style>
+ <Style Selector="Slider:pointerover.cursor /template/ RepeatButton#PART_IncreaseButton">
+ <Setter Property="Background" Value="{DynamicResource SliderTrackValueFillPointerOver}" />
+ </Style>
+ <Style Selector="Slider.cursor /template/ RepeatButton#PART_DecreaseButton">
+ <Setter Property="Background" Value="{DynamicResource SliderTrackFill}" />
+ </Style>
+ <Style Selector="Slider:pressed.cursor /template/ RepeatButton#PART_DecreaseButton">
+ <Setter Property="Background" Value="{DynamicResource SliderTrackFillPressed}" />
+ </Style>
+ <Style Selector="Slider:pointerover.cursor /template/ RepeatButton#PART_DecreaseButton">
+ <Setter Property="Background" Value="{DynamicResource SliderTrackFillPointerOver}" />
+ </Style>
+ <Style Selector="Slider:horizontal.cursor">
+ <Setter Property="Background" Value="{DynamicResource SliderTrackFill}" />
+ </Style>
+ <!-- LineChart Labels -->
+ <Style Selector="c|LineChart.xAxisLabels">
+ <Setter Property="XAxisLabelForeground" Value="{DynamicResource TextForegroundColor}" />
+ <Setter Property="XAxisLabelOpacity" Value="0.5" />
+ <Setter Property="XAxisLabelAngle" Value="0" />
+ <Setter Property="XAxisLabelOffset" Value="0,10" />
+ <Setter Property="XAxisLabelSize" Value="50,30" />
+ <Setter Property="XAxisLabelAlignment" Value="Center" />
+ <Setter Property="XAxisLabelFontFamily" Value="Arial" />
+ <Setter Property="XAxisLabelFontStyle" Value="Normal" />
+ <Setter Property="XAxisLabelFontWeight" Value="Normal" />
+ <Setter Property="XAxisLabelFontSize" Value="10" />
+ </Style>
+ <!-- LineChart Cursor -->
+ <Style Selector="c|LineChart.cursor">
+ <Setter Property="CursorStroke" Value="#72BD81" />
+ <Setter Property="CursorStrokeThickness" Value="2" />
+ <!-- <Setter Property="CursorStrokeDashStyle" Value="{x:Static DashStyle.Dash}" /> -->
+ <Setter Property="CursorStrokeLineCap" Value="Round" />
+ </Style>
+ <!-- LineChart XAxis -->
+ <Style Selector="c|LineChart.xAxis">
+ <Setter Property="XAxisOffset" Value="0,0" />
+ <Setter Property="XAxisOpacity" Value="0.5" />
+ <Setter Property="XAxisStroke" Value="{DynamicResource TextForegroundColor}" />
+ <Setter Property="XAxisStrokeThickness" Value="0.7" />
+ <Setter Property="XAxisArrowSize" Value="3.5" />
+ </Style>
+ <!-- LineChart YAxis -->
+ <Style Selector="c|LineChart.yAxis">
+ <Setter Property="YAxisOffset" Value="-10,-115" />
+ <Setter Property="YAxisOpacity" Value="0.5" />
+ <Setter Property="YAxisStroke" Value="{DynamicResource TextForegroundColor}" />
+ <Setter Property="YAxisStrokeThickness" Value="0.7" />
+ <Setter Property="YAxisArrowSize" Value="3.5" />
+ </Style>
+ <!-- LineChart YAxis Title -->
+ <Style Selector="c|LineChart.yAxisTitle">
+ <Setter Property="YAxisTitleForeground" Value="{DynamicResource TextForegroundColor}" />
+ <Setter Property="YAxisTitleOpacity" Value="0.5" />
+ <Setter Property="YAxisTitleAngle" Value="-90" />
+ <Setter Property="YAxisTitleOffset" Value="-55,-75" />
+ <Setter Property="YAxisTitleSize" Value="90,20" />
+ <Setter Property="YAxisTitleAlignment" Value="Center" />
+ <Setter Property="YAxisTitleFontFamily" Value="Arial" />
+ <Setter Property="YAxisTitleFontStyle" Value="Normal" />
+ <Setter Property="YAxisTitleFontWeight" Value="Normal" />
+ <Setter Property="YAxisTitleFontSize" Value="12" />
+ </Style>
+ <!-- LineChart Border -->
+ <Style Selector="c|LineChart.border">
+ <Setter Property="BorderBrush" Value="Transparent" />
+ <Setter Property="BorderThickness" Value="1" />
+ <Setter Property="BorderRadiusX" Value="4" />
+ <Setter Property="BorderRadiusY" Value="4" />
+ </Style>
+ </UserControl.Styles>
<c:ContentArea Title="Send" Caption=""
EnableCancel="True"
ScrollViewer.VerticalScrollBarVisibility="Disabled">
RestrictInputToSuggestions="True" />
</DockPanel>
- <DockPanel>
- <Label DockPanel.Dock="Left" Content="_Priority:" Target="PrioritySlider" />
- <Slider x:Name="PrioritySlider" Minimum="0" Maximum="100" Value="100" />
+ <DockPanel HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
+ <Slider x:Name="CursorValue2"
+ DockPanel.Dock="Bottom"
+ Classes="cursor"
+ Minimum="{Binding #GradientLineChart.XAxisMinValue}"
+ Maximum="{Binding #GradientLineChart.XAxisMaxValue}"
+ Value="{Binding #GradientLineChart.XAxisCurrentValue}"
+ Margin="20,0,20,0"/>
+ <c:LineChart x:Name="GradientLineChart"
+ Classes="cursor border xAxisLabels yAxis yAxisTitle"
+ MinWidth="300" MinHeight="200"
+ XAxisLabels="{Binding XAxisLabels}"
+ XAxisValues="{Binding XAxisValues}"
+ XAxisCurrentValue="{Binding XAxisCurrentValue}"
+ XAxisMinValue="{Binding XAxisMinValue}"
+ XAxisMaxValue="{Binding XAxisMaxValue}"
+ YAxisValues="{Binding YAxisValues}"
+ YAxisLogarithmicScale="False"
+ AreaMargin="30,40,30,30"
+ AreaStrokeThickness="2"
+ AreaStrokeLineCap="Round"
+ YAxisTitle="More Expensive">
+ <c:LineChart.AreaFill>
+ <LinearGradientBrush StartPoint="50%,0%" EndPoint="50%,100%" Opacity="0.2">
+ <LinearGradientBrush.GradientStops>
+ <GradientStop Offset="0.0" Color="#FF72BD81"/>
+ <GradientStop Offset="1.0" Color="#0072BD81"/>
+ </LinearGradientBrush.GradientStops>
+ </LinearGradientBrush>
+ </c:LineChart.AreaFill>
+ <c:LineChart.AreaStroke>
+ <LinearGradientBrush StartPoint="0%,50%" EndPoint="100%,50%">
+ <LinearGradientBrush.GradientStops>
+ <GradientStop Offset="0.0" Color="#72BD81"/>
+ <GradientStop Offset="1.0" Color="#72BD81"/>
+ </LinearGradientBrush.GradientStops>
+ </LinearGradientBrush>
+ </c:LineChart.AreaStroke>
+ </c:LineChart>
</DockPanel>
</StackPanel>
</c:ContentArea>

add line chart to send ux.