AD_MAUI/AMC.View/Views/AlbumPage.xaml

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:AMC.View"
             xmlns:strings="clr-namespace:AMC.View.Resources.Strings"
             xmlns:conv="clr-namespace:AMC.View.Converters"
             xmlns:vm="clr-namespace:AMC.ViewModel.ViewModels;assembly=AMC.ViewModel"
             x:Class="AMC.View.Views.AlbumPage"
             x:DataType="vm:AlbumViewModel">
    <ContentPage.Resources>
        <ResourceDictionary>
            <conv:SongsInfoConverter x:Key="SongsInfo" />
            <conv:CopyrightInfoConverter x:Key="CopyrightInfo" />
            <conv:AlbumDetailsConverter x:Key="AlbumDetails" />
        </ResourceDictionary>
    </ContentPage.Resources>


    <ScrollView 
        Padding="0, 0, 0, 128"
        BackgroundColor="{AppThemeBinding Light={StaticResource Background}, Dark={StaticResource BackgroundDark}}">
        <Grid Margin="10">
            <Grid.RowDefinitions>
                <RowDefinition Height="300"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="*"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>

            <Border 
                Grid.Row="0"
                Margin="32,0,32,0">
                <Border.StrokeShape>
                    <RoundRectangle CornerRadius="8,8,8,8" />
                </Border.StrokeShape>
                <Image Source="{Binding CoverImage}"
                   Aspect="AspectFill"/>
            </Border>

            <StackLayout Padding="8"
                         Grid.Row="1">
                <Label Text="{Binding Title}" 
                       FontSize="24" 
                       TextColor="{AppThemeBinding Light={StaticResource Primary}, Dark={StaticResource PrimaryDark}}" 
                       HorizontalTextAlignment="Center"/>

                <Label Text="{Binding Artist}" 
                       FontSize="16" 
                       TextColor="{StaticResource Secondary}" 
                       HorizontalTextAlignment="Center" />
            </StackLayout>

            <StackLayout Grid.Row="2">
                <Label Text="{Binding Details, Converter={StaticResource AlbumDetails}}" 
                       FontSize="12" 
                       TextColor="{StaticResource Gray}" 
                       HorizontalTextAlignment="Center"/>

                <Grid Margin="8">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>

                    <Button Text="{x:Static strings:Strings.PlayButton}"
                            Margin="16,16,8,16"
                            Grid.Column="0"/>

                    <Button Text="{x:Static strings:Strings.ShuffleButton}"
                            Margin="8,16,16,16"
                            Grid.Column="1"/>

                </Grid>

            </StackLayout>

            <BoxView HeightRequest="1" 
                     Color="{StaticResource Gray300}"
                     HorizontalOptions="FillAndExpand"
                     Margin="8"
                     Grid.Row="3" />

            <CollectionView ItemsSource="{Binding Songs}"
                            Margin="0,0,0,24"
                            Grid.Row="4">
                <CollectionView.ItemTemplate>
                    <DataTemplate x:DataType="vm:SongViewModel">
                        <StackLayout>
                            <Grid Margin="0,8,0,8">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="32"/>
                                    <ColumnDefinition Width="*"/>
                                    <ColumnDefinition Width="Auto"/>
                                </Grid.ColumnDefinitions>

                                <Label Text="{Binding Index}" 
                                       FontSize="16" 
                                       TextColor="{StaticResource Gray}"
                                       Margin="0,0,8,0"
                                       HorizontalTextAlignment="Center"
                                       HorizontalOptions="Center"
                                       Grid.Column="0"/>

                                <Label Text="{Binding Title}" 
                                       FontSize="16" 
                                       TextColor="{AppThemeBinding Light={StaticResource Primary}, Dark={StaticResource PrimaryDark}}" 
                                       LineBreakMode="TailTruncation" 
                                       Grid.Column="1"/>

                                <Label Text="···" 
                                       FontSize="16" 
                                       TextColor="{AppThemeBinding Light={StaticResource Primary}, Dark={StaticResource PrimaryDark}}" 
                                       FontAttributes="Bold" 
                                       HorizontalOptions="End" 
                                       Margin="0,0,8,0"
                                       Grid.Column="2"/>
                            </Grid>

                            <BoxView HeightRequest="1" 
                                     Color="{StaticResource Gray300}"
                                     HorizontalOptions="FillAndExpand"
                                     Margin="32,0,8,0"/>
                        </StackLayout>
                    </DataTemplate>
                </CollectionView.ItemTemplate>
            </CollectionView>

            <Label Text="{Binding ReleaseDate, StringFormat='{0:d MMMM yyyy}'}"
                   Style="{StaticResource FooterLabel}"
                   Grid.Row="5" />

            <Label Text="{Binding SongsInfo,  Converter={StaticResource SongsInfo}}"
                   Style="{StaticResource FooterLabel}"
                   Grid.Row="6" />

            <Label Text="{Binding CopyrightInfo, Converter={StaticResource CopyrightInfo}}"
                   Style="{StaticResource FooterLabel}"
                   Grid.Row="7" />
        </Grid>
    </ScrollView>
</ContentPage>