Can't use GraphicsView - Githubissues

Hi I'm trying to make a simple GraphicsView like you did, but when I run the app it throws System.Reflection.TargetInvocationException My code:

WaveformGraphicsView

public class WaveformGraphicsView : GraphicsView
{
    public string Path { get => (string)GetValue(PathProperty); set => SetValue(PathProperty, value); }
    public static readonly BindableProperty PathProperty = BindableProperty.Create(nameof(Path), typeof(Path), typeof(WaveformGraphicsView), string.Empty, propertyChanged: PathPropertyChanged);

    public static void PathPropertyChanged(BindableObject bindable, object oldValue, object newValue)
    {
        if (bindable is not WaveformGraphicsView { Drawable: WaveformDrawable drawable } view)
        {
            return;
        }

        drawable.Path = newValue as string;
        view.Invalidate();
    }
}

WaveformDrawable

public class WaveformDrawable : IDrawable
{
    public string Path { get; set; }
    public void Draw(ICanvas canvas, RectF dirtyRect)
    {
        //var reader = new AudioFileReader(Path);
        canvas.StrokeColor = Colors.Red;
        canvas.StrokeSize = 4;
        canvas.DrawEllipse(10, 10, 100, 50);
    }
}

MainPage.xaml

<?xml version="1.0" encoding="utf-8"?>

<ContentPage
    x:Class="AudioButtons.MainPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:components="clr-namespace:CA.Maui.Components;assembly=CA.Maui"
    xmlns:converters="clr-namespace:AudioButtons.Converters"
    xmlns:font="clr-namespace:AudioButtons.FontModels"
    xmlns:models="clr-namespace:AudioButtons.Models"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
    xmlns:viewModels="clr-namespace:AudioButtons.ViewModels"
    Title="{Binding Title}"
    x:DataType="viewModels:ButtonsViewModel"
    NavigatedTo="MainPage_OnNavigatedTo">

    <Page.Behaviors>
        <toolkit:StatusBarBehavior StatusBarColor="{StaticResource Primary}" StatusBarStyle="LightContent" />
    </Page.Behaviors>

    <ContentPage.Resources>
        <ResourceDictionary>
            <converters:RgbToStringConverter x:Key="RgbStringToColorConverter" />
            <converters:TextColorConverter x:Key="TextColorConverter" />

            <Style
                x:Key="FontAwesomeIcon"
                ApplyToDerivedTypes="True"
                TargetType="Label">
                <Setter Property="FontFamily" Value="FaSolid" />
                <Setter Property="HorizontalTextAlignment" Value="Center" />
                <Setter Property="VerticalTextAlignment" Value="Center" />
                <Setter Property="FontSize" Value="20" />
                <Setter Property="TextColor" Value="{StaticResource White}" />
                <Setter Property="Margin" Value="5" />
            </Style>

            <Style ApplyToDerivedTypes="True" TargetType="ContentPage">
                <Setter Property="BackgroundColor" Value="{StaticResource Background}" />
            </Style>
        </ResourceDictionary>
    </ContentPage.Resources>

    <Grid RowDefinitions="*,70,0">
        <CollectionView
            x:Name="buttonsCollection"
            Grid.Row="0"
            Margin="20"
            ItemsSource="{Binding Buttons}"
            SelectionMode="None">
            <CollectionView.ItemsLayout>
                <LinearItemsLayout ItemSpacing="10" Orientation="Vertical" />
            </CollectionView.ItemsLayout>
            <CollectionView.ItemTemplate>
                <DataTemplate x:DataType="models:ButtonAudio">
                    <HorizontalStackLayout>
                        <!--<components:CaButton
                            BackgroundColor="{Binding Color, Converter={StaticResource RgbStringToColorConverter}}"
                            HorizontalOptions="Start"
                            LongPressed="CaButton_OnLongPressed"
                            LongCommandParameter="{Binding .}"
                            ShortPressed="Button_OnPressed"
                            TextColor="{Binding Color, Converter={StaticResource TextColorConverter}}"
                            Text="{Binding Name}"
                            WidthRequest="{Binding Width, Source={RelativeSource AncestorType={x:Type CollectionView}}}">
                            <components:CaButton.Triggers>
                                <DataTrigger
                                    Binding="{Binding .}"
                                    TargetType="Button"
                                    Value="{x:Type models:ButtonAudio}">
                                    <Setter Property="Command"
                                            Value="{Binding PlayButtonAsyncCommand, 
                                            Source={RelativeSource AncestorType={x:Type viewModels:ButtonsViewModel}}}" />
                                    <Setter Property="CommandParameter" Value="{Binding .}" />
                                </DataTrigger>
                            </components:CaButton.Triggers>
                        </components:CaButton>-->
                        <components:WaveformGraphicsView 
                            Path="{Binding FilePath}"
                            HeightRequest="300"
                            HorizontalOptions="Center"
                            VerticalOptions="Center"
                            WidthRequest="300">
                            <components:WaveformGraphicsView.Drawable>
                                <components:WaveformDrawable />
                            </components:WaveformGraphicsView.Drawable>
                        </components:WaveformGraphicsView>
                        <Label
                            IsVisible="{Binding IsPauseButtonVisible, Mode=TwoWay, 
                                Source={RelativeSource AncestorType={x:Type viewModels:ButtonsViewModel}}}"
                            Style="{StaticResource FontAwesomeIcon}"
                            Text="{x:Static font:FaSolidIcons.Pause}">
                            <Label.GestureRecognizers>
                                <TapGestureRecognizer Tapped="PauseButton" />
                            </Label.GestureRecognizers>
                        </Label>
                        <Label
                            IsVisible="{Binding IsPlayButtonVisible, Mode=TwoWay, Source={RelativeSource AncestorType={x:Type viewModels:ButtonsViewModel}}}"
                            Style="{StaticResource FontAwesomeIcon}"
                            Text="{x:Static font:FaSolidIcons.Play}">
                            <Label.GestureRecognizers>
                                <TapGestureRecognizer Tapped="PlayButton" />
                            </Label.GestureRecognizers>
                        </Label>
                        <Label
                            IsVisible="{Binding IsStopButtonVisible, Mode=TwoWay, Source={RelativeSource AncestorType={x:Type viewModels:ButtonsViewModel}}}"
                            Style="{StaticResource FontAwesomeIcon}"
                            Text="{x:Static font:FaSolidIcons.Stop}">
                            <Label.GestureRecognizers>
                                <TapGestureRecognizer Tapped="StopButton" />
                            </Label.GestureRecognizers>
                        </Label>
                    </HorizontalStackLayout>
                </DataTemplate>
            </CollectionView.ItemTemplate>
        </CollectionView>

        <Button
            Grid.Row="1"
            Margin="10"
            BackgroundColor="{StaticResource Primary}"
            Command="{Binding AddNewButtonCommand}"
            Text="Aggiungi" />
        <toolkit:MediaElement
            x:Name="MediaElement"
            Grid.Row="2"
            MediaEnded="MediaElement_OnMediaEnded"
            ShouldAutoPlay="False"
            Source="{Binding MediaSource}" />
    </Grid>

</ContentPage>

Can you help me to solve this problem?

ewerspej / maui-samples

Can't use GraphicsView #4