Skip to content

Commit 437e9f0

Browse files
subash-sfsubash-sf
committed
added ui customization
1 parent 69066b2 commit 437e9f0

File tree

3 files changed

+67
-31
lines changed

3 files changed

+67
-31
lines changed

‎SfChartMultipleTrackball/SfChartMultipleTrackball/MainWindow.xaml‎

Lines changed: 64 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -10,46 +10,88 @@
1010

1111
<Grid>
1212

13-
<chart:SfChart x:Name="chart" Header="Server CPU load by Day">
13+
<chart:SfChart x:Name="chart">
1414

15-
<chart:SfChart.PrimaryAxis>
16-
<chart:CategoryAxis ShowTrackBallInfo="True"/>
17-
</chart:SfChart.PrimaryAxis>
18-
19-
<chart:SfChart.SecondaryAxis>
20-
<chart:NumericalAxis ShowTrackBallInfo="True" Minimum="0" Maximum="100"/>
21-
</chart:SfChart.SecondaryAxis>
15+
<chart:SfChart.Header>
16+
<TextBlock FontSize="24" Text="Server CPU load by Day" FontWeight="DemiBold" Margin="5"/>
17+
</chart:SfChart.Header>
2218

2319
<chart:SfChart.Resources>
20+
<DataTemplate x:Key="labelTemplate">
21+
<Border CornerRadius="3" Background="CornflowerBlue" Opacity="0.9" Margin="10" Height="40" Width="70">
22+
<TextBlock Foreground="White" Text="{Binding Path=ValueY, StringFormat='{}{0}%'}" FontSize="20" VerticalAlignment="Center" HorizontalAlignment="Center"/>
23+
</Border>
24+
</DataTemplate>
25+
26+
<DataTemplate x:Key="axisLabelTemplate">
27+
<Border CornerRadius="10" Background="CornflowerBlue" Height="35" Width="130">
28+
<TextBlock Foreground="White" Text="{Binding Path=ValueX}" FontSize="20" VerticalAlignment="Center" HorizontalAlignment="Center"/>
29+
</Border>
30+
</DataTemplate>
31+
2432
<Style TargetType="chart:ChartTrackBallControl" x:Key="trackballStyle1">
25-
<Setter Property="Background" Value="GreenYellow"/>
26-
<Setter Property="Height" Value="10"/>
27-
<Setter Property="Width" Value="10"/>
33+
<Setter Property="Background" Value="PaleGreen"/>
34+
<Setter Property="StrokeThickness" Value="2"/>
35+
<Setter Property="Height" Value="15"/>
36+
<Setter Property="Width" Value="15"/>
2837
</Style>
2938
<Style TargetType="Line" x:Key="lineStyle1">
30-
<Setter Property="Stroke" Value="Black"/>
31-
<Setter Property="StrokeThickness" Value="1.5"/>
39+
<Setter Property="Stroke" Value="SlateGray"/>
40+
<Setter Property="StrokeThickness" Value="2.5"/>
3241
</Style>
3342

3443
<Style TargetType="chart:ChartTrackBallControl" x:Key="trackballStyle2">
35-
<Setter Property="Background" Value="Orange"/>
36-
<Setter Property="Height" Value="10"/>
37-
<Setter Property="Width" Value="10"/>
44+
<Setter Property="Background" Value="Yellow"/>
45+
<Setter Property="StrokeThickness" Value="2"/>
46+
<Setter Property="Height" Value="15"/>
47+
<Setter Property="Width" Value="15"/>
3848
</Style>
3949
<Style TargetType="Line" x:Key="lineStyle2">
40-
<Setter Property="Stroke" Value="Black"/>
41-
<Setter Property="StrokeThickness" Value="1.5"/>
50+
<Setter Property="Stroke" Value="DarkSlateGray"/>
51+
<Setter Property="StrokeThickness" Value="2.5"/>
4252
</Style>
4353
</chart:SfChart.Resources>
4454

55+
<chart:SfChart.PrimaryAxis>
56+
<chart:CategoryAxis ShowGridLines="False"
57+
ShowTrackBallInfo="True"
58+
TrackBallLabelTemplate="{StaticResource axisLabelTemplate}">
59+
<chart:CategoryAxis.LabelStyle>
60+
<chart:LabelStyle FontSize="18" FontFamily="Verdana"/>
61+
</chart:CategoryAxis.LabelStyle>
62+
</chart:CategoryAxis>
63+
</chart:SfChart.PrimaryAxis>
64+
65+
<chart:SfChart.SecondaryAxis>
66+
<chart:NumericalAxis Minimum="0"
67+
Maximum="100"
68+
Interval="20"
69+
ShowTrackBallInfo="True">
70+
<chart:NumericalAxis.LabelStyle>
71+
<chart:LabelStyle FontSize="18" FontFamily="Verdana"/>
72+
</chart:NumericalAxis.LabelStyle>
73+
</chart:NumericalAxis>
74+
</chart:SfChart.SecondaryAxis>
75+
4576
<chart:SfChart.Behaviors>
46-
<local:ChartTrackBallBehaviorExt x:Name="trackball1" ChartTrackBallStyle="{StaticResource trackballStyle1}" UseSeriesPalette="True" LineStyle="{StaticResource lineStyle1}"/>
47-
<local:ChartTrackBallBehaviorExt x:Name="trackball2" ChartTrackBallStyle="{StaticResource trackballStyle2}" UseSeriesPalette="True" LineStyle="{StaticResource lineStyle2}"/>
77+
<local:ChartTrackBallBehaviorExt x:Name="trackball1"
78+
ChartTrackBallStyle="{StaticResource trackballStyle1}"
79+
LineStyle="{StaticResource lineStyle1}">
80+
</local:ChartTrackBallBehaviorExt>
81+
<local:ChartTrackBallBehaviorExt x:Name="trackball2"
82+
ChartTrackBallStyle="{StaticResource trackballStyle2}"
83+
LineStyle="{StaticResource lineStyle2}">
84+
</local:ChartTrackBallBehaviorExt>
4885
</chart:SfChart.Behaviors>
4986

50-
<chart:LineSeries ItemsSource="{Binding Data}" XBindingPath="Day" YBindingPath="CPULoad" StrokeThickness="3" Interior="OrangeRed">
87+
<chart:LineSeries ItemsSource="{Binding Data}"
88+
XBindingPath="Day"
89+
YBindingPath="CPULoad"
90+
StrokeThickness="3.5"
91+
Interior="OrangeRed"
92+
TrackBallLabelTemplate="{StaticResource labelTemplate}">
5193
<chart:LineSeries.AdornmentsInfo>
52-
<chart:ChartAdornmentInfo Symbol="Ellipse" SymbolInterior="White" SymbolStroke="OrangeRed"/>
94+
<chart:ChartAdornmentInfo Symbol="Ellipse" SymbolInterior="White" SymbolStroke="OrangeRed" SymbolHeight="15" SymbolWidth="15"/>
5395
</chart:LineSeries.AdornmentsInfo>
5496
</chart:LineSeries>
5597

‎SfChartMultipleTrackball/SfChartMultipleTrackball/Model/Model.cs‎

Lines changed: 1 addition & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,4 @@
1-
using System;
2-
using System.Collections.Generic;
3-
using System.Linq;
4-
using System.Text;
5-
using System.Threading.Tasks;
6-
7-
namespace SfChartMultipleTrackball
1+
namespace SfChartMultipleTrackball
82
{
93
public class Model
104
{

‎SfChartMultipleTrackball/SfChartMultipleTrackball/ViewModel/ViewModel.cs‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,8 +10,8 @@ public ViewModel()
1010
{
1111
new Model { Day = "Monday", CPULoad = 35 },
1212
new Model { Day = "Tuesday", CPULoad = 42 },
13-
new Model { Day = "Wednesday", CPULoad = 18 },
14-
new Model { Day = "Thursday", CPULoad = 30 },
13+
new Model { Day = "Wednesday", CPULoad = 28 },
14+
new Model { Day = "Thursday", CPULoad = 40 },
1515
new Model { Day = "Friday", CPULoad = 64 },
1616
new Model { Day = "Saturday", CPULoad = 22 },
1717
new Model { Day = "Sunday", CPULoad = 10 }

0 commit comments

Comments
 (0)