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:
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();
}
}
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);
}
}
<?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>