|
| 1 | +<?xml version="1.0" encoding="utf-8" ?> |
| 2 | +<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui" |
| 3 | + xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" |
| 4 | + xmlns:gauge="clr-namespace:Syncfusion.Maui.Gauges;assembly=Syncfusion.Maui.Gauges" |
| 5 | + xmlns:local="clr-namespace:BulletChartSample" |
| 6 | + x:Class="BulletChartSample.MainPage"> |
| 7 | + |
| 8 | + <ContentPage.BindingContext> |
| 9 | + <local:ViewModel/> |
| 10 | + </ContentPage.BindingContext> |
| 11 | + |
| 12 | + <Border StrokeShape="RoundRectangle 10" Stroke="Black" Margin="10" Padding="{OnPlatform Android=5, Default=10, iOS=5}"> |
| 13 | + |
| 14 | + <Grid> |
| 15 | + <Grid.RowDefinitions> |
| 16 | + <RowDefinition Height="Auto"/> |
| 17 | + <RowDefinition Height="*"/> |
| 18 | + </Grid.RowDefinitions> |
| 19 | + |
| 20 | + <Grid Grid.Row="0" Margin="10"> |
| 21 | + <Grid.RowDefinitions> |
| 22 | + <RowDefinition Height="{OnPlatform Android=68,Default=80,iOS=68}"/> |
| 23 | + </Grid.RowDefinitions> |
| 24 | + <Grid.ColumnDefinitions> |
| 25 | + <ColumnDefinition Width="{OnPlatform Android=20, Default=40, iOS=15}"/> |
| 26 | + <ColumnDefinition Width="Auto"/> |
| 27 | + </Grid.ColumnDefinitions> |
| 28 | + <BoxView Grid.Column="0" Grid.RowSpan="2" BackgroundColor="Blue" Margin="0,-20,0,0" HeightRequest="45" WidthRequest="20" /> |
| 29 | + <StackLayout Grid.Column="1" Grid.Row="0" Margin="7,7,0,0"> |
| 30 | + <Label Text="Comparative Analysis of Product Performance" FontSize="{OnPlatform Android=15,Default=18,iOS=15}" FontAttributes="Bold"/> |
| 31 | + <Label Text="{OnPlatform Default='Evaluation of Key Performance Metrics and Competitive Benchmarking Across Market Competitors.', Android='Evaluating Key Performance Metrics and Competitive Industry Benchmarks.', iOS='Evaluating Performance Metrics and Industry Benchmarks.'}" FontSize="{OnPlatform Android=10,Default=13,iOS=10}" Margin="0,2,0,0"/> |
| 32 | + </StackLayout> |
| 33 | + </Grid> |
| 34 | + |
| 35 | + <Grid Grid.Row="1"> |
| 36 | + <VerticalStackLayout BindableLayout.ItemsSource="{Binding BulletChartData}" x:Name="layout" Spacing="{OnPlatform Default=70, WinUI=40, Android=40}"> |
| 37 | + <BindableLayout.ItemTemplate> |
| 38 | + <DataTemplate> |
| 39 | + <gauge:SfLinearGauge Interval="40" Maximum="240" Orientation="Horizontal" MinorTicksPerInterval="0" ShowLine="False" TickOffset="{OnPlatform Android=30, Default=25, iOS=15}" ShowLabels="{Binding IsAxisVisible}" ShowTicks="{Binding IsAxisVisible}"> |
| 40 | + |
| 41 | + <gauge:SfLinearGauge.MajorTickStyle> |
| 42 | + <gauge:LinearTickStyle Stroke="Black"/> |
| 43 | + </gauge:SfLinearGauge.MajorTickStyle> |
| 44 | + |
| 45 | + <gauge:SfLinearGauge.Ranges> |
| 46 | + <gauge:LinearRange EndValue="{Binding LowRange}" |
| 47 | + StartWidth="{OnPlatform Android=60, Default=50, iOS=30}" |
| 48 | + EndWidth="{OnPlatform Android=60, Default=50, iOS=30}" |
| 49 | + Position="Cross" Fill="#668ae6"/> |
| 50 | + |
| 51 | + <gauge:LinearRange StartValue="{Binding LowRange}" |
| 52 | + EndValue="{Binding MidRange}" |
| 53 | + StartWidth="{OnPlatform Android=60, Default=50, iOS=30}" |
| 54 | + EndWidth="{OnPlatform Android=60, Default=50, iOS=30}" |
| 55 | + Fill="#a6bfe6" |
| 56 | + Position="Cross" /> |
| 57 | + |
| 58 | + <gauge:LinearRange StartValue="{Binding MidRange}" |
| 59 | + EndValue="{Binding HighRange}" |
| 60 | + StartWidth="{OnPlatform Android=60, Default=50, iOS=30}" |
| 61 | + EndWidth="{OnPlatform Android=60, Default=50, iOS=30}" |
| 62 | + Fill="#d9e0ff" |
| 63 | + Position="Cross" /> |
| 64 | + </gauge:SfLinearGauge.Ranges> |
| 65 | + |
| 66 | + <gauge:SfLinearGauge.BarPointers> |
| 67 | + <gauge:BarPointer Value="{Binding ObservedValue}" |
| 68 | + PointerSize="{OnPlatform Android=8, Default=8, iOS=6}" |
| 69 | + Fill="#003bcc"/> |
| 70 | + </gauge:SfLinearGauge.BarPointers> |
| 71 | + |
| 72 | + <gauge:SfLinearGauge.MarkerPointers> |
| 73 | + |
| 74 | + <gauge:LinearShapePointer ShapeType="Rectangle" |
| 75 | + Value="{Binding TargetValue}" |
| 76 | + Fill="#003f5c" |
| 77 | + ShapeWidth="{OnPlatform Android=2, Default=4, iOS=2}" |
| 78 | + ShapeHeight="{OnPlatform Android=40, Default=30}" |
| 79 | + Position="Cross"/> |
| 80 | + |
| 81 | + <gauge:LinearContentPointer Value="{OnPlatform Android=4, iOS=5, Default=0}" |
| 82 | + OffsetX="{OnPlatform Android=-10, iOS=-10, Default=-15}" |
| 83 | + OffsetY="{OnPlatform Android=10, iOS=10, Default=10}" |
| 84 | + Alignment="{OnPlatform Android=Start, iOS=Start, Default=Start}"> |
| 85 | + <gauge:LinearContentPointer.Content> |
| 86 | + <Label Text="{Binding BindingContext.Category}"/> |
| 87 | + </gauge:LinearContentPointer.Content> |
| 88 | + </gauge:LinearContentPointer> |
| 89 | + |
| 90 | + </gauge:SfLinearGauge.MarkerPointers> |
| 91 | + </gauge:SfLinearGauge> |
| 92 | + </DataTemplate> |
| 93 | + </BindableLayout.ItemTemplate> |
| 94 | + </VerticalStackLayout> |
| 95 | + </Grid> |
| 96 | + </Grid> |
| 97 | + |
| 98 | + </Border> |
| 99 | + |
| 100 | +</ContentPage> |
0 commit comments