[documentation] provide clearer info about AspectRatio requirements #31911
Description
I ran into something that I found quite unexpecting when trying to play a video in the background, covering the entire device.
Too me, it seems like a FittetBox(fit: BoxFit.cover) with a AspectRatio() would be a prefect fit. But unfortunately, they don't really work together. Here was the full tree of my first attempt:
FittetBox(
fit: BoxFit.cover,
child: AspectRatio(
aspectRatio: 750 / 1624,
child: VideoPlayer(),
),
),VideoPlayer here is from the video_player package, but could be any widget that just draws on whatever size they get, not imposing any constraints themselves.
I think that the problem here is that the FittedBox will try to layout it's child, then look at the width and height, and scale that while maintaining an aspect ration to fit the box.
What I would really like in this case though, is to just read the aspect ratio from the AspectRatio child, and then calculate the appropriate width and height from that.
Would it make sense to have a special case in FittedBox for AspectRatio, or is this just not how it's supposed to work? 🤔
For anyone facing the same problem, it can be solved by replacing AspectRatio(aspectRatio: 750 / 1624) with SizedBox(width: 750, height: 1624). The SizedBox will be scaled to the correct size, while maintaining the aspect ratio.
Steps to Reproduce
- Put the above code into a flutter app
- Add a video controller with any video file
- Run app and watch results
Logs
Analyzing flutter...
No issues found! (ran in 4.0s)
[✓] Flutter (Channel dev, v1.5.8, on Mac OS X 10.14.4 18E226, locale en-GB)
• Flutter version 1.5.8 at /Users/linus/coding/flutter
• Framework revision 0ba67226ee (7 days ago), 2019-04-24 17:18:28 -0700
• Engine revision c63d1cf9c9
• Dart version 2.3.0 (build 2.3.0-dev.0.1 1f1592edce)
[✓] Android toolchain - develop for Android devices (Android SDK version 28.0.3)
• Android SDK at /usr/local/share/android-sdk
• Android NDK location not configured (optional; useful for native profiling support)
• Platform android-28, build-tools 28.0.3
• ANDROID_HOME = /usr/local/share/android-sdk
• ANDROID_SDK_ROOT = /usr/local/share/android-sdk
• Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java
• Java version OpenJDK Runtime Environment (build 1.8.0_152-release-1136-b06)
• All Android licenses accepted.
[✓] iOS toolchain - develop for iOS devices (Xcode 10.2.1)
• Xcode at /Applications/Xcode.app/Contents/Developer
• Xcode 10.2.1, Build version 10E1001
• ios-deploy 1.9.4
• CocoaPods version 1.6.1
[✓] Android Studio (version 3.2)
• Android Studio at /Applications/Android Studio.app/Contents
• Flutter plugin version 31.3.1
• Dart plugin version 181.5656
• Java version OpenJDK Runtime Environment (build 1.8.0_152-release-1136-b06)
[✓] VS Code (version 1.33.1)
• VS Code at /Applications/Visual Studio Code.app/Contents
• Flutter extension version 2.25.1
[✓] Connected device (1 available)
• Linus Unnebäck’s iPhone • f94aa6361e142ab9641a700b2eb487e8611738f4 • ios • iOS 12.2
• No issues found!