question

SreejithSree-2948 avatar image
0 Votes"
SreejithSree-2948 asked JarvanZhang-MSFT edited

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

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

dotnet-xamarin
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

1 Answer

JarvanZhang-MSFT avatar image
0 Votes"
JarvanZhang-MSFT answered JarvanZhang-MSFT edited

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.


· 4
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

On where I can test the zoom function on https://www.xamarin.com?

But pinch zooming is working fine on the ios part. Is maximum-scale is not checking on the ios platform? Why it is failing only on android platform?

I have one more issue in the same section. The webview content is not scrollable. That issue is with the game url. Currently, the book link is set as the source value. Could you please uncomment the game source line on MainPage.xaml.cs to check the game scroll issue. Could you please check that and let me know the reason behind that?

0 Votes 0 ·

On where I can test the zoom function on https://www.xamarin.com?

You could just test the code like 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>

The webview content is not scrollable

It support to scroll the content. Pelase scroll the white space instead of the screen.

0 Votes 0 ·

Why the scroll is working only on white space? Is that also an issue with the URL?

0 Votes 0 ·
Show more comments