<?xml version="1.0" encoding="utf-8" ?>
<ui:BillingPage xmlns="http://xamarin.com/schemas/2014/forms"
                xmlns:r="clr-namespace:Billing.Languages"
                xmlns:ui="clr-namespace:Billing.UI"
                xmlns:v="clr-namespace:Billing.Views"
                xmlns:chart="clr-namespace:Microcharts.Forms;assembly=Microcharts.Forms"
                xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                x:Class="Billing.Views.RankPage"
                x:Name="rankPage"
                x:DataType="v:RankPage"
                BindingContext="{x:Reference rankPage}"
                Shell.TabBarIsVisible="True">

    <Shell.TitleView>
        <Grid>
            <StackLayout Margin="30, 0, 0, 0" HorizontalOptions="Center" VerticalOptions="Center"
                         Orientation="Horizontal" Spacing="10">
                <ui:TintImageButton Source="calendar.png" WidthRequest="20" HeightRequest="20"
                                    VerticalOptions="Center" HorizontalOptions="Start"
                                    Command="{Binding LeftCommand}"/>
                <Label Text="{Binding Title}"
                       TextColor="{DynamicResource PrimaryColor}"
                       FontSize="{OnPlatform Android=20, iOS=18}">
                    <Label.FontFamily>
                        <OnPlatform x:TypeArguments="x:String"
                                    Android="OpenSans-SemiBold.ttf#OpenSans-SemiBold"
                                    iOS="OpenSans-Bold"/>
                    </Label.FontFamily>
                </Label>
                <ui:TintImageButton Source="right.png" WidthRequest="20" HeightRequest="20"
                                    VerticalOptions="Center" HorizontalOptions="End"
                                    Command="{Binding RightCommand}"/>
            </StackLayout>
        </Grid>
    </Shell.TitleView>

    <ContentPage.ToolbarItems>
        <ToolbarItem Order="Primary" IconImageSource="plus.png" Command="{Binding FilterCommand}"/>
    </ContentPage.ToolbarItems>

    <ScrollView>
        <StackLayout>
            <chart:ChartView HeightRequest="240" Chart="{Binding Chart}"/>
        </StackLayout>
    </ScrollView>
</ui:BillingPage>