Выделение кривой области WPF

#c_sharp #wpf #изображения

Здравствуйте, есть карта страны(изображение). Нужно обработать клик по областям.
Никогда не работал на WPF, по координатам получится криво, уже пробовал, что можно
еще сделать?
Нужно обработать клик по области, ну и при наведении мыши на область подсветку границы
области.



    private void Clicked(object sender, MouseButtonEventArgs e)
    {
        //string pos = "X - " + e.GetPosition(this).X + " Y - " + e.GetPosition(this).Y;
        //MessageBox.Show(pos);
        //if (e.GetPosition(this).X >= 232 && e.GetPosition(this).X <= 566 &&
            //e.GetPosition(this).Y >= 27 && e.GetPosition(this).Y <= 147)
        //MessageBox.Show(e.Source.ToString());
    }


все что у меня есть
    

Ответы

Ответ 1

Этого можно добиться, хотя и не совсем просто.

Для начала, вам нужно получить картинки каждой из областей. Обратитесь за этим к
вашему граф. дизайнеру. На картинке должна быть только область, а остальное обязано
быть транспарентным.

Теперь, нам нужно определить клик на нетранспарентной области. Для этого проще всего
использовать специализированный контрол, и переопределить hit testing.
Тогда мы сможем воспользоваться встроенными в WPF процедурами.

Наследуемся от Image:

public class OpaqueClickableImage : Image
{
    static int transparentAlpha = 128;

    protected override HitTestResult HitTestCore(PointHitTestParameters hitTestParameters)
    {
        if (Source == null)
            return null;
        var source = Source as BitmapSource;
        if (source == null)
            throw new NotSupportedException("Need BitmapSource");
        if (source.Format != PixelFormats.Bgra32)
            throw new NotSupportedException("Need 32-bit pixel format with alpha
channel");

        // Get the pixel of the source that was hit
        var x = (int)(hitTestParameters.HitPoint.X / ActualWidth * source.PixelWidth);
        var y = (int)(hitTestParameters.HitPoint.Y / ActualHeight * source.PixelHeight);

        var pixel = new byte[4];
        source.CopyPixels(new Int32Rect(x, y, 1, 1), pixel, 4, 0);

        if (pixel[3] < transparentAlpha)
            return null;

        return new PointHitTestResult(this, hitTestParameters.HitPoint);
    }
}


(Код украден с благодарностью украден здесь.)

Отлично, попробуем использовать. На клик навесим наш обработчик, а на IsMouseOver
добавим glow-эффект через стиль.


    


    



(Я специально нарисовал картинку с сердечком, можно использовать на 8-ое марта.)

Результат (на второй анимации для примера несколько одинаковых картинок рядом):