Skip to content

Commit 3b67cb4

Browse files
TomBurschTomBursch
committed
fix: Improve minor design
1 parent 1280322 commit 3b67cb4

File tree

4 files changed

+97
-53
lines changed

4 files changed

+97
-53
lines changed

‎kitchenowl/lib/pages/household_page/expense_list.dart

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import 'package:collection/collection.dart';
12
import 'package:flutter/material.dart';
23
import 'package:flutter_bloc/flutter_bloc.dart';
34
import 'package:go_router/go_router.dart';
@@ -129,8 +130,15 @@ class _ExpensePageState extends State<ExpenseListPage> {
129130
actions: [
130131
searchAnchor,
131132
],
132-
children: state.categories.map((category) {
133+
children: state.categories
134+
.sorted((a, b) => state.filter
135+
.contains(a)
136+
.hashCode
137+
.compareTo(
138+
state.filter.contains(b).hashCode))
139+
.map((category) {
133140
return Padding(
141+
key: ValueKey(category.id),
134142
padding: const EdgeInsets.symmetric(
135143
horizontal: 4,
136144
),
@@ -155,8 +163,9 @@ class _ExpensePageState extends State<ExpenseListPage> {
155163
);
156164
}).toList()
157165
..insert(
158-
0,
166+
state.filter.length,
159167
Padding(
168+
key: ValueKey(null),
160169
padding: const EdgeInsets.symmetric(
161170
horizontal: 4,
162171
),

‎kitchenowl/lib/pages/household_page/planner.dart

Lines changed: 17 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -51,6 +51,7 @@ class PlannerPage extends StatefulWidget {
5151

5252
class _PlannerPageState extends State<PlannerPage> {
5353
final TextEditingController searchController = TextEditingController();
54+
final ScrollController suggestedRecipesScrollController = ScrollController();
5455

5556
@override
5657
void initState() {
@@ -262,9 +263,9 @@ class _PlannerPageState extends State<PlannerPage> {
262263
child: SizedBox(
263264
height: getValueForScreenType(
264265
context: context,
265-
mobile: 375,
266-
tablet: 415,
267-
desktop: 415,
266+
mobile: 365,
267+
tablet: 405,
268+
desktop: 405,
268269
),
269270
child: ListView.builder(
270271
padding: const EdgeInsets.symmetric(horizontal: 16),
@@ -302,8 +303,15 @@ class _PlannerPageState extends State<PlannerPage> {
302303
),
303304
),
304305
LoadingIconButton(
305-
onPressed: cubit.refreshSuggestions,
306-
icon: const Icon(Icons.refresh),
306+
onPressed: () async {
307+
await cubit.refreshSuggestions();
308+
suggestedRecipesScrollController.animateTo(
309+
0,
310+
duration: const Duration(milliseconds: 400),
311+
curve: Curves.easeIn,
312+
);
313+
},
314+
icon: const Icon(Icons.shuffle_rounded),
307315
tooltip: AppLocalizations.of(context)!.refresh,
308316
),
309317
],
@@ -315,11 +323,12 @@ class _PlannerPageState extends State<PlannerPage> {
315323
child: SizedBox(
316324
height: getValueForScreenType(
317325
context: context,
318-
mobile: 375,
319-
tablet: 415,
320-
desktop: 415,
326+
mobile: 365,
327+
tablet: 405,
328+
desktop: 405,
321329
),
322330
child: ListView.builder(
331+
controller: suggestedRecipesScrollController,
323332
padding: const EdgeInsets.symmetric(horizontal: 16),
324333
itemBuilder: (context, i) => RecipeCard(
325334
recipe: state.suggestedRecipes[i],

‎kitchenowl/lib/pages/household_page/recipe_list.dart

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import 'package:azlistview_plus/azlistview_plus.dart';
2+
import 'package:collection/collection.dart';
23
import 'package:flutter/material.dart';
34
import 'package:flutter_bloc/flutter_bloc.dart';
45
import 'package:kitchenowl/cubits/recipe_list_cubit.dart';
@@ -89,8 +90,19 @@ class _RecipeListPageState extends State<RecipeListPage> {
8990
child: LeftRightWrap(
9091
crossAxisSpacing: 6,
9192
left: ChoiceScroll(
92-
children: state.tags.map((tag) {
93+
children: state.tags
94+
.sorted((a, b) =>
95+
(state is FilteredListRecipeListState)
96+
? state.selectedTags
97+
.contains(a)
98+
.hashCode
99+
.compareTo(state.selectedTags
100+
.contains(b)
101+
.hashCode)
102+
: 0)
103+
.map((tag) {
93104
return Padding(
105+
key: ValueKey(tag.id),
94106
padding: const EdgeInsets.symmetric(horizontal: 4),
95107
child: FilterChip(
96108
label: Text(

‎kitchenowl/lib/widgets/recipe_card.dart

Lines changed: 56 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -52,43 +52,64 @@ class RecipeCard extends StatelessWidget {
5252
child: Column(
5353
crossAxisAlignment: CrossAxisAlignment.stretch,
5454
children: [
55-
if (recipe.image?.isNotEmpty ?? false)
56-
Expanded(
57-
flex: 3,
58-
child: ClipRRect(
59-
borderRadius: const BorderRadius.vertical(
60-
bottom: Radius.circular(14),
61-
),
62-
child: FadeInImage(
63-
fit: BoxFit.cover,
64-
placeholder: recipe.imageHash != null
65-
? BlurHashImage(recipe.imageHash!)
66-
: MemoryImage(kTransparentImage) as ImageProvider,
67-
image: getImageProvider(
68-
context,
69-
recipe.image!,
70-
maxWidth: 512,
55+
Expanded(
56+
flex: 3,
57+
child: Stack(
58+
fit: StackFit.passthrough,
59+
children: [
60+
if (recipe.image?.isNotEmpty ?? false)
61+
ClipRRect(
62+
borderRadius: const BorderRadius.vertical(
63+
bottom: Radius.circular(14),
64+
),
65+
child: FadeInImage(
66+
fit: BoxFit.cover,
67+
placeholder: recipe.imageHash != null
68+
? BlurHashImage(recipe.imageHash!)
69+
: MemoryImage(kTransparentImage) as ImageProvider,
70+
image: getImageProvider(
71+
context,
72+
recipe.image!,
73+
maxWidth: 512,
74+
),
75+
),
7176
),
72-
),
73-
),
74-
),
75-
if (recipe.image?.isEmpty ?? true)
76-
Expanded(
77-
flex: 3,
78-
child: Container(
79-
decoration: BoxDecoration(
80-
color: Theme.of(context).colorScheme.secondaryContainer,
81-
borderRadius: const BorderRadius.vertical(
82-
bottom: Radius.circular(14),
77+
if (recipe.image?.isEmpty ?? true)
78+
Container(
79+
decoration: BoxDecoration(
80+
color:
81+
Theme.of(context).colorScheme.secondaryContainer,
82+
borderRadius: const BorderRadius.vertical(
83+
bottom: Radius.circular(14),
84+
),
85+
),
86+
child: Icon(
87+
Icons.fastfood_rounded,
88+
size: 48,
89+
color: Theme.of(context)
90+
.colorScheme
91+
.onSecondaryContainer,
92+
),
8393
),
84-
),
85-
child: Icon(
86-
Icons.fastfood_rounded,
87-
size: 48,
88-
color: Theme.of(context).colorScheme.onSecondaryContainer,
89-
),
90-
),
94+
if (recipe.time > 0)
95+
Padding(
96+
padding: const EdgeInsets.all(8),
97+
child: Align(
98+
alignment: Alignment.topLeft,
99+
child: Chip(
100+
avatar: Icon(Icons.timer_rounded),
101+
label: Text(
102+
"${recipe.time} min",
103+
maxLines: 1,
104+
overflow: TextOverflow.ellipsis,
105+
style: Theme.of(context).textTheme.bodySmall,
106+
),
107+
),
108+
),
109+
),
110+
],
91111
),
112+
),
92113
Expanded(
93114
flex: 2,
94115
child: Padding(
@@ -132,21 +153,14 @@ class RecipeCard extends StatelessWidget {
132153
recipe.name,
133154
maxLines: getValueForScreenType(
134155
context: context,
135-
mobile: 1,
156+
mobile: 2,
136157
tablet: 2,
137158
desktop: 2,
138159
),
139160
overflow: TextOverflow.ellipsis,
140161
softWrap: true,
141162
style: Theme.of(context).textTheme.bodyLarge,
142163
),
143-
if (recipe.time > 0)
144-
Text(
145-
"${recipe.time} min",
146-
maxLines: 1,
147-
overflow: TextOverflow.ellipsis,
148-
style: Theme.of(context).textTheme.bodySmall,
149-
),
150164
const Spacer(),
151165
if (onLongPressed != null) const Divider(),
152166
if (onLongPressed != null)

0 commit comments

Comments
 (0)