Improve categories page.

lib/pages/categories_page.dart

@@ -17,39 +17,50 @@ class CategoriesPage extends StatefulWidget {
   State<CategoriesPage> createState() => _CategoriesPageState();
 }
 
-class _CategoriesPageState extends State<CategoriesPage> {
+class _CategoriesPageState extends State<CategoriesPage>
+    with
+        TickerProviderStateMixin,
+        AutomaticKeepAliveClientMixin<CategoriesPage> {
   var categories = <String>[];
 
+  late TabController controller;
+
   void onSettingsChanged() {
-    var categories =
+    var categories = List.from(
-        List.from(appdata.settings["categories"]).whereType<String>().toList();
+      appdata.settings["categories"],
+    ).whereType<String>().toList();
     var allCategories = ComicSource.all()
         .map((e) => e.categoryData?.key)
         .where((element) => element != null)
         .map((e) => e!)
         .toList();
-    categories =
+    categories = categories
-        categories.where((element) => allCategories.contains(element)).toList();
+        .where((element) => allCategories.contains(element))
+        .toList();
     if (!categories.isEqualTo(this.categories)) {
       setState(() {
         this.categories = categories;
       });
+      controller = TabController(length: categories.length, vsync: this);
     }
   }
 
   @override
   void initState() {
     super.initState();
-    var categories =
+    var categories = List.from(
-        List.from(appdata.settings["categories"]).whereType<String>().toList();
+      appdata.settings["categories"],
+    ).whereType<String>().toList();
     var allCategories = ComicSource.all()
         .map((e) => e.categoryData?.key)
         .where((element) => element != null)
         .map((e) => e!)
         .toList();
-    this.categories =
+    this.categories = categories
-        categories.where((element) => allCategories.contains(element)).toList();
+        .where((element) => allCategories.contains(element))
+        .toList();
     appdata.settings.addListener(onSettingsChanged);
+    controller = TabController(length: categories.length, vsync: this);
   }
 
   void addPage() {
@@ -59,6 +70,7 @@ class _CategoriesPageState extends State<CategoriesPage> {
   @override
   void dispose() {
     super.dispose();
+    controller.dispose();
     appdata.settings.removeListener(onSettingsChanged);
   }
 
@@ -85,17 +97,16 @@ class _CategoriesPageState extends State<CategoriesPage> {
 
   @override
   Widget build(BuildContext context) {
+    super.build(context);
     if (categories.isEmpty) {
       return buildEmpty();
     }
 
     return Material(
-      child: DefaultTabController(
-        length: categories.length,
-        key: Key(categories.toString()),
       child: Column(
         children: [
           AppTabBar(
+            controller: controller,
             key: PageStorageKey(categories.toString()),
             tabs: categories.map((e) {
               String title = e;
@@ -104,10 +115,7 @@ class _CategoriesPageState extends State<CategoriesPage> {
               } catch (e) {
                 //
               }
-                return Tab(
+              return Tab(text: title, key: Key(e));
-                  text: title,
-                  key: Key(e),
-                );
             }).toList(),
             actionButton: TabActionButton(
               icon: const Icon(Icons.add),
@@ -117,14 +125,17 @@ class _CategoriesPageState extends State<CategoriesPage> {
           ).paddingTop(context.padding.top),
           Expanded(
             child: TabBarView(
+              controller: controller,
               children: categories.map((e) => _CategoryPage(e)).toList(),
             ),
-            )
-          ],
           ),
+        ],
       ),
     );
   }
+
+  @override
+  bool get wantKeepAlive => true;
 }
 
 typedef ClickTagCallback = void Function(String, String?);
@@ -150,7 +161,8 @@ class _CategoryPage extends StatelessWidget {
     var children = <Widget>[];
     if (data.enableRankingPage || data.buttons.isNotEmpty) {
       children.add(buildTitle(data.title));
-      children.add(Padding(
+      children.add(
+        Padding(
           padding: const EdgeInsets.fromLTRB(10, 0, 10, 16),
           child: Wrap(
             children: [
@@ -159,29 +171,32 @@ class _CategoryPage extends StatelessWidget {
                   context.to(() => RankingPage(categoryKey: data.key));
                 }),
               for (var buttonData in data.buttons)
-              buildTag(buttonData.label.tl, buttonData.onTap)
+                buildTag(buttonData.label.tl, buttonData.onTap),
             ],
           ),
-      ));
+        ),
+      );
     }
 
     for (var part in data.categories) {
       if (part.enableRandom) {
-        children.add(StatefulBuilder(builder: (context, updater) {
+        children.add(
+          StatefulBuilder(
+            builder: (context, updater) {
               return Column(
                 mainAxisSize: MainAxisSize.min,
                 crossAxisAlignment: CrossAxisAlignment.start,
                 children: [
                   buildTitleWithRefresh(part.title, () => updater(() {})),
-              buildTags(part.categories)
+                  buildTags(part.categories),
                 ],
               );
-        }));
+            },
+          ),
+        );
       } else {
         children.add(buildTitle(part.title));
-        children.add(
+        children.add(buildTags(part.categories));
-          buildTags(part.categories),
-        );
       }
     }
     return SingleChildScrollView(
@@ -195,8 +210,10 @@ class _CategoryPage extends StatelessWidget {
   Widget buildTitle(String title) {
     return Padding(
       padding: const EdgeInsets.fromLTRB(16, 10, 5, 10),
-      child: Text(title.tl,
+      child: Text(
-          style: const TextStyle(fontSize: 20, fontWeight: FontWeight.w500)),
+        title.tl,
+        style: const TextStyle(fontSize: 20, fontWeight: FontWeight.w500),
+      ),
     );
   }
 
@@ -207,21 +224,16 @@ class _CategoryPage extends StatelessWidget {
         children: [
           Text(
             title.tl,
-            style: const TextStyle(
+            style: const TextStyle(fontSize: 20, fontWeight: FontWeight.w500),
-              fontSize: 20,
-              fontWeight: FontWeight.w500,
-            ),
           ),
           const Spacer(),
-          IconButton(onPressed: onRefresh, icon: const Icon(Icons.refresh))
+          IconButton(onPressed: onRefresh, icon: const Icon(Icons.refresh)),
         ],
       ),
     );
   }
 
-  Widget buildTags(
+  Widget buildTags(List<CategoryItem> categories) {
-    List<CategoryItem> categories,
-  ) {
     return Padding(
       padding: const EdgeInsets.fromLTRB(10, 0, 10, 16),
       child: Wrap(