Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[CupertinoActionSheet] Fix the layout (part 1) (#149636)
This PR fixes the general layout of `CupertinoActionSheet` to match the native behavior. This PR adjusts the height of buttons, the height of the content section, the gap between the cancel button and the main sheet, and most importantly, the maximum height of the action sheet. The maximum height is the trickiest part. I tried to figure out a rule, and found that the top padding only depends the type of the device - notch-less, notch, capsule - but there isn't a clear rule that can unify the 3 padding numbers. This PR uses linear interpolation as a heuristic algorithm. See the in-code comment for details. * What about iPad? Well, action sheets look completely different on iPad, more similar to a drop down menu. This might be fixed in the future. ### Tests Among all the test changes, there are a few tests that have been converted to using `AnimationSheetRecorder` to verify the animation changes. Before the PR they were checking the height at each from, which is hard to reason whether a change makes sense, and hard to modify if anything needs changing. ### Result demo The following images compares native(left) with Flutter after PR (right) by stacking them closely, and show that their layout really match almost pixel perfect. <img width="455" alt="image" src="https://github.com/flutter/flutter/assets/1596656/f8be35bd-0da5-4908-92f7-7a1f4e999229"> _No notch (iPhone 13)_ <img width="405" alt="image" src="https://github.com/flutter/flutter/assets/1596656/54a37c2f-cd99-4e3b-86f0-045b1dfdbbb8"> _Notch (iPhone 13)_ <img width="385" alt="image" src="https://github.com/flutter/flutter/assets/1596656/546ab529-0b62-4e3d-9019-ef900d3552e5"> _Capsule (iPhone 15 Plus)_ <img width="1142" alt="image" src="https://github.com/flutter/flutter/assets/1596656/e06b6dac-dbcd-48f7-9dee-83700ae680e0"> _iPhone 13 landscape_ <img width="999" alt="image" src="https://github.com/flutter/flutter/assets/1596656/698cf530-51fc-4906-90a5-7a3ab626f489"> _All "capsule" devices share the same top padding in logical pixels (iPhone 15 Pro Max, iPhone 15 Pro, iPhone 15 Plus)_
- Loading branch information