<?xml version="1.0" encoding="utf-8" ?>
<ContentView xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="TechTitans.Views.Components.EndOfYearRecap.MostPlayedSongScreen"
             xmlns:custom="clr-namespace:TechTitans.Views.Components">
    <VerticalStackLayout>
        <Label  VerticalOptions="Start" 
                HorizontalOptions="Center" 
                FontSize="25"
                Padding="20,40,20,20"
                TextColor="White" >
            <Label.Text>
                <MultiBinding StringFormat="{}{0} by {1} was your top track this year">
                    <Binding Path="MostPlayedSongPercentile.Item1.Name" />
                    <Binding Path="MostPlayedSongPercentile.Item1.Artist" />
                </MultiBinding>
            </Label.Text>
        </Label>
        <Image
            Source="{Binding MostPlayedSongPercentile.Item1.Image}"
            HeightRequest="256"
            Aspect="AspectFit"
            Margin="0,40,0,40"
        />
        <Label Text="{Binding MostPlayedSongPercentile.Item2, StringFormat='You played it a whopping {0:F2}% of the time'}"
                VerticalOptions="Start" 
                HorizontalOptions="Center" 
                FontSize="25"
                Padding="20,40,20,20"
                TextColor="White" 
                VerticalTextAlignment="Center" 
                HorizontalTextAlignment="Center"/>
        <custom:Piechart Progress="{Binding MostPlayedSongPercentile.Item2}"
                    ProgressColor="Red"
                    ProgressLeftColor="LightGreen"
                    Size="140"
                    TextColor="DarkGreen"
                    Thickness="4" 
                    HorizontalOptions="Center"/>
    </VerticalStackLayout>
</ContentView>
