Thanks to visit codestin.com
Credit goes to github.com

Skip to content
This repository was archived by the owner on Feb 22, 2023. It is now read-only.

[webview_flutter]Add zoom to android webview #3325

Merged
merged 101 commits into from
Nov 5, 2021

Conversation

NickalasB
Copy link
Contributor

@NickalasB NickalasB commented Dec 12, 2020

Description

Updated description as of 09/08/2021

This PR adds the ability to toggle zoomEnabled on iOS and Android for the WebView widget. The PR adds the currently-missing zoom functionality to the Android WebView. The ability to double tap zoom and pinch zoom is a standard expectation on most all WebViews so this change enables that behavior by default for Android.

If for some reason, a user wishes to disable zoom, there is now a unified API to do that.

Old Description
This PR adds the currently-missing zoom functionality to the Android WebView. The ability to double tap zoom and pinch zoom is a standard expectation on most all WebViews so this change enables that behavior by default. This also defaults to enabling Android's setLoadWithOverviewMode so content defaults to being zoomed out all the way.

This change was needed by our team as one major user-flow for us is being able to load an "additional details" webpage rendered in a WebView. Unfortunately, on Android this content is not scaled to fit the device screen and there is no way to zoom in or out.

The Android WebView doesn't make it as straightforward as one would hope to enable this functionality.

For enabling the ability to zoom we have to set the following flags:
setSupportZoom(true)
setBuiltInZoomControls(true)
setDisplayZoomControls(false) -> on-screen zoom controls are deprecated in Android... so it's recommended to set this to false

To ensure the content starts out zoomed out and fits to the screen we have to set the following flags:
setLoadWithOverviewMode(true)
setUseWideViewPort(true)

I am defaulting to enabling these features while still allowing the fine-grained control to change them if the user chooses.

This PR: WebView w/default values

web_view_after

This PR: WebView with the following params set:

  • enableZoom(false)
  • setSupportZoom(false)
  • setBuiltInZoomControls(false)
  • setDisplayZoomControls(false)
  • setLoadWithOverviewMode(false)
  • setUseWideViewPort(false)
    web_view_before

Related Issues

Implements flutter/flutter#75196
Implements flutter/flutter#70731
Implements flutter/flutter#48283
Relates to flutter/flutter#48245
Relates to flutter/flutter#60921

Checklist

Before you create this PR confirm that it meets all requirements listed below by checking the relevant checkboxes ([x]). This will ensure a smooth and quick review process.

  • I read the Contributor Guide and followed the process outlined there for submitting PRs.
  • My PR includes unit or integration tests for all changed/updated/fixed behaviors (See Contributor Guide).
  • All existing and new tests are passing.
  • I updated/added relevant documentation (doc comments with ///).
  • The analyzer (flutter analyze) does not report any problems on my PR.
  • I read and followed the Flutter Style Guide.
  • The title of the PR starts with the name of the plugin surrounded by square brackets, e.g. [shared_preferences]
  • I updated pubspec.yaml with an appropriate new version according to the pub versioning philosophy.
  • I updated CHANGELOG.md to add a description of the change.
  • I signed the CLA.
  • I am willing to follow-up on review comments in a timely manner.

Breaking Change

Does your PR require plugin users to manually update their apps to accommodate your change?

  • Yes, this is a breaking change (please indicate a breaking change in CHANGELOG.md and increment major revision).
  • No, this is not a breaking change.

* Adding default values to bools to avoid npe

* Updating mismatched param names

* Updating tests
* Formatting and adding (Android only)
* master:
  [q-w] Update Flutter SDK constraint (flutter#3323)
  [i-p] Update Flutter SDK constraint (flutter#3322)
  [d-g] Update Flutter SDK constraint (flutter#3321)
  [a-c] Update Flutter SDK constraint (flutter#3320)
  [image_picker_platform_interface] Pass Uri to package:http APIs (flutter#3309)
  Exclude null-safe plugins from testing on stable (flutter#3318)
  [documentation] [url_launcher] fix for readme code sample (flutter#3308)

# Conflicts:
#	packages/webview_flutter/CHANGELOG.md
@NickalasB NickalasB requested a review from amirh as a code owner December 12, 2020 04:39
@google-cla
Copy link

google-cla bot commented Dec 12, 2020

Thanks for your pull request. It looks like this may be your first contribution to a Google open source project (if not, look below for help). Before we can look at your pull request, you'll need to sign a Contributor License Agreement (CLA).

📝 Please visit https://cla.developers.google.com/ to sign.

Once you've signed (or fixed any issues), please reply here with @googlebot I signed it! and we'll verify it.


What to do if you already signed the CLA

Individual signers
Corporate signers

ℹ️ Googlers: Go here for more info.

@google-cla google-cla bot added the cla: no label Dec 12, 2020
@NickalasB
Copy link
Contributor Author

CLA should come this week. I thought I was already added as a contributor on our corporate one

@NickalasB
Copy link
Contributor Author

NickalasB commented Dec 14, 2020 via email

@google-cla
Copy link

google-cla bot commented Dec 14, 2020

Thanks for your pull request. It looks like this may be your first contribution to a Google open source project (if not, look below for help). Before we can look at your pull request, you'll need to sign a Contributor License Agreement (CLA).

📝 Please visit https://cla.developers.google.com/ to sign.

Once you've signed (or fixed any issues), please reply here with @googlebot I signed it! and we'll verify it.


What to do if you already signed the CLA

Individual signers
Corporate signers

ℹ️ Googlers: Go here for more info.

* master:
  Merge null-safety plugins (flutter#3324)
  [camera] Add implementations for `camera_platform_interface` package. (flutter#3302)
@google-cla
Copy link

google-cla bot commented Dec 14, 2020

Thanks for your pull request. It looks like this may be your first contribution to a Google open source project (if not, look below for help). Before we can look at your pull request, you'll need to sign a Contributor License Agreement (CLA).

📝 Please visit https://cla.developers.google.com/ to sign.

Once you've signed (or fixed any issues), please reply here with @googlebot I signed it! and we'll verify it.


What to do if you already signed the CLA

Individual signers
Corporate signers

ℹ️ Googlers: Go here for more info.

* master:
  [android_intent] Migrate to nnbd (flutter#3328)
  [share] Migrate to null-safety (flutter#3311)
  [webview_flutter] Migrate to nnbd (flutter#3327)

# Conflicts:
#	packages/webview_flutter/CHANGELOG.md
#	packages/webview_flutter/lib/platform_interface.dart
#	packages/webview_flutter/lib/webview_flutter.dart
#	packages/webview_flutter/pubspec.yaml
#	packages/webview_flutter/test/webview_flutter_test.dart
@google-cla google-cla bot added cla: yes and removed cla: no labels Dec 15, 2020
@NickalasB
Copy link
Contributor Author

NickalasB commented Dec 15, 2020 via email

* master:
  [camera] Ios support documentation  (flutter#3335)
  Remove custom null safety analysis_options files (flutter#3339)
  [webview_flutter] Added 'allowsInlineMediaPlayback' property (flutter#3334)
  [camera_platform_interface] Add torch definition to the FlashModes enum  (flutter#3326)
  [wifi_info_flutter] Edit sample wifi_info_flutter plugin (flutter#3271)

# Conflicts:
#	packages/webview_flutter/CHANGELOG.md
#	packages/webview_flutter/android/src/main/java/io/flutter/plugins/webviewflutter/FlutterWebView.java
#	packages/webview_flutter/lib/platform_interface.dart
#	packages/webview_flutter/pubspec.yaml
@NickalasB
Copy link
Contributor Author

@amirh I am unclear as to how to address the failure on the build_all_plugins_ipa step. I have updated cocoapods but there is nothing new to commit. Any suggestions? Thank you

* Updating comment formatting in webview.dart
@stuartmorgan-g stuartmorgan-g added waiting for tree to go green (Use "autosubmit") This PR is approved and tested, but waiting for the tree to be green to land. last mile labels Nov 4, 2021
@fluttergithubbot
Copy link

This pull request is not suitable for automatic merging in its current state.

  • The status or check suite android-build_all_plugins has failed. Please fix the issues identified (or deflake) before re-applying this label.
  • This commit is not mergeable and has conflicts. Please rebase your PR and fix all the conflicts.

@fluttergithubbot fluttergithubbot removed the waiting for tree to go green (Use "autosubmit") This PR is approved and tested, but waiting for the tree to be green to land. label Nov 4, 2021
@stuartmorgan-g
Copy link
Contributor

@NickalasB Could you merge in the latest master? The test failure was an out-of-band failure (due to a Flutter change) than needed an in-tree fix several days ago.

* master:
  [webview_flutter] Deprecate evaluateJavascript in favour of runJavaScript and runJavaScriptForResult. (flutter#4403)
  [webview_flutter] Add interface methods to load local files and HTML strings. (flutter#4446)
  [ci] add pedantic dep to new in_app_purchase pkgs (flutter#4471)
  [ci] Remove unused dep from file_selector. (flutter#4468)
  [ci] update build_runner dep in android_intent and file_selector example (flutter#4467)
  [webview_flutter] Add platform interface method `loadRequest`. (flutter#4450)
  Remove -Werror from deprecated plugin Android builds (flutter#4466)
  [webview_flutter] Update webview packages for Android and iOS to implement `runJavascript` and `runJavascriptReturningResult`. (flutter#4402)
  [camera] Fix CamcorderProfile Usages (flutter#4423)
  [google_sign_in] Use a transparent image as a placeholder for the `GoogleUserCircleAvatar` (flutter#4391)
  [in_app_purchase]IAP/platform interface add cancel status (flutter#4093)
  [image_picker] doc:readme image picker misprints (flutter#4421)
  Support Hybrid Composition through the GoogleMaps Widget (flutter#4082)
  [path_provider] started supporting background platform channels (flutter#4443)
  [device_info] started using Background Platform Channels (flutter#4456)

# Conflicts:
#	packages/webview_flutter/webview_flutter/CHANGELOG.md
#	packages/webview_flutter/webview_flutter/pubspec.yaml
@NickalasB
Copy link
Contributor Author

@NickalasB Could you merge in the latest master? The test failure was an out-of-band failure (due to a Flutter change) than needed an in-tree fix several days ago.

@stuartmorgan-g stuartmorgan-g added the waiting for tree to go green (Use "autosubmit") This PR is approved and tested, but waiting for the tree to be green to land. label Nov 4, 2021
@fluttergithubbot fluttergithubbot merged commit 3da7654 into flutter:master Nov 5, 2021
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request Nov 5, 2021
@fatherOfLegends
Copy link

🎉 Thanks @NickalasB and @stuartmorgan

engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request Nov 5, 2021
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request Nov 5, 2021
@NickalasB NickalasB deleted the add_zoom_to_android_webview branch November 5, 2021 14:00
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request Nov 5, 2021
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request Nov 5, 2021
amantoux pushed a commit to amantoux/plugins that referenced this pull request Dec 11, 2021
KyleFin pushed a commit to KyleFin/plugins that referenced this pull request Dec 21, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
cla: yes customer: marketplace p: webview_flutter Edits files for a webview_flutter plugin waiting for tree to go green (Use "autosubmit") This PR is approved and tested, but waiting for the tree to be green to land.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

10 participants