import 'package:flutter/material.dart'; import 'package:flutter_example_packages/widgets/base/export.dart'; import 'package:flutter_gen/gen_l10n/app_localizations.dart'; enum PlatformFilter { disable, dependent, independent, } class HomeAppBar extends AppStatefulWidget implements PreferredSizeWidget { const HomeAppBar({ super.key, required this.onChangeSearch, required this.onChangeFilter, }); final void Function(String) onChangeSearch; final void Function(PlatformFilter) onChangeFilter; @override State createState() => _HomeAppBarState(); @override Size get preferredSize => const Size.fromHeight(60.0); } class _HomeAppBarState extends AppState { bool _enableSearch = false; PlatformFilter _filter = PlatformFilter.disable; final TextEditingController _searchController = TextEditingController(); final FocusNode _searchFocus = FocusNode(); @override Widget buildWide( BuildContext context, MediaQueryData media, AppLocalizations l10n, ) { final theme = Theme.of(context); return AppBar( centerTitle: true, shape: const Border(bottom: BorderSide(width: 0)), leading: _enableSearch ? Padding( padding: const EdgeInsets.all(8.0), child: ClipOval( child: Material( color: Colors.blueGrey, child: IconButton( icon: const Icon(Icons.close), tooltip: l10n.homeSearch, onPressed: () { setState(() { widget.onChangeSearch.call(""); _searchController.clear(); _enableSearch = false; }); }, ), ), ), ) : null, title: _enableSearch ? TextField( focusNode: _searchFocus, controller: _searchController, style: theme.textTheme.titleSmall?.copyWith(color: Colors.white), cursorColor: Colors.white, decoration: InputDecoration( hintText: l10n.homeSearchTitle, hintStyle: theme.textTheme.titleSmall?.copyWith(color: Colors.white54), border: InputBorder.none, ), onChanged: (value) { widget.onChangeSearch.call(value); }, ) : null, actions: [ if (!_enableSearch) Padding( padding: const EdgeInsets.all(8.0), child: SizedBox( width: 40, height: 40, child: ClipOval( child: Material( color: Colors.blueGrey, child: IconButton( icon: const Icon(Icons.search), tooltip: l10n.homeSearch, onPressed: () { setState(() { _enableSearch = true; _searchFocus.requestFocus(); }); }, ), ), ), ), ), Padding( padding: const EdgeInsets.all(8.0), child: SizedBox( width: 40, height: 40, child: ClipOval( child: Material( color: () { switch (_filter) { case PlatformFilter.disable: return Colors.blueGrey; case PlatformFilter.dependent: return Colors.deepOrangeAccent; case PlatformFilter.independent: return Colors.blueAccent; } }.call(), child: IconButton( icon: () { switch (_filter) { case PlatformFilter.disable: return const Icon(Icons.filter_list_off); case PlatformFilter.dependent: return const Icon(Icons.filter_list); case PlatformFilter.independent: return const Icon(Icons.filter_list); } }.call(), tooltip: l10n.homeFilter, onPressed: () { setState(() { switch (_filter) { case PlatformFilter.disable: _filter = PlatformFilter.dependent; widget.onChangeFilter.call(_filter); break; case PlatformFilter.dependent: _filter = PlatformFilter.independent; widget.onChangeFilter.call(_filter); break; case PlatformFilter.independent: _filter = PlatformFilter.disable; widget.onChangeFilter.call(_filter); break; } }); }, ), ), ), ), ), ], ); } }