UI changes to search bar and it's background

This commit is contained in:
ashilkn 2023-10-19 11:36:28 +05:30
parent 5345850b1a
commit 1056ea79c9
3 changed files with 104 additions and 125 deletions

View file

@ -273,6 +273,7 @@ class _HomeWidgetState extends State<HomeWidget> {
_accountConfiguredEvent.cancel(); _accountConfiguredEvent.cancel();
_intentDataStreamSubscription?.cancel(); _intentDataStreamSubscription?.cancel();
_collectionUpdatedEvent.cancel(); _collectionUpdatedEvent.cancel();
isOnSearchTabNotifier.dispose();
super.dispose(); super.dispose();
} }
@ -427,25 +428,7 @@ class _HomeWidgetState extends State<HomeWidget> {
child: ValueListenableBuilder( child: ValueListenableBuilder(
valueListenable: isOnSearchTabNotifier, valueListenable: isOnSearchTabNotifier,
builder: (context, value, child) { builder: (context, value, child) {
return AnimatedContainer( return Column(
duration: const Duration(milliseconds: 300),
curve: Curves.easeInCubic,
// color: getEnteColorScheme(context).backgroundElevated2,
decoration: BoxDecoration(
gradient: value
? null
// ? LinearGradient(
// begin: Alignment.topCenter,
// end: Alignment.bottomCenter,
// colors: [
// colorScheme.backgroundBase,
// colorScheme.backgroundElevated2,
// // Colors.black,
// ],
// )
: null,
),
child: Column(
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
children: [ children: [
value value
@ -473,7 +456,6 @@ class _HomeWidgetState extends State<HomeWidget> {
: const SizedBox.shrink(), : const SizedBox.shrink(),
child!, child!,
], ],
),
); );
}, },
child: HomeBottomNavigationBar( child: HomeBottomNavigationBar(

View file

@ -1,5 +1,5 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:photos/ente_theme_data.dart'; import "package:photos/theme/ente_theme.dart";
class SearchSuffixIcon extends StatefulWidget { class SearchSuffixIcon extends StatefulWidget {
final bool shouldShowSpinner; final bool shouldShowSpinner;
@ -13,6 +13,7 @@ class _SearchSuffixIconState extends State<SearchSuffixIcon>
with TickerProviderStateMixin { with TickerProviderStateMixin {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final colorScheme = getEnteColorScheme(context);
return AnimatedSwitcher( return AnimatedSwitcher(
duration: const Duration(milliseconds: 175), duration: const Duration(milliseconds: 175),
child: widget.shouldShowSpinner child: widget.shouldShowSpinner
@ -24,10 +25,7 @@ class _SearchSuffixIconState extends State<SearchSuffixIcon>
child: Center( child: Center(
child: CircularProgressIndicator( child: CircularProgressIndicator(
strokeWidth: 2, strokeWidth: 2,
color: Theme.of(context) color: colorScheme.strokeMuted,
.colorScheme
.iconColor
.withOpacity(0.5),
), ),
), ),
), ),
@ -39,7 +37,7 @@ class _SearchSuffixIconState extends State<SearchSuffixIcon>
}, },
icon: Icon( icon: Icon(
Icons.close, Icons.close,
color: Theme.of(context).colorScheme.iconColor.withOpacity(0.5), color: colorScheme.strokeMuted,
), ),
), ),
); );

View file

@ -3,9 +3,7 @@ import "dart:async";
import "package:flutter/material.dart"; import "package:flutter/material.dart";
import "package:logging/logging.dart"; import "package:logging/logging.dart";
import "package:photos/core/event_bus.dart"; import "package:photos/core/event_bus.dart";
import "package:photos/ente_theme_data.dart";
import "package:photos/events/tab_changed_event.dart"; import "package:photos/events/tab_changed_event.dart";
import "package:photos/generated/l10n.dart";
import "package:photos/models/search/search_result.dart"; import "package:photos/models/search/search_result.dart";
import "package:photos/services/search_service.dart"; import "package:photos/services/search_service.dart";
import "package:photos/theme/ente_theme.dart"; import "package:photos/theme/ente_theme.dart";
@ -49,6 +47,8 @@ class _SearchWidgetNewState extends State<SearchWidgetNew> {
padding: const EdgeInsets.symmetric(vertical: 12), padding: const EdgeInsets.symmetric(vertical: 12),
child: Padding( child: Padding(
padding: const EdgeInsets.symmetric(vertical: 2, horizontal: 8), padding: const EdgeInsets.symmetric(vertical: 2, horizontal: 8),
child: Container(
color: colorScheme.backgroundBase,
child: ClipRRect( child: ClipRRect(
borderRadius: BorderRadius.circular(8), borderRadius: BorderRadius.circular(8),
child: Container( child: Container(
@ -61,7 +61,8 @@ class _SearchWidgetNewState extends State<SearchWidgetNew> {
autocorrect: false, autocorrect: false,
// Above parameters are to disable auto-suggestion // Above parameters are to disable auto-suggestion
decoration: InputDecoration( decoration: InputDecoration(
hintText: S.of(context).searchHintText, // hintText: S.of(context).searchHintText,
hintText: "Search",
filled: true, filled: true,
contentPadding: const EdgeInsets.symmetric( contentPadding: const EdgeInsets.symmetric(
vertical: 10, vertical: 10,
@ -88,10 +89,7 @@ class _SearchWidgetNewState extends State<SearchWidgetNew> {
tag: "search_icon", tag: "search_icon",
child: Icon( child: Icon(
Icons.search, Icons.search,
color: Theme.of(context) color: colorScheme.strokeFaint,
.colorScheme
.iconColor
.withOpacity(0.5),
), ),
), ),
/*Using valueListenableBuilder inside a stateful widget because this widget is only rebuild when /*Using valueListenableBuilder inside a stateful widget because this widget is only rebuild when
@ -126,6 +124,7 @@ class _SearchWidgetNewState extends State<SearchWidgetNew> {
), ),
), ),
), ),
),
); );
} }