Commit 77d971c0ea41149ecb6144248cd7687fb803b07e

Authored by 权海
1 parent e41da127

feat(ui):修改主题页面自定义主题排列

1 import 'package:flutter/material.dart'; 1 import 'package:flutter/material.dart';
2 -import 'package:get/utils.dart';  
3 import 'package:doublefeel_flutter/l10n/l10n_extensions.dart'; 2 import 'package:doublefeel_flutter/l10n/l10n_extensions.dart';
4 3
5 import '../models/watch_theme_models.dart'; 4 import '../models/watch_theme_models.dart';
@@ -51,28 +50,27 @@ class CustomThemeCard extends StatelessWidget { @@ -51,28 +50,27 @@ class CustomThemeCard extends StatelessWidget {
51 _CreateThemeButton(onTap: onCreateTap), 50 _CreateThemeButton(onTap: onCreateTap),
52 customThemes.isEmpty 51 customThemes.isEmpty
53 ? SizedBox(height: 0) 52 ? SizedBox(height: 0)
54 - : SizedBox(  
55 - height: 112,  
56 - child: ListView.separated(  
57 - scrollDirection: Axis.vertical,  
58 - padding: EdgeInsets.zero,  
59 - itemBuilder: (context, index) {  
60 - return _CustomThemeItem(  
61 - item: customThemes[index],  
62 - selected: customThemes[index].id != null &&  
63 - customThemes[index].id == activeThemeId,  
64 - onTap: onThemeTap == null  
65 - ? null  
66 - : () => onThemeTap!(customThemes[index]),  
67 - );  
68 - },  
69 - separatorBuilder: (context, index) {  
70 - return SizedBox(  
71 - width: 20,  
72 - );  
73 - },  
74 - itemCount: customThemes.length),  
75 - ).paddingOnly(top: 12), 53 + : GridView.builder(
  54 + shrinkWrap: true,
  55 + padding: const EdgeInsets.only(top: 12),
  56 + physics: const NeverScrollableScrollPhysics(),
  57 + itemCount: customThemes.length,
  58 + gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
  59 + crossAxisCount: 3,
  60 + crossAxisSpacing: 20,
  61 + mainAxisSpacing: 20,
  62 + mainAxisExtent: 114,
  63 + ),
  64 + itemBuilder: (context, index) {
  65 + final theme = customThemes[index];
  66 + return _CustomThemeItem(
  67 + item: theme,
  68 + selected: theme.id != null && theme.id == activeThemeId,
  69 + onTap:
  70 + onThemeTap == null ? null : () => onThemeTap!(theme),
  71 + );
  72 + },
  73 + ),
76 ], 74 ],
77 ), 75 ),
78 ); 76 );
@@ -152,34 +150,32 @@ class _CustomThemeItem extends StatelessWidget { @@ -152,34 +150,32 @@ class _CustomThemeItem extends StatelessWidget {
152 return GestureDetector( 150 return GestureDetector(
153 behavior: HitTestBehavior.opaque, 151 behavior: HitTestBehavior.opaque,
154 onTap: onTap, 152 onTap: onTap,
155 - child: SizedBox(  
156 - width: 88,  
157 - child: Column(  
158 - children: [  
159 - WatchThemeSelectedView(  
160 - selected: selected, 153 + child: Column(
  154 + children: [
  155 + WatchThemeSelectedView(
  156 + selected: selected,
  157 + size: 88,
  158 + child: WatchThemeCharacterAvatar(
161 size: 88, 159 size: 88,
162 - child: WatchThemeCharacterAvatar(  
163 - size: 88,  
164 - assetPath: item.infoList.firstOrNull?.assetPath,  
165 - imageUrl: item.infoList.firstOrNull?.imgUrl,  
166 - empty: item.infoList.firstOrNull?.image == null,  
167 - ), 160 + assetPath: item.infoList.firstOrNull?.assetPath,
  161 + imageUrl: item.infoList.firstOrNull?.imgUrl,
  162 + empty: item.infoList.firstOrNull?.image == null,
168 ), 163 ),
169 - SizedBox(height: 8),  
170 - Text(  
171 - item.title,  
172 - maxLines: 1,  
173 - overflow: TextOverflow.ellipsis,  
174 - style: TextStyle(  
175 - color: WatchThemeColors.textPrimary,  
176 - fontSize: 12,  
177 - fontWeight: FontWeight.w400,  
178 - height: 1.25,  
179 - ), 164 + ),
  165 + SizedBox(height: 8),
  166 + Text(
  167 + item.title,
  168 + textAlign: TextAlign.center,
  169 + maxLines: 1,
  170 + overflow: TextOverflow.ellipsis,
  171 + style: TextStyle(
  172 + color: WatchThemeColors.textPrimary,
  173 + fontSize: 12,
  174 + fontWeight: FontWeight.w400,
  175 + height: 1.25,
180 ), 176 ),
181 - ],  
182 - ), 177 + ),
  178 + ],
183 ), 179 ),
184 ); 180 );
185 } 181 }