Drawing View

samples/XCT.Sample.Android/MainActivity.cs

@@ -14,8 +14,7 @@ protected override void OnCreate(Bundle savedInstanceState)
 			ToolbarResource = Resource.Layout.Toolbar;
 
 			base.OnCreate(savedInstanceState);
-
-			global::Xamarin.Forms.Forms.SetFlags("CollectionView_Experimental");
+
 			Essentials.Platform.Init(this, savedInstanceState);
 			global::Xamarin.Forms.Forms.Init(this, savedInstanceState);
 			LoadApplication(new App());

samples/XCT.Sample.Android/Xamarin.CommunityToolkit.Sample.Android.csproj

@@ -20,6 +20,7 @@
     <AndroidEnableSGenConcurrent>true</AndroidEnableSGenConcurrent>
     <AndroidUseAapt2>true</AndroidUseAapt2>
     <AndroidHttpClientHandlerType>Xamarin.Android.Net.AndroidClientHandler</AndroidHttpClientHandlerType>
+    <EmbedAssembliesIntoApk>true</EmbedAssembliesIntoApk>
     <NuGetPackageImportStamp>
     </NuGetPackageImportStamp>
   </PropertyGroup>

samples/XCT.Sample.GTK/Xamarin.CommunityToolkit.Sample.GTK.csproj

@@ -102,4 +102,4 @@
     <None Include="app.config" />
   </ItemGroup>
   <Import Project="$(MSBuildToolsPath)\Microsoft.CSharp.targets" />
-</Project>
+</Project>

samples/XCT.Sample.UWP/App.xaml.cs

@@ -1,18 +1,8 @@
 using System;
-using System.Collections.Generic;
-using System.IO;
-using System.Linq;
-using System.Runtime.InteropServices.WindowsRuntime;
 using Windows.ApplicationModel;
 using Windows.ApplicationModel.Activation;
-using Windows.Foundation;
-using Windows.Foundation.Collections;
 using Windows.UI.Xaml;
 using Windows.UI.Xaml.Controls;
-using Windows.UI.Xaml.Controls.Primitives;
-using Windows.UI.Xaml.Data;
-using Windows.UI.Xaml.Input;
-using Windows.UI.Xaml.Media;
 using Windows.UI.Xaml.Navigation;
 
 namespace Xamarin.CommunityToolkit.Sample.UWP

samples/XCT.Sample.UWP/Xamarin.CommunityToolkit.Sample.UWP.csproj

@@ -164,4 +164,4 @@
     <VisualStudioVersion>14.0</VisualStudioVersion>
   </PropertyGroup>
   <Import Project="$(MSBuildExtensionsPath)\Microsoft\WindowsXaml\v$(VisualStudioVersion)\Microsoft.Windows.UI.Xaml.CSharp.targets" />
-</Project>
+</Project>

samples/XCT.Sample.WPF/DrawingViewRenderer.wpf.cs

@@ -0,0 +1,102 @@
+using System.Collections.Specialized;
+using System.ComponentModel;
+using System.Linq;
+using System.Windows.Controls;
+using System.Windows.Ink;
+using System.Windows.Input;
+using Xamarin.CommunityToolkit.Sample.WPF;
+using Xamarin.CommunityToolkit.UI.Views;
+using Xamarin.Forms;
+using Xamarin.Forms.Platform.WPF;
+
+[assembly: ExportRenderer(typeof(DrawingView), typeof(DrawingViewRenderer))]
+namespace Xamarin.CommunityToolkit.Sample.WPF
+{
+	public class DrawingViewRenderer : ViewRenderer<DrawingView, InkCanvas>
+	{
+		InkCanvas? canvas;
+
+		protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
+		{
+			base.OnElementPropertyChanged(sender, e);
+			if (e.PropertyName == DrawingView.PointsProperty.PropertyName)
+			{
+				canvas!.Strokes.StrokesChanged -= OnStrokesChanged;
+				canvas.Strokes.Clear();
+				LoadPoints();
+				canvas.Strokes.StrokesChanged += OnStrokesChanged;
+			}
+		}
+
+		protected override void OnElementChanged(ElementChangedEventArgs<DrawingView> e)
+		{
+			base.OnElementChanged(e);
+			if (Control == null && Element != null)
+			{
+				canvas = new InkCanvas
+				{
+					DefaultDrawingAttributes =
+					{
+						Color = Element.LineColor.ToMediaColor(),
+						Width = Element.LineWidth,
+						Height = Element.LineWidth
+					},
+					Background = Element.BackgroundColor.ToBrush()
+				};
+				Element.Points.CollectionChanged += OnCollectionChanged;
+				SetNativeControl(canvas);
+
+				canvas.Strokes.StrokesChanged += OnStrokesChanged;
+				Control!.PreviewMouseDown += OnPreviewMouseDown;
+			}
+
+			if (e.OldElement != null)
+			{
+				canvas!.Strokes.StrokesChanged -= OnStrokesChanged;
+				Element!.Points.CollectionChanged -= OnCollectionChanged;
+				if (Control != null)
+					Control.PreviewMouseDown -= OnPreviewMouseDown;
+			}
+		}
+
+		void OnCollectionChanged(object sender, NotifyCollectionChangedEventArgs args) => LoadPoints();
+
+		void OnPreviewMouseDown(object sender, MouseButtonEventArgs e)
+		{
+			canvas!.Strokes.Clear();
+			Element.Points.Clear();
+		}
+
+		void OnStrokesChanged(object sender, StrokeCollectionChangedEventArgs e)
+		{
+			Element.Points.CollectionChanged -= OnCollectionChanged;
+			if (e.Added.Count > 0)
+			{
+				var points = e.Added.First().StylusPoints.Select(point => new Point(point.X, point.Y));
+				Element.Points.Clear();
+				foreach (var point in points)
+					Element.Points.Add(point);
+
+				if (Element.Points.Count > 0)
+				{
+					if (Element.DrawingCompletedCommand.CanExecute(null))
+						Element.DrawingCompletedCommand.Execute(Element.Points);
+				}
+
+				if (Element.ClearOnFinish)
+					Element.Points.Clear();
+			}
+			Element.Points.CollectionChanged += OnCollectionChanged;
+		}
+
+		void LoadPoints()
+		{
+			var stylusPoints = Element?.Points.Select(point => new StylusPoint(point.X, point.Y)).ToList();
+			if (stylusPoints is { Count: > 0 })
+			{
+				var stroke = new Stroke(new StylusPointCollection(stylusPoints), canvas!.DefaultDrawingAttributes);
+				canvas.Strokes.Add(stroke);
+			}
+		}
+	}
+}

samples/XCT.Sample.WPF/MainWindow.xaml.cs

@@ -1,17 +1,4 @@
-using System;
-using System.Collections.Generic;
-using System.Linq;
-using System.Text;
-using System.Threading.Tasks;
-using System.Windows;
-using System.Windows.Controls;
-using System.Windows.Data;
-using System.Windows.Documents;
-using System.Windows.Input;
-using System.Windows.Media;
-using System.Windows.Media.Imaging;
-using System.Windows.Navigation;
-using System.Windows.Shapes;
+using Xamarin.CommunityToolkit.UI.Views;
 using Xamarin.Forms.PancakeView.Platforms.WPF;
 using Xamarin.Forms.Platform.WPF;
 
@@ -25,7 +12,7 @@ public partial class MainWindow : FormsApplicationPage
 		public MainWindow()
 		{
 			InitializeComponent();
-			Xamarin.Forms.Forms.Init();
+			Forms.Forms.Init();
 			PancakeViewRenderer.Init();
 			LoadApplication(new Xamarin.CommunityToolkit.Sample.App());
 		}

samples/XCT.Sample.WPF/Xamarin.CommunityToolkit.Sample.WPF.csproj

@@ -65,6 +65,9 @@
       <DependentUpon>App.xaml</DependentUpon>
       <SubType>Code</SubType>
     </Compile>
+    <Compile Include="DrawingViewRenderer.wpf.cs">
+      <SubType>Code</SubType>
+    </Compile>
     <Compile Include="MainWindow.xaml.cs">
       <DependentUpon>MainWindow.xaml</DependentUpon>
       <SubType>Code</SubType>

samples/XCT.Sample.iOS/AppDelegate.cs

@@ -6,8 +6,8 @@ namespace Xamarin.CommunityToolkit.Sample.iOS
 	// The UIApplicationDelegate for the application. This class is responsible for launching the
 	// User Interface of the application, as well as listening (and optionally responding) to
 	// application events from iOS.
-	[Register("AppDelegate")]
-	public partial class AppDelegate : global::Xamarin.Forms.Platform.iOS.FormsApplicationDelegate
+	[Register(nameof(AppDelegate))]
+	public class AppDelegate : global::Xamarin.Forms.Platform.iOS.FormsApplicationDelegate
 	{
 		// This method is invoked when the application has loaded and is ready to run. In this
 		// method you should instantiate the window, load the UI into it and then make the window
@@ -16,7 +16,6 @@ public partial class AppDelegate : global::Xamarin.Forms.Platform.iOS.FormsAppli
 		// You have 17 seconds to return from this method, or iOS will terminate your application.
 		public override bool FinishedLaunching(UIApplication app, NSDictionary options)
 		{
-			global::Xamarin.Forms.Forms.SetFlags("CollectionView_Experimental");
 			global::Xamarin.Forms.Forms.Init();
 			LoadApplication(new App());
 

samples/XCT.Sample.iOS/Xamarin.CommunityToolkit.Sample.iOS.csproj

@@ -183,4 +183,4 @@
   <ItemGroup>
     <BundleResource Include="Resources\triangle.png" />
   </ItemGroup>
-</Project>
+</Project>

samples/XCT.Sample/App.xaml.cs

@@ -1,6 +1,7 @@
 using System.Globalization;
 using Xamarin.CommunityToolkit.Helpers;
 using Xamarin.CommunityToolkit.Sample.Pages;
+using Xamarin.CommunityToolkit.Sample.Pages.Views;
 using Xamarin.CommunityToolkit.Sample.Resx;
 using Xamarin.Forms.PlatformConfiguration;
 using Xamarin.Forms.PlatformConfiguration.WindowsSpecific;

samples/XCT.Sample/Pages/Views/DrawingViewPage.xaml

@@ -0,0 +1,67 @@
+<?xml version="1.0" encoding="utf-8"?>
+<pages:BasePage xmlns="http://xamarin.com/schemas/2014/forms"
+                xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+                xmlns:views="clr-namespace:Xamarin.CommunityToolkit.UI.Views;assembly=Xamarin.CommunityToolkit"
+                x:Class="Xamarin.CommunityToolkit.Sample.Pages.Views.DrawingViewPage"
+                xmlns:pages="clr-namespace:Xamarin.CommunityToolkit.Sample.Pages"
+                xmlns:viewsVodel="clr-namespace:Xamarin.CommunityToolkit.Sample.ViewModels.Views;assembly=Xamarin.CommunityToolkit.Sample">
+
+    <pages:BasePage.BindingContext>
+        <viewsVodel:DrawingViewViewModel/>
+    </pages:BasePage.BindingContext>
+
+    <ScrollView>
+        <StackLayout>
+            <Switch x:Name="ClearOnFinish"  />
+            <Button
+                BackgroundColor="White"
+                Clicked="LoadPointsButtonClicked"
+                Text="Load points"
+                TextColor="Black" />
+            <Button
+                BackgroundColor="White"
+                Command="{Binding SetPointsCommand}"
+                Text="Load points ViewModel"
+                TextColor="Black" />
+            <Label
+                x:Name="HiddenLabel"
+                HorizontalOptions="CenterAndExpand"
+                IsVisible="False"
+                Text="Draw &amp; GO" />
+            <Button
+                BackgroundColor="White"
+                Clicked="DisplayHiddenLabelButtonClicked"
+                Text="Display hidden label"
+                TextColor="Black" />
+            <Button
+                BackgroundColor="White"
+                Command="{Binding GetPointsCommand}"
+                Text="Get points ViewModel"
+                TextColor="Black" />
+            <Button
+                BackgroundColor="White"
+                Clicked="GetCurrentDrawingViewImageClicked"
+                Text="Display current gesture pad image"
+                TextColor="Black" />
+            <Button
+                BackgroundColor="White"
+                Clicked="GetImageClicked"
+                Text="Display image"
+                TextColor="Black" />
+            <Image
+                x:Name="GestureImage"
+                HeightRequest="100"
+                WidthRequest="100" />
+            <views:DrawingView
+                x:Name="DrawingViewControl"
+                Points="{Binding MacroPoints, Mode=TwoWay}"
+                BackgroundColor="DarkGray"
+                ClearOnFinish="{Binding Source={x:Reference ClearOnFinish}, Path=IsToggled}"
+                HorizontalOptions="FillAndExpand"
+                LineColor="Red"
+                LineWidth="10"
+                VerticalOptions="FillAndExpand" />
+            <Editor x:Name="Logs" AutoSize="TextChanges" />
+        </StackLayout>
+    </ScrollView>
+</pages:BasePage>

samples/XCT.Sample/Pages/Views/DrawingViewPage.xaml.cs

@@ -0,0 +1,56 @@
+using System;
+using System.Collections.Generic;
+using Xamarin.Forms;
+using Xamarin.CommunityToolkit.UI.Views;
+using System.Collections.ObjectModel;
+
+namespace Xamarin.CommunityToolkit.Sample.Pages.Views
+{
+	public partial class DrawingViewPage : BasePage
+	{
+		public DrawingViewPage()
+		{
+			InitializeComponent();
+			DrawingViewControl.Points = GeneratePoints(200);
+			DrawingViewControl.DrawingCompletedCommand = new Command<ObservableCollection<Point>>(points =>
+			{
+				Logs.Text += "GestureCompletedCommand executed" + Environment.NewLine;
+				DrawImage(points);
+			});
+		}
+
+		void LoadPointsButtonClicked(object sender, EventArgs e) => DrawingViewControl.Points = GeneratePoints(50);
+
+		void DisplayHiddenLabelButtonClicked(object sender, EventArgs e) => HiddenLabel.IsVisible = !HiddenLabel.IsVisible;
+
+		void GetCurrentDrawingViewImageClicked(object sender, EventArgs e)
+		{
+			var stream = DrawingViewControl.GetImageStream(GestureImage.Width, GestureImage.Height);
+			GestureImage.Source = ImageSource.FromStream(() => stream);
+		}
+
+		void GetImageClicked(object sender, EventArgs e)
+		{
+			var points = GeneratePoints(100);
+			DrawImage(points);
+		}
+
+		static ObservableCollection<Point> GeneratePoints(int count)
+		{
+			var points = new ObservableCollection<Point>();
+			for (var i = 0; i < count; i++)
+			{
+				points.Add(new Point(i, i));
+			}
+
+			return points;
+		}
+
+		void DrawImage(IEnumerable<Point> points)
+		{
+			var stream = DrawingView.GetImageStream(points, new Size(GestureImage.Width, GestureImage.Height), 10,
+				Color.White, Color.Black);
+			GestureImage.Source = ImageSource.FromStream(() => stream);
+		}
+	}
+}