Skip to content

Commit

Permalink
💄 Update style usages for ThemeData (fluttercandies#519)
Browse files Browse the repository at this point in the history 
Resolves fluttercandies#500.
  • Loading branch information
@AlexV525
AlexV525 authored Dec 7, 2023
1 parent 3013f86 commit ec7adc1
Show file tree
Hide file tree
Showing 5 changed files with 109 additions and 96 deletions.
4 changes: 4 additions & 0 deletions CHANGELOG.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,10 @@ See the [Migration Guide](guides/migration_guide.md) for the details of breaking

- Integrate `PermissionRequestOption` for callers.

### Improvements

- Adapt `ThemeData` usages.

## 8.9.0-dev.1

### Breaking changes
Expand Down
32 changes: 18 additions & 14 deletions lib/src/delegates/asset_picker_builder_delegate.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1434,7 +1434,7 @@ class DefaultAssetPickerBuilderDelegate
gradient: LinearGradient(
begin: AlignmentDirectional.bottomCenter,
end: AlignmentDirectional.topCenter,
colors: <Color>[theme.dividerColor, Colors.transparent],
colors: <Color>[theme.splashColor, Colors.transparent],
),
),
child: Padding(
Expand Down Expand Up @@ -1465,7 +1465,7 @@ class DefaultAssetPickerBuilderDelegate
gradient: LinearGradient(
begin: AlignmentDirectional.topCenter,
end: AlignmentDirectional.bottomCenter,
colors: <Color>[theme.dividerColor, Colors.transparent],
colors: <Color>[theme.splashColor, Colors.transparent],
),
),
child: Padding(
Expand Down Expand Up @@ -1502,7 +1502,7 @@ class DefaultAssetPickerBuilderDelegate
height: appBarItemHeight,
padding: const EdgeInsets.symmetric(horizontal: 12),
color: theme.colorScheme.secondary,
disabledColor: theme.dividerColor,
disabledColor: theme.splashColor,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(3),
),
Expand Down Expand Up @@ -1745,7 +1745,7 @@ class DefaultAssetPickerBuilderDelegate
padding: const EdgeInsetsDirectional.only(start: 12, end: 6),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(999),
color: theme.dividerColor,
color: theme.focusColor,
),
child: Selector<DefaultAssetPickerProvider,
PathWrapper<AssetPathEntity>?>(
Expand Down Expand Up @@ -2107,7 +2107,7 @@ class DefaultAssetPickerBuilderDelegate
gradient: LinearGradient(
begin: AlignmentDirectional.bottomCenter,
end: AlignmentDirectional.topCenter,
colors: <Color>[theme.dividerColor, Colors.transparent],
colors: <Color>[theme.splashColor, Colors.transparent],
),
),
child: Row(
Expand Down Expand Up @@ -2147,7 +2147,9 @@ class DefaultAssetPickerBuilderDelegate
padding: const EdgeInsets.symmetric(horizontal: 20).copyWith(
bottom: context.bottomPadding,
),
color: theme.primaryColor.withOpacity(isAppleOS(context) ? .9 : 1),
color: theme.bottomAppBarTheme.color?.withOpacity(
theme.bottomAppBarTheme.color!.opacity * (isAppleOS(context) ? .9 : 1),
),
child: Row(
children: <Widget>[
if (isPreviewEnabled) previewButton(context),
Expand All @@ -2162,15 +2164,17 @@ class DefaultAssetPickerBuilderDelegate
children: <Widget>[accessLimitedBottomTip(context), child],
);
}
child = ClipRect(
child: BackdropFilter(
filter: ui.ImageFilter.blur(
sigmaX: appleOSBlurRadius,
sigmaY: appleOSBlurRadius,
if (isAppleOS(context)) {
child = ClipRect(
child: BackdropFilter(
filter: ui.ImageFilter.blur(
sigmaX: appleOSBlurRadius,
sigmaY: appleOSBlurRadius,
),
child: child,
),
child: child,
),
);
);
}
return child;
}

Expand Down
44 changes: 38 additions & 6 deletions lib/src/delegates/asset_picker_delegate.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -241,14 +241,30 @@ class AssetPickerDelegate {
selectionHandleColor: themeColor,
),
indicatorColor: themeColor,
appBarTheme: const AppBarTheme(
systemOverlayStyle: SystemUiOverlayStyle(
appBarTheme: AppBarTheme(
backgroundColor: Colors.grey[100],
systemOverlayStyle: const SystemUiOverlayStyle(
statusBarBrightness: Brightness.light,
statusBarIconBrightness: Brightness.dark,
),
iconTheme: IconThemeData(color: Colors.grey[900]),
elevation: 0,
),
bottomAppBarTheme: BottomAppBarTheme(
color: Colors.grey[100],
),
buttonTheme: ButtonThemeData(buttonColor: themeColor),
iconTheme: IconThemeData(color: Colors.grey[900]),
checkboxTheme: CheckboxThemeData(
checkColor: MaterialStateProperty.all(Colors.black),
fillColor: MaterialStateProperty.resolveWith((states) {
if (states.contains(MaterialState.selected)) {
return themeColor;
}
return null;
}),
side: const BorderSide(color: Colors.black),
),
colorScheme: ColorScheme(
primary: Colors.grey[50]!,
secondary: themeColor,
Expand All @@ -257,7 +273,7 @@ class AssetPickerDelegate {
brightness: Brightness.light,
error: const Color(0xffcf6679),
onPrimary: Colors.white,
onSecondary: Colors.white,
onSecondary: Colors.grey[100]!,
onSurface: Colors.black,
onBackground: Colors.black,
onError: Colors.white,
Expand All @@ -278,14 +294,30 @@ class AssetPickerDelegate {
selectionHandleColor: themeColor,
),
indicatorColor: themeColor,
appBarTheme: const AppBarTheme(
systemOverlayStyle: SystemUiOverlayStyle(
appBarTheme: AppBarTheme(
backgroundColor: Colors.grey[850],
systemOverlayStyle: const SystemUiOverlayStyle(
statusBarBrightness: Brightness.dark,
statusBarIconBrightness: Brightness.light,
),
iconTheme: const IconThemeData(color: Colors.white),
elevation: 0,
),
bottomAppBarTheme: BottomAppBarTheme(
color: Colors.grey[850],
),
buttonTheme: ButtonThemeData(buttonColor: themeColor),
iconTheme: const IconThemeData(color: Colors.white),
checkboxTheme: CheckboxThemeData(
checkColor: MaterialStateProperty.all(Colors.white),
fillColor: MaterialStateProperty.resolveWith((states) {
if (states.contains(MaterialState.selected)) {
return themeColor;
}
return null;
}),
side: const BorderSide(color: Colors.white),
),
colorScheme: ColorScheme(
primary: Colors.grey[900]!,
secondary: themeColor,
Expand All @@ -294,7 +326,7 @@ class AssetPickerDelegate {
brightness: Brightness.dark,
error: const Color(0xffcf6679),
onPrimary: Colors.black,
onSecondary: Colors.black,
onSecondary: Colors.grey[850]!,
onSurface: Colors.white,
onBackground: Colors.white,
onError: Colors.black,
Expand Down
111 changes: 41 additions & 70 deletions lib/src/delegates/asset_picker_viewer_builder_delegate.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ import '../delegates/asset_picker_text_delegate.dart';
import '../internal/singleton.dart';
import '../provider/asset_picker_provider.dart';
import '../provider/asset_picker_viewer_provider.dart';
import '../widget/asset_picker_app_bar.dart';
import '../widget/asset_picker_viewer.dart';
import '../widget/builder/audio_page_builder.dart';
import '../widget/builder/fade_image_builder.dart';
Expand Down Expand Up @@ -537,7 +538,10 @@ class DefaultAssetPickerViewerBuilderDelegate

@override
Widget bottomDetailBuilder(BuildContext context) {
final Color backgroundColor = themeData.primaryColor.withOpacity(.9);
final backgroundColor = themeData.bottomAppBarTheme.color?.withOpacity(
themeData.bottomAppBarTheme.color!.opacity *
(isAppleOS(context) ? .9 : 1),
);
return ValueListenableBuilder2<bool, int>(
firstNotifier: isDisplayingDetail,
secondNotifier: selectedNotifier,
Expand Down Expand Up @@ -694,72 +698,40 @@ class DefaultAssetPickerViewerBuilderDelegate
/// AppBar widget.
/// 顶栏部件
Widget appBar(BuildContext context) {
return ValueListenableBuilder<bool>(
valueListenable: isDisplayingDetail,
builder: (_, bool value, Widget? child) => AnimatedPositionedDirectional(
duration: kThemeAnimationDuration,
curve: Curves.easeInOut,
top: value ? 0.0 : -(context.topPadding + kToolbarHeight),
start: 0.0,
end: 0.0,
height: context.topPadding + kToolbarHeight,
child: child!,
return AssetPickerAppBar(
leading: Semantics(
sortKey: ordinalSortKey(0),
child: IconButton(
tooltip: MaterialLocalizations.of(context).backButtonTooltip,
onPressed: Navigator.of(context).maybePop,
icon: const Icon(Icons.close),
),
),
child: Container(
padding: EdgeInsetsDirectional.only(top: context.topPadding),
color: themeData.canvasColor,
child: Row(
children: <Widget>[
Expanded(
child: Align(
alignment: AlignmentDirectional.centerStart,
child: Semantics(
sortKey: ordinalSortKey(0),
child: IconButton(
icon: const Icon(Icons.close),
tooltip: MaterialLocalizations.of(
context,
).backButtonTooltip,
onPressed: Navigator.of(context).maybePop,
centerTitle: true,
title: specialPickerType == null
? Semantics(
sortKey: ordinalSortKey(0.1),
child: StreamBuilder<int>(
initialData: currentIndex,
stream: pageStreamController.stream,
builder: (_, AsyncSnapshot<int> snapshot) => ScaleText(
'${snapshot.requireData + 1}/${previewAssets.length}',
style: const TextStyle(
fontSize: 17,
fontWeight: FontWeight.w500,
),
),
),
),
if (specialPickerType == null)
Expanded(
child: Center(
child: Semantics(
sortKey: ordinalSortKey(0.1),
child: StreamBuilder<int>(
initialData: currentIndex,
stream: pageStreamController.stream,
builder: (_, AsyncSnapshot<int> snapshot) => ScaleText(
'${snapshot.requireData + 1}/${previewAssets.length}',
style: const TextStyle(
fontSize: 17,
fontWeight: FontWeight.w500,
),
),
),
),
),
),
if (provider != null)
Expanded(
child: Container(
alignment: AlignmentDirectional.centerEnd,
padding: const EdgeInsetsDirectional.only(end: 14),
child: Semantics(
sortKey: ordinalSortKey(0.2),
child: selectButton(context),
),
),
)
else
const Spacer(),
],
),
),
)
: null,
actions: [
if (provider != null)
Semantics(
sortKey: ordinalSortKey(0.2),
child: selectButton(context),
),
const SizedBox(width: 14),
],
);
}

Expand Down Expand Up @@ -819,7 +791,7 @@ class DefaultAssetPickerViewerBuilderDelegate
height: 32,
padding: const EdgeInsets.symmetric(horizontal: 12),
color: themeData.colorScheme.secondary,
disabledColor: themeData.dividerColor,
disabledColor: themeData.splashColor,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(3),
),
Expand Down Expand Up @@ -911,13 +883,12 @@ class DefaultAssetPickerViewerBuilderDelegate
builder: (_, Widget? w) => StreamBuilder<int>(
initialData: currentIndex,
stream: pageStreamController.stream,
builder: (BuildContext _, AsyncSnapshot<int> s) {
builder: (_, s) {
final AssetEntity asset = previewAssets.elementAt(s.data!);
return Selector<AssetPickerViewerProvider<AssetEntity>,
List<AssetEntity>>(
selector: (_, AssetPickerViewerProvider<AssetEntity> p) =>
p.currentlySelectedAssets,
builder: (BuildContext c, List<AssetEntity> assets, _) {
selector: (_, p) => p.currentlySelectedAssets,
builder: (context, assets, _) {
final bool isSelected = assets.contains(asset);
return Semantics(
selected: isSelected,
Expand All @@ -929,9 +900,9 @@ class DefaultAssetPickerViewerBuilderDelegate
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
if (isAppleOS(context))
_appleOSSelectButton(c, isSelected, asset)
_appleOSSelectButton(context, isSelected, asset)
else
_androidSelectButton(c, isSelected, asset),
_androidSelectButton(context, isSelected, asset),
if (!isAppleOS(context))
ScaleText(
textDelegate.select,
Expand Down
14 changes: 8 additions & 6 deletions lib/src/widget/asset_picker_app_bar.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -102,8 +102,6 @@ class AssetPickerAppBar extends StatelessWidget implements PreferredSizeWidget {
@override
Widget build(BuildContext context) {
final ThemeData theme = Theme.of(context);
final AppBarTheme appBarTheme = theme.appBarTheme;
final IconThemeData iconTheme = this.iconTheme ?? theme.iconTheme;
final Widget? titleWidget;
if (centerTitle) {
titleWidget = Center(child: title);
Expand Down Expand Up @@ -174,16 +172,20 @@ class AssetPickerAppBar extends StatelessWidget implements PreferredSizeWidget {
);
}

/// Apply the icon theme data.
child = IconTheme.merge(data: iconTheme, child: child);
final AppBarTheme appBarTheme = theme.appBarTheme;

final Color effectiveBackgroundColor =
backgroundColor ?? theme.colorScheme.surface;
/// Apply the icon theme data.
child = IconTheme.merge(
data: iconTheme ?? appBarTheme.iconTheme ?? theme.iconTheme,
child: child,
);

// Set [SystemUiOverlayStyle] according to the brightness.
final Brightness effectiveBrightness = brightness ??
appBarTheme.systemOverlayStyle?.statusBarBrightness ??
theme.brightness;
final Color effectiveBackgroundColor =
backgroundColor ?? theme.colorScheme.surface;
final SystemUiOverlayStyle overlayStyle = appBarTheme.systemOverlayStyle ??
SystemUiOverlayStyle(
statusBarColor: effectiveBackgroundColor,
Expand Down

0 comments on commit ec7adc1

Please sign in to comment.