即使我遵循了教程代码,我的屏幕绘图的 Xamarin 代码也无法绘制
My Xamarin Code for on screen Drawing is not able to be Drawn on even though I followed tutorial code
大家好,我使用了本教程 (https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/graphics/skiasharp/paths/finger-paint) and modification with this forum post (https://forums.xamarin.com/discussion/178190/how-to-fix-cannot-convert-from-touchtracking-touchtrackingpoint-to-xamarin-forms-point) 中的代码来制作屏幕绘图。下面是我的 Xamarin C# 代码:
using System;
using System.Collections.Generic;
using SkiaSharp;
using SkiaSharp.Views.Forms;
using TouchTracking;
using Xamarin.Forms;
namespace MathKumu.Pages
{
public partial class WorkPage : ContentPage
{
Dictionary<long, SKPath> inProgressPaths = new Dictionary<long, SKPath>();
List<SKPath> completedPaths = new List<SKPath>();
SKPaint paint = new SKPaint
{
Style = SKPaintStyle.Stroke,
Color = SKColors.Black,
StrokeWidth = 10,
StrokeCap = SKStrokeCap.Round,
StrokeJoin = SKStrokeJoin.Round
};
public WorkPage(TopicsData topic)
{
InitializeComponent();
Title = topic.MathType;
}
void OnTouchEffectAction(object sender, TouchActionEventArgs args)
{
switch (args.Type)
{
case TouchActionType.Pressed:
if (!inProgressPaths.ContainsKey(args.Id))
{
SKPath path = new SKPath();
//path.MoveTo(ConvertToPixel(args.Location));
path.MoveTo(ConvertToPixel(new Point(args.Location.X, args.Location.Y)));
inProgressPaths.Add(args.Id, path);
canvasView.InvalidateSurface();
}
break;
case TouchActionType.Moved:
if (inProgressPaths.ContainsKey(args.Id))
{
SKPath path = inProgressPaths[args.Id];
//path.LineTo(ConvertToPixel(args.Location));
path.MoveTo(ConvertToPixel(new Point(args.Location.X, args.Location.Y)));
canvasView.InvalidateSurface();
}
break;
case TouchActionType.Released:
if (inProgressPaths.ContainsKey(args.Id))
{
completedPaths.Add(inProgressPaths[args.Id]);
inProgressPaths.Remove(args.Id);
canvasView.InvalidateSurface();
}
break;
case TouchActionType.Cancelled:
if (inProgressPaths.ContainsKey(args.Id))
{
inProgressPaths.Remove(args.Id);
canvasView.InvalidateSurface();
}
break;
}
}
//SKPoint ConvertToPixel(TouchTrackingPoint location)
//{
// return new SKPoint((float)(canvasView.CanvasSize.Width * location.X / canvasView.Width),
// (float)(canvasView.CanvasSize.Height * location.Y / canvasView.Height));
//}
SKPoint ConvertToPixel(Point pt)
{
return new SKPoint((float)(canvasView.CanvasSize.Width * pt.X / canvasView.Width),
(float)(canvasView.CanvasSize.Height * pt.Y / canvasView.Height));
}
void OnCanvasViewPaintSurface(object sender, SKPaintSurfaceEventArgs args)
{
SKCanvas canvas = args.Surface.Canvas;
canvas.Clear();
foreach (SKPath path in completedPaths)
{
canvas.DrawPath(path, paint);
}
foreach (SKPath path in inProgressPaths.Values)
{
canvas.DrawPath(path, paint);
}
}
}
}
这是我的 xaml 代码:
<?xml version="1.0" encoding="UTF-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:skia="clr-namespace:SkiaSharp.Views.Forms;assembly=SkiaSharp.Views.Forms"
xmlns:tt="clr-namespace:TouchTracking.Forms;assembly=TouchTracking.Forms"
x:Class="MathKumu.Pages.WorkPage">
<ContentPage.Content>
<Grid BackgroundColor="White">
<skia:SKCanvasView x:Name="canvasView"
PaintSurface="OnCanvasViewPaintSurface" />
<Grid.Effects>
<tt:TouchEffect Capture="True"
TouchAction="OnTouchEffectAction" />
</Grid.Effects>
</Grid>
</ContentPage.Content>
</ContentPage>
在 iPhone 模拟器上它显示 canvas 但是无法绘制。你们能帮我解决这个问题吗?谢谢。
您可以尝试的一件事是使用内置触摸事件。
我这里有一个示例可以做到这一点:
https://github.com/mattleibow/SkiaSharpDemo/blob/master/SkiaSharpDemo/SkiaSharpDemo/MainPage.xaml.cs#L113
通过与@Jason 的对话,我不得不将 TouchEffect.cs 和 TouchRecognizer.cs 放入我项目的 .IOS 文件夹中。然后在我所有 xaml 文件所在的项目文件夹中,我必须放置 TouchActionEventArgs.cs、TouchActionEventHandler.cs、TouchActionType.cs 和 TouchEffect.cs。这全部来自 https://github.com/xamarin/xamarin-forms-samples/tree/master/Effects/TouchTrackingEffect/TouchTrackingEffect。毕竟我不得不清理项目,因为我之前有 NuGet 包 TouchTracking。谢谢@Jason 的帮助。
大家好,我使用了本教程 (https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/graphics/skiasharp/paths/finger-paint) and modification with this forum post (https://forums.xamarin.com/discussion/178190/how-to-fix-cannot-convert-from-touchtracking-touchtrackingpoint-to-xamarin-forms-point) 中的代码来制作屏幕绘图。下面是我的 Xamarin C# 代码:
using System;
using System.Collections.Generic;
using SkiaSharp;
using SkiaSharp.Views.Forms;
using TouchTracking;
using Xamarin.Forms;
namespace MathKumu.Pages
{
public partial class WorkPage : ContentPage
{
Dictionary<long, SKPath> inProgressPaths = new Dictionary<long, SKPath>();
List<SKPath> completedPaths = new List<SKPath>();
SKPaint paint = new SKPaint
{
Style = SKPaintStyle.Stroke,
Color = SKColors.Black,
StrokeWidth = 10,
StrokeCap = SKStrokeCap.Round,
StrokeJoin = SKStrokeJoin.Round
};
public WorkPage(TopicsData topic)
{
InitializeComponent();
Title = topic.MathType;
}
void OnTouchEffectAction(object sender, TouchActionEventArgs args)
{
switch (args.Type)
{
case TouchActionType.Pressed:
if (!inProgressPaths.ContainsKey(args.Id))
{
SKPath path = new SKPath();
//path.MoveTo(ConvertToPixel(args.Location));
path.MoveTo(ConvertToPixel(new Point(args.Location.X, args.Location.Y)));
inProgressPaths.Add(args.Id, path);
canvasView.InvalidateSurface();
}
break;
case TouchActionType.Moved:
if (inProgressPaths.ContainsKey(args.Id))
{
SKPath path = inProgressPaths[args.Id];
//path.LineTo(ConvertToPixel(args.Location));
path.MoveTo(ConvertToPixel(new Point(args.Location.X, args.Location.Y)));
canvasView.InvalidateSurface();
}
break;
case TouchActionType.Released:
if (inProgressPaths.ContainsKey(args.Id))
{
completedPaths.Add(inProgressPaths[args.Id]);
inProgressPaths.Remove(args.Id);
canvasView.InvalidateSurface();
}
break;
case TouchActionType.Cancelled:
if (inProgressPaths.ContainsKey(args.Id))
{
inProgressPaths.Remove(args.Id);
canvasView.InvalidateSurface();
}
break;
}
}
//SKPoint ConvertToPixel(TouchTrackingPoint location)
//{
// return new SKPoint((float)(canvasView.CanvasSize.Width * location.X / canvasView.Width),
// (float)(canvasView.CanvasSize.Height * location.Y / canvasView.Height));
//}
SKPoint ConvertToPixel(Point pt)
{
return new SKPoint((float)(canvasView.CanvasSize.Width * pt.X / canvasView.Width),
(float)(canvasView.CanvasSize.Height * pt.Y / canvasView.Height));
}
void OnCanvasViewPaintSurface(object sender, SKPaintSurfaceEventArgs args)
{
SKCanvas canvas = args.Surface.Canvas;
canvas.Clear();
foreach (SKPath path in completedPaths)
{
canvas.DrawPath(path, paint);
}
foreach (SKPath path in inProgressPaths.Values)
{
canvas.DrawPath(path, paint);
}
}
}
}
这是我的 xaml 代码:
<?xml version="1.0" encoding="UTF-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:skia="clr-namespace:SkiaSharp.Views.Forms;assembly=SkiaSharp.Views.Forms"
xmlns:tt="clr-namespace:TouchTracking.Forms;assembly=TouchTracking.Forms"
x:Class="MathKumu.Pages.WorkPage">
<ContentPage.Content>
<Grid BackgroundColor="White">
<skia:SKCanvasView x:Name="canvasView"
PaintSurface="OnCanvasViewPaintSurface" />
<Grid.Effects>
<tt:TouchEffect Capture="True"
TouchAction="OnTouchEffectAction" />
</Grid.Effects>
</Grid>
</ContentPage.Content>
</ContentPage>
在 iPhone 模拟器上它显示 canvas 但是无法绘制。你们能帮我解决这个问题吗?谢谢。
您可以尝试的一件事是使用内置触摸事件。
我这里有一个示例可以做到这一点: https://github.com/mattleibow/SkiaSharpDemo/blob/master/SkiaSharpDemo/SkiaSharpDemo/MainPage.xaml.cs#L113
通过与@Jason 的对话,我不得不将 TouchEffect.cs 和 TouchRecognizer.cs 放入我项目的 .IOS 文件夹中。然后在我所有 xaml 文件所在的项目文件夹中,我必须放置 TouchActionEventArgs.cs、TouchActionEventHandler.cs、TouchActionType.cs 和 TouchEffect.cs。这全部来自 https://github.com/xamarin/xamarin-forms-samples/tree/master/Effects/TouchTrackingEffect/TouchTrackingEffect。毕竟我不得不清理项目,因为我之前有 NuGet 包 TouchTracking。谢谢@Jason 的帮助。