flutter_inappwebview
flutter_inappwebview copied to clipboard
Content Size not updating when exiting full screen video
Environment
Technology | Version |
---|---|
Flutter version | 3.7.6 |
Plugin version | 6.0.0-beta.22 |
Android version | Android 10 |
iOS version | 16.2 |
macOS version | 13.2 |
Xcode version | 14.2 |
Device information: Apple iPhone 12 pro
Description
I have a webview where I show video. When entering and then exiting fullscreen mode for the video, the content size does not change onExitFullScreen
Expected behavior: To call onContentSizeChanged when entering and exiting full screen
Current behavior:
When entering full screen: onContentSizeChanged
is called
"onContentSizeChanged" using {oldContentSize: {height: 219.0, width: 390.0}, newContentSize: {height: 844.0, width: 390.0}}
When exiting fullScreen onContentSizeChanged
is not called
Therefore when exiting the full screen and the frame gets smaller, the content size stays the same. This adds unwanted scroll effect on the video (see video for example)
https://user-images.githubusercontent.com/6585119/226324043-5cd8010a-974b-4ea4-bf9c-3d788ee850aa.mov
👋 @IbrahimYildirim
NOTE: This comment is auto-generated.
Are you sure you have already searched for the same problem?
Some people open new issues but they didn't search for something similar or for the same issue. Please, search for it using the GitHub issue search box or on the official inappwebview.dev website, or, also, using Google, StackOverflow, etc. before posting a new one. You may already find an answer to your problem!
If this is really a new issue, then thank you for raising it. I will investigate it and get back to you as soon as possible. Please, make sure you have given me as much context as possible! Also, if you didn't already, post a code example that can replicate this issue.
In the meantime, you can already search for some possible solutions online! Because this plugin uses native WebView, you can search online for the same issue adding android WebView [MY ERROR HERE]
or ios WKWebView [MY ERROR HERE]
keywords.
Following these steps can save you, me, and other people a lot of time, thanks!
bump, I'm having a similar issue.
I'm not able to reproduce the issue. It seems to work fine on iPhone. Probably, it also depends on the HTML and CSS of the webpage used for the video.
Could you provide a minimal code to reproduce it?
Here is a MRE. For me, the issue is slightly different but I think the core issue is the same. Here's how to reproduce it in my example:
- Once the page fully loads, play the video
- Go fullscreen
- Switch to landscape mode
- Exit fullscreen
- Switch to portrait mode
When you switch back to portrait mode, the web view shows the page in the landscape width so it looks cut off in the portrait mode. Only happens with iOS, Android is working fine as expected.
EDIT: MRE removed
I'm having a similar issue.
it's similar for me
Same here... when i'm using allowsInlineMediaPlayback = true when i exit full screen mode the content has not updating.
(I'm using an youtube embed player.)
@Vis5 I'm still not able to reproduce the issue with your code. It just works as expected and everything has the correct width and height. I tested your code using Flutter 3.16.1 on a real iPhone. Which version of Flutter are you using?
If anyone still has this bug, please post the code used and also a screen record of it.
Hi @Vis5 , @gabriieelreeis , @Pinkippo, @RosenX
I am also facing the same issue inside webview. We have a video player in iFrame and on Rotation and Full Screen Exit, Orientation is broken.
Which version of flutter are you guys using?
@pichillilorenzo I am using flutter version - Flutter 3.13.4
flutter --version Flutter 3.13.4 • channel stable • https://github.com/flutter/flutter.git Framework • revision 367f9ea16b (5 months ago) • 2023-09-12 23:27:53 -0500 Engine • revision 9064459a8b Tools • Dart 3.1.2 • DevTools 2.25.0
I was using 3.10.x I haven't bothered to check on the latest version since then.
@pichillilorenzo I'd love to if I was still working on the project. I hope one of the other guys provide you with MRE and screen record on the latest version.
IIRC I downgraded the package to 5.x to workaround the issue.
Hello @SumanHansada , I'm using Flutter version 3.13.5. Unfortunately, I couldn't resolve the issue, so I've added a full-screen ban feature specifically for iOS
We have the same issue on iOS devices & the flutter doctor is as follows: for Flutter version 3.13.4
[!] Flutter (Channel stable, 3.13.4, on macOS 14.2.1 23C71 darwin-arm64, locale en-IN)
! Warning: `dart` on your path resolves to /opt/homebrew/Cellar/dart/2.18.4/libexec/bin/dart, which is not inside your current Flutter SDK checkout at /Users/pawanshahani/fvm/3.13.4. Consider adding /Users/pawanshahani/fvm/3.13.4/bin to the front of your path.
[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
[✓] Xcode - develop for iOS and macOS (Xcode 15.2)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2023.1)
[✓] VS Code (version 1.86.2)
[✓] Connected device (2 available)
! Error: Browsing on the local area network for iPhone 13. Ensure the device is unlocked and attached with a cable or associated with the same local area network as this Mac.
The device must be opted into Developer Mode to connect wirelessly. (code -27)
[✓] Network resources
! Doctor found issues in 1 category.
Here is the video of it.. @PawanFyers, @Pinkippo, @Vis5, @gabriieelreeis , @RosenX, @pichillilorenzo
I am using the latest flutter and latest flutter_inappwebview
Flutter version using fvm:
Version | Channel | Flutter Version | Dart Version | Release Date | Global |
---|---|---|---|---|---|
3.19.0 | stable | 3.19.0 | 3.3.0 | Feb 15, 2024 | ● |
flutter_inappwebview: ^6.0.0
is happening with me too, on iphone x with 16.4.0 ios. using flutter 3.16.0
Here is a MRE. For me, the issue is slightly different but I think the core issue is the same. Here's how to reproduce it in my example:
- Once the page fully loads, play the video
- Go fullscreen
- Switch to landscape mode
- Exit fullscreen
- Switch to portrait mode
When you switch back to portrait mode, the web view shows the page in the landscape width so it looks cut off in the portrait mode. Only happens with iOS, Android is working fine as expected.
EDIT: MRE removed
I have same issue:
- IOS 17 -> not happen
- IOS <= 16 -> issue happen