NET MAUI - XAML - PinchGesture - How to implement in a ContentPage

Question

Hi

I have a number of XAML ContentPages where I want to be able to allow the user to be able to zoom in/zoom out by being able to pinch Text/Image.

I know you can use the PinchGestureRecognizer, but I am not sure how to implement it in a ContentPage which has a ContentView. Eg:

    <RefreshView x:DataType="local:Level2ViewModel" Command="{Binding LoadItemDetailsCommand}" IsRefreshing="{Binding IsBusy, Mode=TwoWay}">
        <ScrollView VerticalOptions="FillAndExpand"  Padding="{OnIdiom 6, Tablet=6,Phone=5}">
            <ContentView>
            <CollectionView x:Name="ItemsDetailListView" BackgroundColor="{StaticResource PageBckColour}"  
                        ItemsSource="{Binding ItemDets}"   
                        SelectionMode="Single">
                <CollectionView.ItemTemplate>
                    <DataTemplate>
                        <StackLayout  x:DataType="model:ItemDets" Padding="5" >
                                <Label Text="{Binding DetDesc}"  Padding="{OnIdiom 7, Tablet=4,Phone=4}"
                            LineBreakMode="WordWrap"    
                            FontAttributes="Bold" 
                            FontSize="{OnIdiom 13, Tablet=14,Phone=13}"/>

                        <StackLayout.GestureRecognizers>
                                <TapGestureRecognizer 
                                NumberOfTapsRequired="1"
                                Command="{Binding Source={RelativeSource AncestorType={x:Type local:Level2ViewModel}}, Path=ItemTapped}"		
                                CommandParameter="{Binding .}">
                                </TapGestureRecognizer>
                            </StackLayout.GestureRecognizers>

                    </StackLayout>
                    </DataTemplate>
                </CollectionView.ItemTemplate>
            </CollectionView>
            </ContentView>

        </ScrollView>

I would welcome any suggestions as to what xaml and C# code I need to implement to achieve the above in my MVVM solution.

Some pages will have images that the user could zoom in/zoom out.

Thanks

Answer 1

Hello,

Firstly, ContentPage cannot add PinchGestureRecognizer.

I want to be able to allow the user to be able to zoom in/zoom out by being able to pinch Text/Image.

Add the PinchGestureRecognizer to the Label and Image controls directly. You can control the controls' zoom in/zoom out at the layout's background code.

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.