Skip to content

Commit

Permalink
feat: add clear button to search box
Browse files Browse the repository at this point in the history
  • Loading branch information
@MiaoMint
MiaoMint committed Jan 18, 2024
1 parent 0c07809 commit f2ad0d1
Show file tree
Hide file tree
Showing 6 changed files with 84 additions and 40 deletions.
16 changes: 6 additions & 10 deletions lib/controllers/search_controller.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ import 'package:miru_app/utils/miru_storage.dart';

class SearchPageController extends GetxController {
Rx<ExtensionType?> cuurentExtensionType = Rx(null);
final search = ''.obs;
final keyword = ''.obs;
final searchResultList = <SearchResult>[].obs;
String _randomKey = "";
int get finishCount =>
Expand All @@ -15,13 +15,9 @@ class SearchPageController extends GetxController {
bool isPageOpen = false;
// 是否打开了这个页面

@override
void onInit() {
ever(search, (callback) {
_randomKey = DateTime.now().millisecondsSinceEpoch.toString();
getResult(_randomKey);
});
super.onInit();
search() {
_randomKey = DateTime.now().millisecondsSinceEpoch.toString();
getResult(_randomKey);
}

getRuntime({ExtensionType? type}) {
Expand Down Expand Up @@ -53,10 +49,10 @@ class SearchPageController extends GetxController {
element.error = null;
Future<List<ExtensionListItem>> resultFuture;

if (search.value.isEmpty) {
if (keyword.value.isEmpty) {
resultFuture = element.runitme.latest(1);
} else {
resultFuture = element.runitme.search(search.value, 1);
resultFuture = element.runitme.search(keyword.value, 1);
}

futures.add(
Expand Down
33 changes: 26 additions & 7 deletions lib/views/pages/search/extension_searcher_page.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,7 @@ class _ExtensionSearcherPageState extends fluent.State<ExtensionSearcherPage> {
// 初始化一开始选择的选项
Map<String, List<String>> _selectedFilters = {};
// 缓存的选项
final _textEditingController = TextEditingController();

@override
void initState() {
Expand All @@ -52,6 +53,13 @@ class _ExtensionSearcherPageState extends fluent.State<ExtensionSearcherPage> {
});
}

@override
dispose() {
_easyRefreshController.dispose();
_textEditingController.dispose();
super.dispose();
}

_initFilters() async {
_filters = await _runtime.createFilter();
_filters!.forEach((key, value) {
Expand Down Expand Up @@ -200,7 +208,7 @@ class _ExtensionSearcherPageState extends fluent.State<ExtensionSearcherPage> {
return Scaffold(
appBar: SearchAppBar(
title: _runtime.extension.name,
textEditingController: TextEditingController(text: _keyWord),
textEditingController: _textEditingController,
onChanged: (value) {
if (value.isEmpty) {
_onSearch(value);
Expand Down Expand Up @@ -247,6 +255,20 @@ class _ExtensionSearcherPageState extends fluent.State<ExtensionSearcherPage> {
}

Widget _buildDesktop(BuildContext context) {
final suffix = Row(mainAxisSize: MainAxisSize.min, children: [
if (_textEditingController.text.isNotEmpty)
Padding(
padding: const EdgeInsetsDirectional.only(start: 2.0),
child: fluent.IconButton(
icon: const Icon(fluent.FluentIcons.chrome_close, size: 9.0),
onPressed: () {
_textEditingController.clear();
_onSearch("");
},
),
),
]);

return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Expand Down Expand Up @@ -279,13 +301,10 @@ class _ExtensionSearcherPageState extends fluent.State<ExtensionSearcherPage> {
SizedBox(
width: 300,
child: fluent.TextBox(
controller: TextEditingController(
text: _keyWord,
),
controller: _textEditingController,
suffix: suffix,
onChanged: (value) {
if (value.isEmpty) {
_onSearch(value);
}
setState(() {});
},
onSubmitted: _onSearch,
placeholder: 'search.hint-text'.i18n,
Expand Down
53 changes: 34 additions & 19 deletions lib/views/pages/search/search_page.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@ class SearchPage extends StatefulWidget {

class _SearchPageState extends State<SearchPage> {
late SearchPageController c;
final _searchController = TextEditingController();

@override
void initState() {
Expand All @@ -33,6 +34,7 @@ class _SearchPageState extends State<SearchPage> {
@override
void dispose() {
c.isPageOpen = false;
_searchController.dispose();
super.dispose();
}

Expand All @@ -41,16 +43,12 @@ class _SearchPageState extends State<SearchPage> {
length: 4,
child: Scaffold(
appBar: SearchAppBar(
textEditingController: TextEditingController(
text: c.search.value,
),
textEditingController: _searchController,
onChanged: (value) {
if (value.isEmpty) {
c.search.value = '';
}
c.keyword.value = value;
},
onSubmitted: (value) {
c.search.value = value;
c.search();
},
hintText: "search.hint-text".i18n,
title: "common.search".i18n,
Expand Down Expand Up @@ -99,14 +97,14 @@ class _SearchPageState extends State<SearchPage> {
final list = c.searchResultList.value;
return SearchAllExtSearch(
key: ValueKey(
c.search.value + c.cuurentExtensionType.value.toString(),
c.keyword.value + c.cuurentExtensionType.value.toString(),
),
kw: c.search.value,
kw: c.keyword.value,
runtimeList: list,
onClickMore: (index) {
Get.to(ExtensionSearcherPage(
package: c.getPackgeByIndex(index),
keyWord: c.search.value,
keyWord: c.keyword.value,
));
},
);
Expand All @@ -117,6 +115,21 @@ class _SearchPageState extends State<SearchPage> {
}

Widget _buildDesktopSearch(BuildContext context) {
final suffix = Row(
mainAxisSize: MainAxisSize.min,
children: [
Padding(
padding: const EdgeInsetsDirectional.only(start: 2.0),
child: fluent.IconButton(
icon: const Icon(fluent.FluentIcons.chrome_close, size: 9.0),
onPressed: () {
c.keyword.value = '';
c.search();
},
),
),
],
);
return Obx(
() => Column(
children: [
Expand Down Expand Up @@ -207,16 +220,18 @@ class _SearchPageState extends State<SearchPage> {
SizedBox(
width: 300,
child: fluent.TextBox(
controller:
TextEditingController(text: c.search.value),
controller: _searchController,
placeholder: "search.hint-text".i18n,
suffix: Obx(
() => c.keyword.value.isNotEmpty
? suffix
: const SizedBox.shrink(),
),
onChanged: (value) {
if (value.isEmpty) {
c.search.value = '';
}
c.keyword.value = value;
},
onSubmitted: (value) {
c.search.value = value;
c.search();
},
),
)
Expand All @@ -229,17 +244,17 @@ class _SearchPageState extends State<SearchPage> {
Expanded(
child: SearchAllExtSearch(
key: ValueKey(
c.search.value + c.cuurentExtensionType.value.toString(),
c.keyword.value + c.cuurentExtensionType.value.toString(),
),
kw: c.search.value,
kw: c.keyword.value,
// ignore: invalid_use_of_protected_member
runtimeList: c.searchResultList.value,
onClickMore: (index) {
router.push(Uri(
path: "/search_extension",
queryParameters: {
"package": c.getPackgeByIndex(index),
"keyWord": c.search.value,
"keyWord": c.keyword.value,
},
).toString());
},
Expand Down
4 changes: 2 additions & 2 deletions lib/views/pages/tracking/anilist_more_page.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -109,7 +109,7 @@ class _AnilistMorePageState extends State<AnilistMorePage> {
router.push("/search");
}
final c = Get.put(SearchPageController());
c.search.value = title;
c.keyword.value = title;
},
title: title,
cover: cover,
Expand Down Expand Up @@ -202,7 +202,7 @@ class _AnilistMorePageState extends State<AnilistMorePage> {
router.push("/search");
}
final c = Get.put(SearchPageController());
c.search.value = title;
c.keyword.value = title;
},
title: title,
cover: cover,
Expand Down
2 changes: 1 addition & 1 deletion lib/views/widgets/anilist_horizontal_list.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@ class _AnilistHorizontalListState extends State<AnilistHorizontalList> {
router.push("/search");
}
final c = Get.put(SearchPageController());
c.search.value = title;
c.keyword.value = title;
},
title: title,
cover: cover,
Expand Down
16 changes: 15 additions & 1 deletion lib/views/widgets/search_appbar.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,17 @@ class _SearchAppBarState extends State<SearchAppBar> {
@override
Widget build(BuildContext context) {
return AppBar(
leading: _showSearch
? IconButton(
onPressed: () {
setState(() {
widget.textEditingController.clear();
_showSearch = false;
});
},
icon: const Icon(Icons.arrow_back),
)
: null,
title: _showSearch
? TextField(
controller: widget.textEditingController,
Expand All @@ -53,8 +64,11 @@ class _SearchAppBarState extends State<SearchAppBar> {
IconButton(
onPressed: () {
setState(() {
if (_showSearch) {
widget.textEditingController.clear();
return;
}
_showSearch = !_showSearch;
if (!_showSearch) widget.onSubmitted?.call("");
});
},
icon: Icon(_showSearch ? Icons.close : Icons.search),
Expand Down

0 comments on commit f2ad0d1

Please sign in to comment.