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 टैप है।

अन्य इशारे हैं चुटकी और पान।

चुटकी इशारे के साथ एक छवि ज़ूम करें

एक Image (या किसी अन्य दृश्य तत्व) को PinchGestureRecognizer करने PinchGestureRecognizer लिए हमें इसमें एक 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
}

अन्य इशारे टैप और पैन हैं।

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 अलग-अलग टच हैंडलिंग घटनाओं को जोड़ता है। स्पर्श करने वाली उंगलियों की स्थिति सभी MR.Gestures घटनाओं के लिए दिए गए EventArgs का हिस्सा है।

यदि आप स्क्रीन पर कहीं भी पिन लगाना चाहते हैं, तो सबसे आसान तरीका MR.Gestures.AbsoluteLayout का उपयोग करना है जो Tapping ईवेंट को हैंडल करता है।

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

जैसा कि आप देख सकते हैं Tapping="OnTapping" भी लगता है जैसे कि नेस्टेड GestureRecognizers साथ एक्सएमरिन सिंटैक्स की तुलना में .NET है। वह सिंटैक्स 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 उपयोग भी कर सकते हैं और अपने TappingCommand को बांध सकते हैं, लेकिन यह इस सरल उदाहरण में चीजों को जटिल करेगा।

MR.Gestures के अधिक नमूने GitureSample ऐप में GitHub पर और MR.Gestures वेबसाइट पर देखे जा सकते हैं। ये भी दिखाते हैं कि इवेंट हैंडलर्स, कमांड्स, MVVM, के साथ अन्य सभी टच इवेंट्स का उपयोग कैसे करें ...