From e3ac0d3464ded265c0ec4e051bf05c404a02940d Mon Sep 17 00:00:00 2001 From: Masashi Aso Date: Sat, 2 May 2026 11:31:48 +0900 Subject: [PATCH 1/2] fix: show value for simple tiles on iOS --- .../lib/screens/gallery/cross_platform_settings_screen.dart | 3 ++- lib/src/tiles/platforms/ios_settings_tile.dart | 6 ++++-- 2 files changed, 6 insertions(+), 3 deletions(-) diff --git a/example/lib/screens/gallery/cross_platform_settings_screen.dart b/example/lib/screens/gallery/cross_platform_settings_screen.dart index 508a224..734f183 100644 --- a/example/lib/screens/gallery/cross_platform_settings_screen.dart +++ b/example/lib/screens/gallery/cross_platform_settings_screen.dart @@ -110,9 +110,10 @@ class _CrossPlatformSettingsScreenState SettingsSection( title: Text('Account'), tiles: [ - SettingsTile.navigation( + SettingsTile( leading: Icon(Icons.phone), title: Text('Phone number'), + value: Text('+1 123 456 789'), ), SettingsTile.navigation( leading: Icon(Icons.mail), diff --git a/lib/src/tiles/platforms/ios_settings_tile.dart b/lib/src/tiles/platforms/ios_settings_tile.dart index 8bf0abb..d1e7011 100644 --- a/lib/src/tiles/platforms/ios_settings_tile.dart +++ b/lib/src/tiles/platforms/ios_settings_tile.dart @@ -290,8 +290,10 @@ class IOSSettingsTileState extends State { ), // Value is Flexible here so it can shrink without // pushing the title when the text is long. (Issue #186) - if (widget.tileType == - SettingsTileType.navigationTile && + if ((widget.tileType == + SettingsTileType.navigationTile || + widget.tileType == + SettingsTileType.simpleTile) && widget.value != null) Flexible( child: DefaultTextStyle( From e33a0dd22213ad466fc222c3e9cad76dbadf65a3 Mon Sep 17 00:00:00 2001 From: Masashi Aso Date: Sat, 2 May 2026 12:27:29 +0900 Subject: [PATCH 2/2] fix: refine iOS tile value layout --- .../cross_platform_settings_screen.dart | 1 + .../tiles/platforms/ios_settings_tile.dart | 147 +++++++++++------- 2 files changed, 90 insertions(+), 58 deletions(-) diff --git a/example/lib/screens/gallery/cross_platform_settings_screen.dart b/example/lib/screens/gallery/cross_platform_settings_screen.dart index 734f183..8ad2379 100644 --- a/example/lib/screens/gallery/cross_platform_settings_screen.dart +++ b/example/lib/screens/gallery/cross_platform_settings_screen.dart @@ -118,6 +118,7 @@ class _CrossPlatformSettingsScreenState SettingsTile.navigation( leading: Icon(Icons.mail), title: Text('Email'), + value: Text('user@example.com'), enabled: false, ), SettingsTile.navigation( diff --git a/lib/src/tiles/platforms/ios_settings_tile.dart b/lib/src/tiles/platforms/ios_settings_tile.dart index d1e7011..73858af 100644 --- a/lib/src/tiles/platforms/ios_settings_tile.dart +++ b/lib/src/tiles/platforms/ios_settings_tile.dart @@ -128,8 +128,6 @@ class IOSSettingsTileState extends State { } /// Returns the non-value trailing controls (switch, trailing icon, chevron). - /// The value widget is placed directly in the inner Row of [buildTileContent] - /// as a [Flexible] so it can shrink without pushing the title. Widget buildTrailing({ required BuildContext context, required SettingsTheme theme, @@ -193,6 +191,10 @@ class IOSSettingsTileState extends State { IOSSettingsTileAdditionalInfo additionalInfo, ) { final textScaler = MediaQuery.textScalerOf(context); + final shouldShowInlineValue = + (widget.tileType == SettingsTileType.navigationTile || + widget.tileType == SettingsTileType.simpleTile) && + widget.value != null; return GestureDetector( behavior: HitTestBehavior.translucent, @@ -242,71 +244,100 @@ class IOSSettingsTileState extends State { Padding( padding: const EdgeInsetsDirectional.only(end: 16), child: Row( + crossAxisAlignment: CrossAxisAlignment.center, children: [ Expanded( - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Padding( - padding: widget.titlePadding ?? - EdgeInsetsDirectional.only( - top: textScaler - .scale(widget.compact ? 6.0 : 12.5), - bottom: widget.titleDescription == null - ? textScaler.scale( - widget.compact ? 6.0 : 12.5) - : textScaler.scale( - widget.compact ? 2.0 : 3.5), - ), - child: DefaultTextStyle( - style: (theme.themeData.tileTextStyle ?? - const TextStyle(fontSize: 16)) - .copyWith( - color: widget.enabled - ? theme.themeData.settingsTileTextColor - : theme.themeData.inactiveTitleColor, + child: LayoutBuilder( + builder: (context, constraints) => Row( + children: [ + ConstrainedBox( + constraints: BoxConstraints( + maxWidth: constraints.maxWidth, + ), + child: Column( + crossAxisAlignment: + CrossAxisAlignment.start, + children: [ + Padding( + padding: widget.titlePadding ?? + EdgeInsetsDirectional.only( + top: textScaler.scale( + widget.compact ? 6.0 : 12.5, + ), + bottom: widget.titleDescription == + null + ? textScaler.scale( + widget.compact + ? 6.0 + : 12.5, + ) + : textScaler.scale( + widget.compact + ? 2.0 + : 3.5, + ), + ), + child: DefaultTextStyle( + style: + (theme.themeData.tileTextStyle ?? + const TextStyle( + fontSize: 16, + )) + .copyWith( + color: widget.enabled + ? theme.themeData + .settingsTileTextColor + : theme.themeData + .inactiveTitleColor, + ), + child: widget.title!, + ), + ), + if (widget.titleDescription != null) + Padding( + padding: widget + .titleDescriptionPadding ?? + EdgeInsetsDirectional.only( + bottom: textScaler.scale(12.5), + ), + child: DefaultTextStyle( + style: TextStyle( + color: widget.enabled + ? theme + .themeData.titleTextColor + : theme.themeData + .inactiveTitleColor, + fontSize: 15, + ), + child: widget.titleDescription!, + ), + ), + ], ), - child: widget.title!, ), - ), - if (widget.titleDescription != null) - Padding( - padding: widget.titleDescriptionPadding ?? - EdgeInsetsDirectional.only( - bottom: textScaler.scale(12.5), + if (shouldShowInlineValue) + Expanded( + child: Align( + alignment: AlignmentDirectional.centerEnd, + child: DefaultTextStyle( + style: TextStyle( + color: widget.enabled + ? theme + .themeData.trailingTextColor + : theme + .themeData.inactiveTitleColor, + fontSize: 17, + ), + overflow: TextOverflow.ellipsis, + textAlign: TextAlign.end, + child: widget.value!, ), - child: DefaultTextStyle( - style: TextStyle( - color: widget.enabled - ? theme.themeData.titleTextColor - : theme.themeData.inactiveTitleColor, - fontSize: 15, ), - child: widget.titleDescription!, ), - ), - ], - ), - ), - // Value is Flexible here so it can shrink without - // pushing the title when the text is long. (Issue #186) - if ((widget.tileType == - SettingsTileType.navigationTile || - widget.tileType == - SettingsTileType.simpleTile) && - widget.value != null) - Flexible( - child: DefaultTextStyle( - style: TextStyle( - color: widget.enabled - ? theme.themeData.trailingTextColor - : theme.themeData.inactiveTitleColor, - fontSize: 17, - ), - overflow: TextOverflow.ellipsis, - child: widget.value!, + ], ), ), + ), buildTrailing(context: context, theme: theme), ], ),