Skip to content

Commit

Permalink
fix: mobile track collection search bar position and page_window_titl…
Browse files Browse the repository at this point in the history 
…e_bar exception on mobile platforms
  • Loading branch information
@KRTirtho
KRTirtho committed Jan 6, 2023
1 parent a06cd0d commit d0aaa97
Show file tree
Hide file tree
Showing 4 changed files with 120 additions and 98 deletions.
11 changes: 7 additions & 4 deletions lib/components/library/user_artists.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -56,10 +56,13 @@ class UserArtists extends HookConsumerWidget {
preferredSize: const Size.fromHeight(50),
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 8.0),
child: PlatformTextField(
onChanged: (value) => searchText.value = value,
prefixIcon: Icons.filter_alt_outlined,
placeholder: 'Filter artists...',
child: ColoredBox(
color: PlatformTheme.of(context).scaffoldBackgroundColor!,
child: PlatformTextField(
onChanged: (value) => searchText.value = value,
prefixIcon: Icons.filter_alt_outlined,
placeholder: 'Filter artists...',
),
),
),
),
Expand Down
2 changes: 1 addition & 1 deletion lib/components/shared/page_window_title_bar.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,7 @@ class PageWindowTitleBar extends StatefulHookWidget with PreferredSizeWidget {
class _PageWindowTitleBarState extends State<PageWindowTitleBar> {
@override
Widget build(BuildContext context) {
final isMaximized = useState(appWindow.isMaximized);
final isMaximized = useState(kIsDesktop ? appWindow.isMaximized : false);

useEffect(() {
if (platform == TargetPlatform.windows &&
Expand Down
197 changes: 105 additions & 92 deletions lib/components/shared/track_table/track_collection_view.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -141,51 +141,63 @@ class TrackCollectionView<T> extends HookConsumerWidget {
return () => controller.removeListener(listener);
}, [collapsed.value]);

final leading = Row(
mainAxisSize: MainAxisSize.min,
children: [
if (platform != TargetPlatform.windows)
PlatformBackButton(color: color?.titleTextColor),
const SizedBox(width: 10),
ConstrainedBox(
constraints: const BoxConstraints(
maxWidth: 400,
maxHeight: 40,
),
child: PlatformTextField(
onChanged: (value) => searchText.value = value,
placeholder: "Search tracks...",
backgroundColor: Colors.transparent,
prefixIcon: Icons.search_rounded,
),
final searchbar = ConstrainedBox(
constraints: const BoxConstraints(
maxWidth: 400,
maxHeight: 50,
),
child: PlatformTextField(
onChanged: (value) => searchText.value = value,
placeholder: "Search tracks...",
backgroundColor: Colors.transparent,
focusedBackgroundColor: Colors.transparent,
style: TextStyle(
color: color?.titleTextColor,
),
placeholderStyle: TextStyle(
color: color?.titleTextColor,
),
],
focusedStyle: TextStyle(
color: color?.titleTextColor,
),
borderColor: color?.titleTextColor,
prefixIconColor: color?.titleTextColor,
cursorColor: color?.titleTextColor,
prefixIcon: Icons.search_rounded,
),
);

useEffect(() {
OverlayEntry? entry;
WidgetsBinding.instance.addPostFrameCallback((_) {
if (platform == TargetPlatform.windows) {
if (platform == TargetPlatform.windows && kIsDesktop) {
entry = OverlayEntry(builder: (context) {
return Positioned(
left: 40,
top: 7,
child: leading,
child: searchbar,
);
});
Overlay.of(context)!.insert(entry!);
}
});
return () => entry?.remove();
}, [color?.titleTextColor, leading]);
}, [color?.titleTextColor]);

return SafeArea(
child: PlatformScaffold(
appBar: kIsDesktop
? PageWindowTitleBar(
backgroundColor: color?.color,
foregroundColor: color?.titleTextColor,
leading: leading,
leading: Row(
mainAxisSize: MainAxisSize.min,
children: [
PlatformBackButton(color: color?.titleTextColor),
const SizedBox(width: 10),
searchbar,
],
),
)
: null,
body: CustomScrollView(
Expand All @@ -197,7 +209,9 @@ class TrackCollectionView<T> extends HookConsumerWidget {
pinned: true,
expandedHeight: 400,
automaticallyImplyLeading: kIsMobile,
leading: kIsMobile ? leading : null,
leading: kIsMobile
? PlatformBackButton(color: color?.titleTextColor)
: null,
iconTheme: IconThemeData(color: color?.titleTextColor),
primary: true,
backgroundColor: color?.color,
Expand All @@ -210,85 +224,84 @@ class TrackCollectionView<T> extends HookConsumerWidget {
),
)
: null,
flexibleSpace: LayoutBuilder(builder: (context, constrains) {
return FlexibleSpaceBar(
background: Container(
decoration: BoxDecoration(
gradient: LinearGradient(
colors: [
color?.color ?? Colors.transparent,
Theme.of(context).canvasColor,
],
begin: const FractionalOffset(0, 0),
end: const FractionalOffset(0, 1),
tileMode: TileMode.clamp,
),
flexibleSpace: FlexibleSpaceBar(
background: DecoratedBox(
decoration: BoxDecoration(
gradient: LinearGradient(
colors: [
color?.color ?? Colors.transparent,
Theme.of(context).canvasColor,
],
begin: const FractionalOffset(0, 0),
end: const FractionalOffset(0, 1),
tileMode: TileMode.clamp,
),
child: Material(
textStyle: PlatformTheme.of(context).textTheme!.body!,
type: MaterialType.transparency,
child: Padding(
padding: const EdgeInsets.symmetric(
horizontal: 20,
vertical: 20,
),
child: Wrap(
spacing: 20,
runSpacing: 20,
crossAxisAlignment: WrapCrossAlignment.center,
alignment: WrapAlignment.center,
runAlignment: WrapAlignment.center,
children: [
Container(
constraints:
const BoxConstraints(maxHeight: 200),
child: ClipRRect(
borderRadius: BorderRadius.circular(10),
child: UniversalImage(
path: titleImage,
placeholder: (context, url) {
return const UniversalImage(
path: "assets/album-placeholder.png",
);
},
),
),
child: Material(
textStyle: PlatformTheme.of(context).textTheme!.body!,
type: MaterialType.transparency,
child: Padding(
padding: const EdgeInsets.symmetric(
horizontal: 20,
),
child: Wrap(
spacing: 20,
runSpacing: 20,
crossAxisAlignment: WrapCrossAlignment.center,
alignment: WrapAlignment.center,
runAlignment: WrapAlignment.center,
children: [
Container(
constraints: const BoxConstraints(maxHeight: 200),
child: ClipRRect(
borderRadius: BorderRadius.circular(10),
child: UniversalImage(
path: titleImage,
placeholder: (context, url) {
return const UniversalImage(
path: "assets/album-placeholder.png",
);
},
),
),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: [
PlatformText.headline(
title,
),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
PlatformText.headline(
title,
style: TextStyle(
color: color?.titleTextColor,
fontWeight: FontWeight.w600,
),
),
if (description != null)
PlatformText(
description!,
style: TextStyle(
color: color?.titleTextColor,
fontWeight: FontWeight.w600,
color: color?.bodyTextColor,
),
maxLines: 2,
overflow: TextOverflow.fade,
),
if (description != null)
PlatformText(
description!,
style: TextStyle(
color: color?.bodyTextColor,
),
maxLines: 2,
overflow: TextOverflow.fade,
),
const SizedBox(height: 10),
Row(
mainAxisSize: MainAxisSize.min,
children: buttons,
),
if (kIsMobile) ...[
const SizedBox(height: 10),
Row(
mainAxisSize: MainAxisSize.min,
children: buttons,
),
],
)
],
),
searchbar,
]
],
)
],
),
),
),
);
}),
),
),
),
HookBuilder(
builder: (context) {
Expand Down
8 changes: 7 additions & 1 deletion lib/themes/light_theme.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -107,6 +107,7 @@ ThemeData lightTheme({
if (states.contains(MaterialState.selected)) {
return accentMaterialColor[500];
}
return null;
}),
),
tabBarTheme: TabBarTheme(
Expand Down Expand Up @@ -162,7 +163,12 @@ final linuxTheme = AdwaitaThemeData.light().copyWith(
)
],
switchTheme: SwitchThemeData(
trackColor: MaterialStateProperty.all(const Color(0xFF3582e5)),
trackColor: MaterialStateProperty.resolveWith((states) {
if (states.contains(MaterialState.selected)) {
return const Color(0xFF3582e5);
}
return Colors.grey[300];
}),
),
colorScheme: const ColorScheme.light(
primary: Color(0xFF3582e5),
Expand Down

0 comments on commit d0aaa97

Please sign in to comment.