Xamarin.Forms
жесты

Сделать снимок с помощью добавления TapGestureRecognizer

В Xamarin.Forms есть пара распознавателей по умолчанию, один из которых - TapGestureRecognizer .

Вы можете добавить их практически к любому визуальному элементу. Посмотрите на простую реализацию, которая привязывается к Image . Вот как это сделать в коде.

var tappedCommand = new Command(() =>
{
    //handle the tap
});

var tapGestureRecognizer = new TapGestureRecognizer { Command = tappedCommand };
image.GestureRecognizers.Add(tapGestureRecognizer);

Или в XAML:

<Image Source="tapped.jpg">
    <Image.GestureRecognizers>
        <TapGestureRecognizer
                Command="{Binding TappedCommand}"
                NumberOfTapsRequired="2" />
  </Image.GestureRecognizers>
</Image>

Здесь команда задается с помощью привязки данных. Как вы можете видеть, вы также можете установить NumberOfTapsRequired чтобы включить его для большего количества кранов, прежде чем он примет меры. Значение по умолчанию - 1 крана.

Другими жестами являются Pinch и Pan.

Увеличьте изображение с помощью жестов Pinch

Чтобы сделать Image (или любой другой визуальный элемент) масштабируемым, мы должны добавить к нему PinchGestureRecognizer . Вот как это сделать в коде:

var pinchGesture = new PinchGestureRecognizer();
pinchGesture.PinchUpdated += (s, e) => {
// Handle the pinch
};
    
image.GestureRecognizers.Add(pinchGesture);

Но это также можно сделать из XAML:

<Image Source="waterfront.jpg">
  <Image.GestureRecognizers>
    <PinchGestureRecognizer PinchUpdated="OnPinchUpdated" />
  </Image.GestureRecognizers>
</Image>

В сопроводительном обработчике событий вы должны указать код, чтобы увеличить изображение. Конечно, другие применения могут быть реализованы.

void OnPinchUpdated (object sender, PinchGestureUpdatedEventArgs e)
{
    // ... code here
}

Другими жестами являются Tap и Pan.

Показать весь увеличенный контент изображения с помощью PanGestureRecognizer

Когда у вас есть увеличенное Image (или другое содержимое), вы можете перетащить Image чтобы отобразить весь его контент в увеличенном состоянии.

Это может быть достигнуто путем внедрения PanGestureRecognizer. Из кода это выглядит так:

var panGesture = new PanGestureRecognizer();
panGesture.PanUpdated += (s, e) => {
  // Handle the pan
};

image.GestureRecognizers.Add(panGesture);

Это также можно сделать из XAML:

<Image Source="MonoMonkey.jpg">
  <Image.GestureRecognizers>
    <PanGestureRecognizer PanUpdated="OnPanUpdated" />
  </Image.GestureRecognizers>
</Image>

В событии с кодом вы можете теперь обрабатывать панорамирование. Используйте эту подпись метода для ее обработки:

void OnPanUpdated (object sender, PanUpdatedEventArgs e)
{
  // Handle the pan
}

Поместите контакт, где пользователь коснулся экрана с помощью MR.Gestures

Xamarins, встроенные в распознаватели жестов, обеспечивают только очень базовую сенсорную обработку. Например, нет способа получить положение трогательного пальца. MR.Gestures - это компонент, который добавляет 14 различных событий обработки касания. Положение трогательных пальцев является частью EventArgs переданной всем событиям MR.Gestures.

Если вы хотите разместить булавку в любом месте экрана, самым простым способом является использование MR.Gestures.AbsoluteLayout который обрабатывает событие Tapping .

<mr:AbsoluteLayout x:Name="MainLayout" Tapping="OnTapping">
    ...
</mr:AbsoluteLayout>

Как вы можете видеть, Tapping="OnTapping" также больше напоминает .NET, чем синтаксис Xamarins с вложенными GestureRecognizers . Этот синтаксис был скопирован из iOS, и он немного пахнет для разработчиков .NET.

В вашем коде позади вы можете добавить обработчик OnTapping следующим образом:

private void OnTapping(object sender, MR.Gestures.TapEventArgs e)
{
    if (e.Touches?.Length > 0)
    {
        Point touch = e.Touches[0];
        var image = new Image() { Source = "pin" };
        MainLayout.Children.Add(image, touch);
    }
}

Вместо события Tapping вы также можете использовать TappingCommand и привязываться к ViewModel, но это осложнит ситуацию в этом простом примере.

Больше образцов для MR.Gestures можно найти в приложении GestureSample на GitHub и на веб-сайте MR.Gestures . Они также показывают, как использовать все другие события касания с обработчиками событий, командами, MVVM, ...