Implement [BindableProperty] for MediaElement

samples/CommunityToolkit.Maui.Sample/Pages/Views/MediaElement/MediaElementCarouselViewPage.xaml

@@ -18,7 +18,7 @@
                Text="This page demonstrates that the MediaElement can be used inside of a DataTemplate" 
                Margin="12,0,12,0"/>
         <CarouselView HeightRequest="275" PeekAreaInsets="52" ItemsSource="{Binding ItemSource}">
-            
+
             <CarouselView.ItemsLayout>
                 <LinearItemsLayout Orientation="Horizontal"
                                    ItemSpacing="24"
@@ -55,18 +55,18 @@
                     </Border>
                 </DataTemplate>
             </CarouselView.ItemTemplate>
-            
+
         </CarouselView>
-        
+
         <Label HorizontalTextAlignment="Center"
                VerticalTextAlignment="Center"
                HorizontalOptions="Center"
                VerticalOptions="Center"
                Text="Second CarouselView to confirm MediaElement can be used on a Page containing multiple ItemsView controls" 
                Margin="12,0,12,0"/>
-        
+
         <CarouselView HeightRequest="275" PeekAreaInsets="52" ItemsSource="{Binding ItemSource}">
-            
+
             <CarouselView.ItemsLayout>
                 <LinearItemsLayout Orientation="Horizontal"
                                    ItemSpacing="24"
@@ -102,15 +102,15 @@
                     </Border>
                 </DataTemplate>
             </CarouselView.ItemTemplate>
-            
+
         </CarouselView>
-        
+
         <Label Text="Swipe Left or Right to see next video"
                HorizontalOptions="Center"
                VerticalOptions="Center"
                HorizontalTextAlignment="Center"
                VerticalTextAlignment="Center"
                FontAttributes="Italic"/>
-        
+
     </VerticalStackLayout>
 </pages:BasePage>

samples/CommunityToolkit.Maui.Sample/Pages/Views/MediaElement/MediaElementCollectionViewPage.xaml

@@ -10,55 +10,55 @@
                 Padding="0, 20, 0, 0"
             Title="MediaElement in CollectionView">
     <ScrollView>
-    <VerticalStackLayout Spacing="12">
-    <Label HorizontalTextAlignment="Center"
+        <VerticalStackLayout Spacing="12">
+            <Label HorizontalTextAlignment="Center"
             VerticalTextAlignment="Center"
             HorizontalOptions="Center"
             VerticalOptions="Center"
             Text="This page demonstrates that the MediaElement can be used inside of a DataTemplate" 
             Margin="12,0,12,0"/>
-    <CollectionView HeightRequest="850" ItemsSource="{Binding ItemSource}">
-            
-        <CollectionView.ItemsLayout>
-            <GridItemsLayout Orientation="Vertical"
+            <CollectionView HeightRequest="850" ItemsSource="{Binding ItemSource}">
+
+                <CollectionView.ItemsLayout>
+                    <GridItemsLayout Orientation="Vertical"
                                 Span="1"
                                 SnapPointsAlignment="Center"
                                 SnapPointsType="MandatorySingle" />
-        </CollectionView.ItemsLayout>
+                </CollectionView.ItemsLayout>
 
-        <CollectionView.ItemTemplate>
-            <DataTemplate x:DataType="viewModels:MediaElementDataSource">
-                <Border
+                <CollectionView.ItemTemplate>
+                    <DataTemplate x:DataType="viewModels:MediaElementDataSource">
+                        <Border
                     x:Name="CollectionViewBorder"
                     BackgroundColor="Black"
                     Padding="5">
-                    <Border.StrokeShape>
-                        <RoundRectangle CornerRadius="4" />
-                    </Border.StrokeShape>
-                    <VerticalStackLayout Spacing="6" HeightRequest="250">
-                        <toolkit:MediaElement
+                            <Border.StrokeShape>
+                                <RoundRectangle CornerRadius="4" />
+                            </Border.StrokeShape>
+                            <VerticalStackLayout Spacing="6" HeightRequest="250">
+                                <toolkit:MediaElement
                             HeightRequest="200"
                             x:Name="MediaElement"
                             ShouldAutoPlay="True"
                             ShouldShowPlaybackControls="True"
                             Source="{Binding Source, Mode=OneTime}" />
-                        <Label TextColor="White"
+                                <Label TextColor="White"
                                 HorizontalOptions="Center"
                                 VerticalOptions="Center"
                                 HorizontalTextAlignment="Center"
                                 VerticalTextAlignment="Center"
                                 FontAttributes="Bold"
                                 FontSize="18"
                                 Text="{Binding Name, Mode=OneTime}"/>
-                    </VerticalStackLayout>
-                </Border>
-            </DataTemplate>
-        </CollectionView.ItemTemplate>
-            
-    </CollectionView>
-        
-    </VerticalStackLayout>
-        
+                            </VerticalStackLayout>
+                        </Border>
+                    </DataTemplate>
+                </CollectionView.ItemTemplate>
+
+            </CollectionView>
+
+        </VerticalStackLayout>
+
     </ScrollView>
-    
+
 </pages:BasePage>

src/CommunityToolkit.Maui.MediaElement/CommunityToolkit.Maui.MediaElement.csproj

@@ -47,13 +47,19 @@
     <Configurations>Debug;Release</Configurations>
     <WarningsAsErrors>$(WarningsAsErrors);CS1591</WarningsAsErrors>
     <GenerateDocumentationFile>True</GenerateDocumentationFile>
+    <EmitCompilerGeneratedFiles>true</EmitCompilerGeneratedFiles>
+    <CompilerGeneratedFilesOutputPath>$(BaseIntermediateOutputPath)\GeneratedFiles</CompilerGeneratedFilesOutputPath>
   </PropertyGroup>
 
   <ItemGroup>
     <None Include="..\..\build\nuget.png" PackagePath="icon.png" Pack="true" />
     <None Include="ReadMe.txt" pack="true" PackagePath="." />
   </ItemGroup>
-
+
+  <ItemGroup>
+    <ProjectReference Include="..\CommunityToolkit.Maui.SourceGenerators.Internal\CommunityToolkit.Maui.SourceGenerators.Internal.csproj" OutputItemType="Analyzer" ReferenceOutputAssembly="false" />
+  </ItemGroup>
+
   <ItemGroup>
     <None Include="..\CommunityToolkit.Maui.MediaElement.Analyzers\bin\$(Configuration)\netstandard2.0\CommunityToolkit.Maui.MediaElement.Analyzers.dll" Pack="true" PackagePath="analyzers/dotnet/cs" Visible="false" />
     <None Include="..\CommunityToolkit.Maui.MediaElement.Analyzers.CodeFixes\bin\$(Configuration)\netstandard2.0\CommunityToolkit.Maui.MediaElement.Analyzers.CodeFixes.dll" Pack="true" PackagePath="analyzers/dotnet/cs" Visible="false" />

src/CommunityToolkit.Maui.MediaElement/Interfaces/IMediaElement.shared.cs

@@ -9,20 +9,15 @@ namespace CommunityToolkit.Maui.Core;
 public interface IMediaElement : IView, IAsynchronousMediaElementHandler
 {
 	/// <summary>
-	/// Gets or sets the title of the media.
-	/// </summary>
-	string MetadataTitle { get; set; }
-
-	/// <summary>
-	/// Gets or sets the artist of the media.
+	/// Occurs when <see cref="CurrentState"/> changed.
 	/// </summary>
-	string MetadataArtist { get; set; }
+	event EventHandler<MediaStateChangedEventArgs> StateChanged;
 
 	/// <summary>
-	/// Gets or sets the artwork Image Url.
+	/// Occurs when the <see cref="Position"/> changes;
 	/// </summary>
-	string MetadataArtworkUrl { get; set; }
-
+	event EventHandler<MediaPositionChangedEventArgs> PositionChanged;
+	
 	/// <summary>
 	/// Gets the media aspect ratio.
 	/// </summary>
@@ -98,18 +93,23 @@ public interface IMediaElement : IView, IAsynchronousMediaElementHandler
 	/// <summary>
 	/// Gets or sets the volume of the audio for the media.
 	/// </summary>
-	/// <remarks>A value of 1 means full volume, 0 is silence.</remarks>
+	/// <remarks>A value of 1 indicates full volume, 0 is silence.</remarks>
 	double Volume { get; set; }
+
+	/// <summary>
+	/// Gets or sets the title of the media.
+	/// </summary>
+	string MetadataTitle { get; set; }
 
 	/// <summary>
-	/// Occurs when <see cref="CurrentState"/> changed.
+	/// Gets or sets the artist of the media.
 	/// </summary>
-	event EventHandler<MediaStateChangedEventArgs> StateChanged;
+	string MetadataArtist { get; set; }
 
 	/// <summary>
-	/// Occurs when the <see cref="Position"/> changes;
+	/// Gets or sets the artwork Image Url.
 	/// </summary>
-	event EventHandler<MediaPositionChangedEventArgs> PositionChanged;
+	string MetadataArtworkUrl { get; set; }
 
 	/// <summary>
 	/// Occurs when the media has ended playing successfully.