💄 update ui design.

iota9star · Nov 28, 2020 · 33c48a5 · 33c48a5
1 parent f187be0
commit 33c48a5
Show file tree

Hide file tree

Showing 15 changed files with 82 additions and 120 deletions.
diff --git a/lib/internal/caches.dart b/lib/internal/caches.dart
@@ -13,6 +13,7 @@ const Map keywords = {
   "web-dl": "WEB-DL",
   "avc": "AVC",
   "繁体": "繁",
+  "cht": "繁",
   "简体": "简",
   "合集": "合集",
   "内封": "内嵌",
@@ -66,5 +67,8 @@ const Map keywords = {
   "yuv420p8": "YUV420P8",
   "重制版": "重制版",
   "50fps": "50FPS",
-  "tv未放送": "TV未放送"
+  "tv未放送": "TV未放送",
+  "特别篇": "特别篇",
+  "网盘": "网盘",
+  "網盤": "网盘",
 };
diff --git a/lib/ui/components/complex_record_item.dart b/lib/ui/components/complex_record_item.dart
@@ -41,7 +41,7 @@ class ComplexRecordItem extends StatelessWidget {
       ),
       decoration: BoxDecoration(
         gradient: _createGradientByIndex(theme, index),
-        borderRadius: BorderRadius.all(Radius.circular(16.0)),
+        borderRadius: BorderRadius.circular(16.0),
       ),
       child: Column(
         crossAxisAlignment: CrossAxisAlignment.stretch,
@@ -186,8 +186,7 @@ class ComplexRecordItem extends StatelessWidget {
                             ),
                           ),
                           decoration: BoxDecoration(
-                            borderRadius:
-                                BorderRadius.all(Radius.circular(12.0)),
+                            borderRadius: BorderRadius.circular(12.0),
                             gradient: LinearGradient(
                               begin: Alignment.topLeft,
                               end: Alignment.bottomRight,

diff --git a/lib/ui/components/ova_record_item.dart b/lib/ui/components/ova_record_item.dart
@@ -53,7 +53,7 @@ class OVARecordItem extends StatelessWidget {
       ),
       decoration: BoxDecoration(
         color: theme.backgroundColor,
-        borderRadius: BorderRadius.all(Radius.circular(16.0)),
+        borderRadius: BorderRadius.circular(16.0),
       ),
       child: Column(
         crossAxisAlignment: CrossAxisAlignment.stretch,

diff --git a/lib/ui/components/rss_record_item.dart b/lib/ui/components/rss_record_item.dart
@@ -55,9 +55,9 @@ class RssRecordItem extends StatelessWidget {
       ),
       decoration: BoxDecoration(
         color: theme.backgroundColor,
-        borderRadius: BorderRadius.all(Radius.circular(16.0)),
+        borderRadius: BorderRadius.circular(16.0),
       ),
-      height: 204.0,
+      height: 196.0,
       width: double.infinity,
       child: Row(
         children: [
@@ -73,17 +73,18 @@ class RssRecordItem extends StatelessWidget {
                 ),
               );
             },
-            child: Hero(
-              tag: heroTag,
-              child: Container(
-                width: 142.0,
-                height: 204.0,
-                decoration: BoxDecoration(
-                  borderRadius: BorderRadius.circular(16.0),
-                  color: Colors.grey.withOpacity(0.2),
-                  image: DecorationImage(
-                    image: ExtendedNetworkImageProvider(record.cover),
-                    fit: BoxFit.cover,
+            child: AspectRatio(
+              aspectRatio: 2 / 3,
+              child: Hero(
+                tag: heroTag,
+                child: Container(
+                  decoration: BoxDecoration(
+                    borderRadius: BorderRadius.circular(16.0),
+                    color: Colors.grey.withOpacity(0.2),
+                    image: DecorationImage(
+                      image: ExtendedNetworkImageProvider(record.cover),
+                      fit: BoxFit.cover,
+                    ),
                   ),
                 ),
               ),
@@ -99,7 +100,7 @@ class RssRecordItem extends StatelessWidget {
                     left: 12.0,
                     right: 16.0,
                     top: 16.0,
-                    bottom: 8.0,
+                    bottom: 6.0,
                   ),
                   child: Text(
                     record.name,

diff --git a/lib/ui/components/simple_record_item.dart b/lib/ui/components/simple_record_item.dart
@@ -51,7 +51,7 @@ class SimpleRecordItem extends StatelessWidget {
       ),
       decoration: BoxDecoration(
         gradient: _createGradientByIndex(index, theme.backgroundColor),
-        borderRadius: BorderRadius.all(Radius.circular(16.0)),
+        borderRadius: BorderRadius.circular(16.0),
       ),
       child: Column(
         crossAxisAlignment: CrossAxisAlignment.stretch,

diff --git a/lib/ui/fragments/bangumi_sliver_grid_fragment.dart b/lib/ui/fragments/bangumi_sliver_grid_fragment.dart
@@ -87,16 +87,22 @@ class BangumiSliverGridFragment extends StatelessWidget {
         final Matrix4 transform = tapScaleFlag == currFlag
             ? Matrix4.diagonal3Values(0.9, 0.9, 1)
             : Matrix4.identity();
-        final Widget cover = _buildBangumiItemCover(
-          theme,
-          currFlag,
-          bangumi,
-        );
+        final Widget cover = _buildBangumiItemCover(currFlag, bangumi);
         return Column(
-          crossAxisAlignment: CrossAxisAlignment.stretch,
+          crossAxisAlignment: CrossAxisAlignment.start,
           children: <Widget>[
             AnimatedTapContainer(
               transform: transform,
+              decoration: BoxDecoration(
+                borderRadius: BorderRadius.circular(8.0),
+                boxShadow: [
+                  BoxShadow(
+                    blurRadius: 8.0,
+                    color: Colors.black.withOpacity(0.08),
+                  )
+                ],
+                color: theme.backgroundColor,
+              ),
               onTapStart: () => indexModel.tapBangumiListItemFlag = currFlag,
               onTapEnd: () => indexModel.tapBangumiListItemFlag = null,
               onTap: () {
@@ -115,9 +121,7 @@ class BangumiSliverGridFragment extends StatelessWidget {
                 }
               },
               child: ClipRRect(
-                borderRadius: BorderRadius.only(
-                  topRight: Radius.circular(10.0),
-                ),
+                borderRadius: BorderRadius.circular(8.0),
                 child: Stack(
                   overflow: Overflow.clip,
                   children: [
@@ -159,7 +163,7 @@ class BangumiSliverGridFragment extends StatelessWidget {
               ),
             ),
             SizedBox(
-              height: 10.0,
+              height: 12.0,
             ),
             Tooltip(
               padding: EdgeInsets.symmetric(vertical: 6.0, horizontal: 8.0),
@@ -183,7 +187,7 @@ class BangumiSliverGridFragment extends StatelessWidget {
                           theme.accentColor.withOpacity(0.1),
                         ],
                       ),
-                      borderRadius: BorderRadius.all(Radius.circular(2)),
+                      borderRadius: BorderRadius.circular(2.0),
                     ),
                   ),
                   SizedBox(width: 4.0),
@@ -239,7 +243,7 @@ class BangumiSliverGridFragment extends StatelessWidget {
               width: 24.0,
               height: 24.0,
               decoration: BoxDecoration(
-                borderRadius: BorderRadius.circular(10.0),
+                borderRadius: BorderRadius.circular(8.0),
                 color: Colors.black38,
               ),
               child: IconButton(
@@ -259,34 +263,30 @@ class BangumiSliverGridFragment extends StatelessWidget {
   }
 
   Widget _buildBangumiItemCover(
-    final ThemeData theme,
     final String currFlag,
     final Bangumi bangumi,
   ) {
     return ExtendedImage.network(
       bangumi.cover,
-      shape: BoxShape.rectangle,
-      borderRadius: BorderRadius.all(Radius.circular(10.0)),
       clearMemoryCacheWhenDispose: true,
       loadStateChanged: (state) {
         Widget child;
         switch (state.extendedImageLoadState) {
           case LoadState.loading:
-            child = _buildBangumiItemPlaceholder(theme);
+            child = _buildBangumiItemPlaceholder();
             break;
           case LoadState.completed:
             child = _buildScrollableBackgroundCover(
-              theme,
               bangumi,
               state.imageProvider,
             );
             break;
           case LoadState.failed:
-            child = _buildBangumiItemError(theme);
+            child = _buildBangumiItemError();
             break;
         }
         return AspectRatio(
-          aspectRatio: 1.0,
+          aspectRatio: 3 / 4,
           child: Hero(
             tag: currFlag,
             child: child,
@@ -296,18 +296,9 @@ class BangumiSliverGridFragment extends StatelessWidget {
     );
   }
 
-  Widget _buildBangumiItemPlaceholder(final ThemeData theme) {
+  Widget _buildBangumiItemPlaceholder() {
     return Container(
       padding: EdgeInsets.all(28.0),
-      decoration: BoxDecoration(
-        color: theme.backgroundColor,
-        boxShadow: [
-          BoxShadow(
-            blurRadius: 8.0,
-            color: Colors.black.withAlpha(24),
-          ),
-        ],
-      ),
       child: Center(
         child: ExtendedImage.asset(
           "assets/mikan.png",
@@ -316,16 +307,9 @@ class BangumiSliverGridFragment extends StatelessWidget {
     );
   }
 
-  Widget _buildBangumiItemError(final ThemeData theme) {
+  Widget _buildBangumiItemError() {
     return Container(
       decoration: BoxDecoration(
-        boxShadow: [
-          BoxShadow(
-            blurRadius: 8.0,
-            color: Colors.black.withAlpha(24),
-          )
-        ],
-        color: theme.backgroundColor,
         image: DecorationImage(
           image: ExtendedAssetImageProvider("assets/mikan.png"),
           fit: BoxFit.cover,
@@ -336,19 +320,11 @@ class BangumiSliverGridFragment extends StatelessWidget {
   }
 
   Widget _buildScrollableBackgroundCover(
-    final ThemeData theme,
     final Bangumi bangumi,
     final ImageProvider imageProvider,
   ) {
     return Container(
       decoration: BoxDecoration(
-        boxShadow: [
-          BoxShadow(
-            blurRadius: 8.0,
-            color: Colors.black.withAlpha(24),
-          )
-        ],
-        color: theme.backgroundColor,
         image: DecorationImage(
           image: imageProvider,
           fit: BoxFit.cover,

diff --git a/lib/ui/fragments/index_fragment.dart b/lib/ui/fragments/index_fragment.dart
@@ -253,7 +253,7 @@ class IndexFragment extends StatelessWidget {
             },
             margin: EdgeInsets.only(top: 16.0, bottom: 12.0),
             decoration: BoxDecoration(
-              borderRadius: BorderRadius.all(Radius.circular(16.0)),
+              borderRadius: BorderRadius.circular(16.0),
               color: theme.backgroundColor,
               boxShadow: [
                 BoxShadow(

diff --git a/lib/ui/fragments/search_fragment.dart b/lib/ui/fragments/search_fragment.dart
@@ -367,9 +367,7 @@ class SearchFragment extends StatelessWidget {
           minWidth: 0,
           materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
           shape: RoundedRectangleBorder(
-            borderRadius: BorderRadius.all(
-              Radius.circular(10.0),
-            ),
+            borderRadius: BorderRadius.circular(10.0),
           ),
           child: Text(
             subgroup.name,
@@ -451,7 +449,7 @@ class SearchFragment extends StatelessWidget {
     return Container(
       decoration: BoxDecoration(
         color: Colors.grey.withOpacity(0.1),
-        borderRadius: const BorderRadius.all(Radius.circular(12.0)),
+        borderRadius: BorderRadius.circular(12.0),
       ),
       child: TextField(
         decoration: InputDecoration(
@@ -544,7 +542,7 @@ class SearchFragment extends StatelessWidget {
                     theme.accentColor.withOpacity(0.1),
                   ],
                 ),
-                borderRadius: BorderRadius.all(Radius.circular(2)),
+                borderRadius: BorderRadius.circular(2.0),
               ),
             ),
             SizedBox(width: 4.0),
@@ -568,7 +566,7 @@ class SearchFragment extends StatelessWidget {
           cover = Container(
             padding: EdgeInsets.all(28.0),
             decoration: BoxDecoration(
-              borderRadius: BorderRadius.all(Radius.circular(10.0)),
+              borderRadius: BorderRadius.circular(10.0),
             ),
             child: Center(
               child: SpinKitPumpingHeart(
@@ -583,7 +581,7 @@ class SearchFragment extends StatelessWidget {
         if (value.extendedImageLoadState == LoadState.failed) {
           cover = Container(
             decoration: BoxDecoration(
-              borderRadius: BorderRadius.all(Radius.circular(10.0)),
+              borderRadius: BorderRadius.circular(10.0),
               image: DecorationImage(
                 image: ExtendedAssetImageProvider("assets/mikan.png"),
                 fit: BoxFit.cover,
@@ -598,7 +596,7 @@ class SearchFragment extends StatelessWidget {
           );
           cover = Container(
             decoration: BoxDecoration(
-              borderRadius: BorderRadius.all(Radius.circular(10.0)),
+              borderRadius: BorderRadius.circular(10.0),
               image: DecorationImage(
                 image: value.imageProvider,
                 fit: BoxFit.cover,

diff --git a/lib/ui/fragments/select_season_fragment.dart b/lib/ui/fragments/select_season_fragment.dart
@@ -128,9 +128,7 @@ class SelectSeasonFragment extends StatelessWidget {
                   materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
                   padding: EdgeInsets.all(0.0),
                   shape: RoundedRectangleBorder(
-                    borderRadius: BorderRadius.all(
-                      Radius.circular(10.0),
-                    ),
+                    borderRadius: BorderRadius.circular(10.0),
                   ),
                   child: Text(
                     season.season,

diff --git a/lib/ui/fragments/subgroup_fragment.dart b/lib/ui/fragments/subgroup_fragment.dart
@@ -61,9 +61,7 @@ class SubgroupFragment extends StatelessWidget {
                           ),
                         ),
                         decoration: BoxDecoration(
-                          borderRadius: BorderRadius.all(
-                            Radius.circular(12.0),
-                          ),
+                          borderRadius: BorderRadius.circular(12.0),
                           gradient: LinearGradient(
                             begin: Alignment.topLeft,
                             end: Alignment.bottomRight,