commit | a9d377da228a250a4b401ea0683eb882b997297c | [log] [tgz] |
---|---|---|
author | Jamie Kerber <kerber.jg@gmail.com> | Mon Aug 12 21:26:39 2024 +0200 |
committer | dart-internal-monorepo <dart-internal-monorepo@dart-ci-internal.iam.gserviceaccount.com> | Mon Aug 12 12:33:41 2024 -0700 |
tree | f3087df935114f68565de650535fe7268d717124 | |
parent | d4700efaa8de920f774002499e611d5560441696 [diff] |
Implemented CupertinoButton new styles/sizes (fixes #92525) (#152845) This PR fixes #92525 and introduces the following changes according to [latest iOS HIG](https://developer.apple.com/design/human-interface-guidelines/buttons#iOS-iPadOS): - `CupertinoButton` now has a `size` property (type `enum CupertinoButtonSize`, values sm/md/lg, default `lg`) that allows the devs to apply new iOS 15+ button styles - Previously `CupertinoButton` had a larger padding when no background color was specified. With the new HIG, that is no longer the case - `CupertinoButton` now has a `.tinted` constructor that renders a translucent background (transparency % is brightness-dependent) and uses a different foreground color compared to `.filled` - `CupertinoButton` now uses the `actionTextStyle` TextStyle from the given theme - `CupertinoButton`'s child IconTheme's size will always be x1.2 the given TextStyle's size - `CupertinoTextThemeData` now has a `actionSmallTextStyle` property to use with small buttons (including a default `_kDefaultActionSmallTextStyle` TextStyle) Preview & example:  > **NOTE**: there is a discrepancy in dark mode button foreground color between the default CupertinoTheme and the HIG. A separate issue will be opened for this. ~EDIT: issue reported here https://github.com/flutter/flutter/issues/152846~ EDIT2: fixed by #153039 !  ## Example ```dart import 'package:flutter/cupertino.dart'; const Widget body = Row( mainAxisSize: MainAxisSize.min, mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[ Icon( CupertinoIcons.play_fill, ), Text("Play"), ], ); void main() => runApp( CupertinoApp( home: Container( child: Wrap( direction: Axis.horizontal, children: <Widget>[ // header Text(''), Text('Plain'), Text('Grey'), Text('Tinted'), Text('Filled'), // small Text('Small'), CupertinoButton( child: body, onPressed: () {}, size: CupertinoButtonSize.small, ), CupertinoButton.tinted( child: body, onPressed: () {}, size: CupertinoButtonSize.small, color: CupertinoColors.systemGrey, ), CupertinoButton.tinted( child: body, onPressed: () {}, size: CupertinoButtonSize.small, ), CupertinoButton.filled( child: body, onPressed: () {}, size: CupertinoButtonSize.small, ), // medium Text('Medium'), CupertinoButton( child: body, onPressed: () {}, size: CupertinoButtonSize.medium, ), CupertinoButton.tinted( child: body, onPressed: () {}, size: CupertinoButtonSize.medium, color: CupertinoColors.systemGrey, ), CupertinoButton.tinted( child: body, onPressed: () {}, size: CupertinoButtonSize.medium, ), CupertinoButton.filled( child: body, onPressed: () {}, size: CupertinoButtonSize.medium, ), // large Text('Large'), CupertinoButton( child: body, onPressed: () {}, size: CupertinoButtonSize.large, ), CupertinoButton.tinted( child: body, onPressed: () {}, color: CupertinoColors.systemGrey, size: CupertinoButtonSize.large, ), CupertinoButton.tinted( child: body, onPressed: () {}, size: CupertinoButtonSize.large, ), CupertinoButton.filled( child: body, onPressed: () {}, size: CupertinoButtonSize.large, ), ].map((Widget w) => SizedBox(width: 110, height: 70, child: Center(child: w))).toList(), ), ) ), ); ``` *List which issues are fixed by this PR. You must list at least one issue. An issue is not required if the PR fixes something trivial like a typo.* *If you had to change anything in the [flutter/tests] repo, include a link to the migration guide as per the [breaking change policy].* https://dart.googlesource.com/external/github.com/flutter/flutter/+/dae3a87d936e0addb6734ba00635112e03318e94
Monorepo is:
With depot_tools installed and on your path, create a directory for your monorepo checkout and run these commands to create a gclient solution in that directory:
mkdir monorepo cd monorepo gclient config --unmanaged https://dart.googlesource.com/monorepo gclient sync -D
This gives you a checkout in the monorepo directory that contains:
monorepo/ DEPS - the DEPS used for this gclient checkout commits.json - the pinned commits for Dart, flutter/engine, and flutter/flutter tools/ - scripts used to create monorepo DEPS engine/src/ - the flutter/buildroot repo flutter/ - the flutter/engine repo out/ - the build directory, where Flutter engine builds are created third_party/ - Flutter dependencies checked out by DEPS dart/ - the Dart SDK checkout. third_party - Dart dependencies, also used by Flutter flutter/ - the flutter/flutter repo
Flutter's instructions for building the engine are at Compiling the engine
They can be followed closely, with a few changes:
goma_ctl ensure_start
is sufficient.Example build commands that work on linux:
MONOREPO_PATH=$PWD if [[ ! $PATH =~ (^|:)$MONOREPO_PATH/flutter/bin(:|$) ]]; then PATH=$MONOREPO_PATH/flutter/bin:$PATH fi export GOMA_DIR=$(dirname $(command -v gclient))/.cipd_bin goma_ctl ensure_start pushd engine/src flutter/tools/gn --goma --no-prebuilt-dart-sdk --unoptimized --full-dart-sdk autoninja -C out/host_debug_unopt popd
The Flutter commands used to build and run apps will use the locally built Flutter engine and Dart SDK, instead of the one downloaded by the Flutter tool, if the --local-engine
option is provided.
For example, to build and run the Flutter spinning square sample on the web platform,
MONOREPO_PATH=$PWD cd flutter/examples/layers flutter --local-engine=host_debug_unopt \ -d chrome run widgets/spinning_square.dart cd $MONOREPO_PATH
To build for desktop, specify the desktop platform device in flutter run
as -d macos
or -d linux
or -d windows
. You may also need to run the command
flutter create --platforms=windows,macos,linux
on existing apps, such as sample apps. New apps created with flutter create
already include these support files. Details of desktop support are at Desktop Support for Flutter
Tests in the Flutter source tree can be run with the flutter test
command, run in the directory of a package containing tests. For example:
MONOREPO_PATH=$PWD cd flutter/packages/flutter flutter test --local-engine=host_debug_unopt cd $MONOREPO_PATH
Please file an issue or email the dart-engprod team with any problems with or questions about using monorepo.
We will update this documentation to address them.
flutter
commands may download the engine and Dart SDK files for the configured channel, even though they will be using the local engine and its SDK.gclient sync
needs to be run in an administrator session, because some installed dependencies create symlinks.