有没有一种方法可以在共享的Xamarin Forms中使用捏合缩放,我只找到了每个平台的实现方式。
您可以使用Pan Gesture来实现它。这里有一个很好的示例,可以将图像包装在PanContainer中 - 添加Pan Gesture Recognizer。
Pan Gesture用于检测拖动,并使用PanGestureRecognizer类实现。 Pan手势的常见场景是水平和垂直拖动图像,以便在显示视口小于图像尺寸时可以查看所有图像内容。通过在视口内移动图像来实现此目的。
简单示例:
<Image Source="MonoMonkey.jpg">
<Image.GestureRecognizers>
<PanGestureRecognizer PanUpdated="OnPanUpdated" />
</Image.GestureRecognizers>
</Image>
Pan容器示例XAML:
<AbsoluteLayout>
<local:PanContainer>
<Image Source="MonoMonkey.jpg" WidthRequest="1024" HeightRequest="768" />
</local:PanContainer>
</AbsoluteLayout>
后台代码:
public class PanContainer : ContentView
{
double x, y;
public PanContainer ()
{
// Set PanGestureRecognizer.TouchPoints to control the
// number of touch points needed to pan
var panGesture = new PanGestureRecognizer ();
panGesture.PanUpdated += OnPanUpdated;
GestureRecognizers.Add (panGesture);
}
void OnPanUpdated (object sender, PanUpdatedEventArgs e)
{
switch (e.StatusType) {
case GestureStatus.Running:
// Translate and ensure we don't pan beyond the wrapped user interface element bounds.
Content.TranslationX =
Math.Max (Math.Min (0, x + e.TotalX), -Math.Abs (Content.Width - App.ScreenWidth));
Content.TranslationY =
Math.Max (Math.Min (0, y + e.TotalY), -Math.Abs (Content.Height - App.ScreenHeight));
break;
case GestureStatus.Completed:
// Store the translation applied during the pan
x = Content.TranslationX;
y = Content.TranslationY;
break;
}
}
}
你可以尝试我在.NET Maui上验证过的这个修改,并应用到TBertuzzi/Xamarin.Forms.PinchZoomImage中:
<? xml version = "1.0" encoding = "utf-8" ?>
< ContentPage xmlns = "http://schemas.microsoft.com/dotnet/2021/maui"
xmlns: x = "http://schemas.microsoft.com/winfx/2009/xaml"
xmlns: collects = "clr-namespace:Mab.Collects"
x: Class = "N3ema.Secondpageimageshow" >
< ContentPage.Content >
< collects:Zoom >
< collects:Zoom.Content >
< StackLayout >
< Image Source = "shahid.jpeg"
HorizontalOptions = "Fill"
Aspect = "Fill"
VerticalOptions = "FillAndExpand" />
</ StackLayout >
</ collects:Zoom.Content >
</ collects:Zoom >
</ ContentPage.Content >
</ ContentPage >