Xamarin Forms: Pinch zooming and scroll is not working for WebView content.

Question

I am using WebView for showing Flip snack Book and Games on the UI.

Facing 2 issues when showing content:

1. Pinch zooming is not working on the Android platform when showing books.
2. Not able to scroll and view the content when showing games on all platforms.

I am following this blog for pinch zooming. Also when showing the games I can't scroll to right and view the content. I have created a sample project for reference.

Note: Currently, the book link is set as the source value. Uncomment the game source line on MainPage.xaml.cs to check the game scroll issue.

Update 1:

I have added the custom webview from here, but the webview scroll is not working on android(also not working on ios).

Also added the webview zoom controls as per this blog, it is also not working on android.

My XF version is 4.8.0.1269

Answer 1

Hello,​

Welcome to our Microsoft Q&A platform!

The Android platform-specific enables pinch-to-zoom and a zoom control on a WebView. You could just set EnableZoomControls and DisplayZoomControls to ture in xaml as below.

   <ContentPage ...  
                xmlns:android="clr-namespace:Xamarin.Forms.PlatformConfiguration.AndroidSpecific;assembly=Xamarin.Forms.Core">  
       <WebView Source="https://www.xamarin.com"  
                android:WebView.EnableZoomControls="true"  
                android:WebView.DisplayZoomControls="true" />  
   </ContentPage>  

However, the function code doesn't work for the url of your project. This is because the maximum-scale of the url is set to 1 which means the page is not allow zooming in more than the specified amount. Simply put, the url does not support the zoom function. You could test the zoom function using the https://www.xamarin.com url to vertify that.

   <meta id="vp" name="viewport" content="minimum-scale=1, maximum-scale=1, user-scalable=no, initial-scale=1">  

Check the link: https://stackoverflow.com/questions/27236676/why-does-pinch-to-zoom-not-work-in-my-android-webview

Best Regards,

Jarvan Zhang

---

If the response is helpful, please click "Accept Answer" and upvote it.

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.