Hello,
Welcome to our Microsoft Q&A platform!
You can achieve it by custom renderer for your Image
.
We can create a class to extend the Image
. Then we can expose the Command and LongClickEvent for Image like following code. If you do not need Command, you can remove it.
public class CustomImage: Image
{
public static readonly BindableProperty LongpressCommandProperty =
BindableProperty.Create(nameof(LongpressCommand), typeof(ICommand), typeof(CustomImage), null);
public ICommand LongpressCommand
{
get { return (ICommand)GetValue(LongpressCommandProperty); }
set { SetValue(LongpressCommandProperty, value); }
}
public static readonly BindableProperty CommandProperty =
BindableProperty.Create(nameof(Command), typeof(ICommand), typeof(CustomImage), null);
public ICommand Command
{
get { return (ICommand)GetValue(CommandProperty); }
set { SetValue(CommandProperty, value); }
}
public static readonly BindableProperty CommandParameterProperty = BindableProperty.Create("CommandParameter", typeof(object), typeof(CustomImage), (object)null);
public object CommandParameter
{
get { return GetValue(CommandParameterProperty); }
set { SetValue(CommandParameterProperty, value); }
}
/// <summary>
/// Long press event.
/// If the Content or its children have gesture recognizers set, in order to prevent gesture conflicts, it is recommended to set their InputTransparent property to True.
/// </summary>
public event EventHandler LongPressed
{
add { LongPressedHandler += value; }
remove { LongPressedHandler -= value; }
}
public EventHandler LongPressedHandler;
/// <summary>
/// Tap event.
/// If the Content or its children have gesture recognizers set, in order to prevent gesture conflicts, it is recommended to set their InputTransparent property to True.
/// </summary>
public event EventHandler Tapped
{
add { TappedHandler += value; }
remove { TappedHandler -= value; }
}
public EventHandler TappedHandler;
}
}
the LongPressedHandler
we want to execute longpress directly.
the LongpressCommand
that we want to bind when the longpress detects the command when Tap is detected and
the CommandParameter
passes into the Command.
We can use these in native Renderer implementations to invoke when the press is detected.
For Android.
using Android.App;
using Android.Content;
using Android.OS;
using Android.Runtime;
using Android.Views;
using Android.Widget;
using ImageLongClickDemo;
using ImageLongClickDemo.Droid;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android;
[assembly: ExportRenderer(typeof(CustomImage), typeof(CustomImageRenderer))]
namespace ImageLongClickDemo.Droid
{
public class CustomImageRenderer : ImageRenderer
{
private CustomImage _view;
public CustomImageRenderer(Context context) : base(context) { }
protected override void OnElementChanged(ElementChangedEventArgs<Image> e)
{
base.OnElementChanged(e);
if (e.NewElement != null)
{
_view = e.NewElement as CustomImage;
}
Control.SoundEffectsEnabled = true;
Control.LongClickable = true;
Control.LongClick += (s, ea) =>
{
if (_view != null)
{
_view.LongPressedHandler?.Invoke(_view, ea);
var command = _view.LongpressCommand;// CustomImage.GetCommand(_view);
command?.Execute(_view);
}
};
Control.Clickable = true;
Control.Click += (s, ea) =>
{
if (_view != null)
{
_view.TappedHandler?.Invoke(_view, ea);
var command = _view.Command;// CustomImage.GetCommand(_view);
command?.Execute(_view);
}
};
}
}
}
For iOS.
using Foundation;
using ImageLongClickDemo;
using ImageLongClickDemo.iOS;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using UIKit;
using Xamarin.Forms;
using Xamarin.Forms.Platform.iOS;
[assembly: ExportRenderer(typeof(CustomImage), typeof(CutomImageRenderer))]
namespace ImageLongClickDemo.iOS
{
public class CutomImageRenderer : ImageRenderer
{
private CustomImage _view;
private readonly UILongPressGestureRecognizer _longPressRecognizer;
private readonly UITapGestureRecognizer _tapGestureRecognizer;
public CutomImageRenderer()
{
_longPressRecognizer = new UILongPressGestureRecognizer((s) =>
{
if (s.State == UIGestureRecognizerState.Began && _view != null)
{
_view.LongPressedHandler?.Invoke(_view, null);
var command = _view.LongpressCommand;// CustomImage.GetCommand(_view);
command?.Execute(_view);
}
});
_tapGestureRecognizer = new UITapGestureRecognizer(() =>
{
_view.TappedHandler?.Invoke(_view, null);
var command = _view.Command;// CustomImage.GetCommand(_view);
command?.Execute(_view);
});
}
protected override void OnElementChanged(ElementChangedEventArgs<Image> e)
{
base.OnElementChanged(e);
if (e.NewElement != null)
{
_view = e.NewElement as CustomImage;
}
if (Control != null)
{
Control.UserInteractionEnabled = true;
Control.AddGestureRecognizer(_longPressRecognizer);
Control.AddGestureRecognizer(_tapGestureRecognizer);
}
}
}
}
In the end, we can use it in Xamarin.forms. For example, we can use LongPressed
event.
<imagelongclickdemo:CustomImage LongPressed="CustomImage_LongPressed" Source="icon1.png"></imagelongclickdemo:CustomImage>
In layout background code.
private void CustomImage_LongPressed(object sender, EventArgs e)
{
var image = (sender) as Image;
DisplayAlert("Longpress Event", $"Longpress on image {image.ClassId}", "OK");
}
Best Regards,
Leon Lu
If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.