Home > Software engineering >  How to detect the click on a drawn element in a GraphicsView
How to detect the click on a drawn element in a GraphicsView

Time:10-30

I have created an IDrawable that draws different arcs of a circle in a GraphicsView in order to create a pie chart.

No problem so far, except that now I would like to detect the click or hover of one of these circle portions. But I don't see anything that would allow me to do that easily.

enter image description here

Even inheriting my IDrawable from View to attach a tapgesture to it doesn't seem to work (and even then it wouldn't really answer my problem which is to be able to know which portion is clicked).

    public class PieChartDrawable : View, IDrawable
    {
        private readonly PieChart _chart;

        public PieChartDrawable(PieChart chart) 
        { 
            _chart = chart;

            var tapGestureRecognizer = new TapGestureRecognizer();

            tapGestureRecognizer.Tapped  = OnTapped;

            GestureRecognizers.Add(tapGestureRecognizer);
        }

        private void OnTapped(object sender, EventArgs e)
        {
            // Does not trigger.
        }

        public void Draw(ICanvas canvas, RectF dirtyRect)
        {
            if (_chart.Entries == null)
                return;

            [...]
          
        } 
    }

Am I doing it wrong, or is there a way to do it? (I'm looking for a solution for MAUI, but I guess something that works under Xamarin Forms will do very well).

Thanks in advance.

CodePudding user response:

It seams it can be a solution from the first sight:

  1. Use the solution described in this one to detect the point
  2. Write the function PointInPolygon to detect the selected area (Point in the big circle, Point out of small circle and angle to detect sector)

Other one I have found at the moment the more complex to quick reuse :)

ADDED:

Invoking Events from Effects

  • Related