Skip to content

Commit

Permalink
[Presentation] Improvements to the elements page
Browse files Browse the repository at this point in the history
  • Loading branch information
Wolfteam committed Jul 11, 2021
1 parent d76725f commit a175c65
Show file tree
Hide file tree
Showing 6 changed files with 91 additions and 96 deletions.
35 changes: 19 additions & 16 deletions lib/presentation/elements/widgets/element_debuff_card.dart
Expand Up @@ -17,22 +17,25 @@ class ElementDebuffCard extends StatelessWidget {
@override
Widget build(BuildContext context) {
final theme = Theme.of(context);
return Card(
shape: Styles.cardShape,
child: Container(
padding: Styles.edgeInsetAll5,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
children: [
ElementImage.fromPath(path: image),
Text(
name,
textAlign: TextAlign.center,
style: theme.textTheme.subtitle1!.copyWith(fontWeight: FontWeight.bold),
),
Text(effect, textAlign: TextAlign.center)
],
return Padding(
padding: Styles.edgeInsetAll5,
child: Card(
shape: Styles.cardShape,
child: Container(
padding: Styles.edgeInsetAll5,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
children: [
ElementImage.fromPath(path: image),
Text(
name,
textAlign: TextAlign.center,
style: theme.textTheme.subtitle1!.copyWith(fontWeight: FontWeight.bold),
),
Text(effect, textAlign: TextAlign.center, style: theme.textTheme.subtitle2!.copyWith(fontSize: 12))
],
),
),
),
);
Expand Down
33 changes: 14 additions & 19 deletions lib/presentation/elements/widgets/sliver_element_debuffs.dart
Expand Up @@ -2,42 +2,37 @@ import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:genshindb/application/bloc.dart';
import 'package:genshindb/presentation/shared/loading.dart';
import 'package:genshindb/presentation/shared/styles.dart';
import 'package:responsive_grid/responsive_grid.dart';

import 'element_debuff_card.dart';

class SliverElementDebuffs extends StatelessWidget {
@override
Widget build(BuildContext context) {
final isPortrait = MediaQuery.of(context).orientation == Orientation.portrait;
return BlocBuilder<ElementsBloc, ElementsState>(
builder: (context, state) {
return state.when(
loading: () => const SliverToBoxAdapter(child: Loading(useScaffold: false)),
loaded: (debuffs, _, __) => SliverGrid.count(
crossAxisCount: isPortrait ? 2 : 3,
children: debuffs
.map((item) => Padding(
padding: Styles.edgeInsetAll5,
loaded: (debuffs, _, __) => SliverToBoxAdapter(
child: ResponsiveGridRow(
children: debuffs
.map(
(item) => ResponsiveGridCol(
xs: 6,
sm: 6,
md: 6,
lg: 3,
child: ElementDebuffCard(
key: Key(item.name),
effect: item.effect,
image: item.image,
name: item.name,
),
))
.toList(),
),
)
.toList(),
),
),
//TODO: COMMENTED UNTIL https://github.com/letsar/flutter_staggered_grid_view/issues/145
// loaded: (debuffs, _, __) => SliverStaggeredGrid.countBuilder(
// crossAxisCount: isPortrait ? 2 : 3,
// itemBuilder: (ctx, index) {
// final item = debuffs[index];
// return ElementDebuffCard(key: Key(item.name), effect: item.effect, image: item.image, name: item.name);
// },
// itemCount: debuffs.length,
// staggeredTileBuilder: (int index) => const StaggeredTile.fit(1),
// ),
);
},
);
Expand Down
38 changes: 22 additions & 16 deletions lib/presentation/elements/widgets/sliver_element_reactions.dart
Expand Up @@ -3,6 +3,7 @@ import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:genshindb/application/bloc.dart';
import 'package:genshindb/presentation/shared/loading.dart';
import 'package:genshindb/presentation/shared/styles.dart';
import 'package:responsive_grid/responsive_grid.dart';

import 'element_reaction_card.dart';

Expand All @@ -13,22 +14,27 @@ class SliverElementReactions extends StatelessWidget {
builder: (context, state) {
return state.when(
loading: () => const SliverToBoxAdapter(child: Loading(useScaffold: false)),
loaded: (_, reactions, __) => SliverList(
delegate: SliverChildBuilderDelegate(
(ctx, index) {
final e = reactions[index];
return Padding(
padding: Styles.edgeInsetAll5,
child: ElementReactionCard.withImages(
key: Key('reaction_$index'),
name: e.name,
effect: e.effect,
principal: e.principal,
secondary: e.secondary,
),
);
},
childCount: reactions.length,
loaded: (_, reactions, __) => SliverToBoxAdapter(
child: ResponsiveGridRow(
children: reactions
.map(
(e) => ResponsiveGridCol(
sm: 6,
md: 6,
lg: 4,
child: Padding(
padding: Styles.edgeInsetAll5,
child: ElementReactionCard.withImages(
key: Key(e.name),
name: e.name,
effect: e.effect,
principal: e.principal,
secondary: e.secondary,
),
),
),
)
.toList(),
),
),
);
Expand Down
58 changes: 28 additions & 30 deletions lib/presentation/elements/widgets/sliver_element_resonances.dart
Expand Up @@ -2,7 +2,7 @@ import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:genshindb/application/bloc.dart';
import 'package:genshindb/presentation/shared/loading.dart';
import 'package:genshindb/presentation/shared/styles.dart';
import 'package:responsive_grid/responsive_grid.dart';

import 'element_reaction_card.dart';

Expand All @@ -13,35 +13,33 @@ class SliverElementResonances extends StatelessWidget {
builder: (context, state) {
return state.when(
loading: () => const SliverToBoxAdapter(child: Loading(useScaffold: false)),
loaded: (_, __, resonances) => SliverList(
delegate: SliverChildBuilderDelegate(
(ctx, index) {
final e = resonances[index];
if (e.principal.isNotEmpty && e.secondary.isNotEmpty) {
return Padding(
padding: Styles.edgeInsetAll5,
child: ElementReactionCard.withImages(
key: Key('resonance_$index'),
name: e.name,
effect: e.effect,
principal: e.principal,
secondary: e.secondary,
showPlusIcon: false,
),
);
}

return Padding(
padding: Styles.edgeInsetAll5,
child: ElementReactionCard.withoutImage(
name: e.name,
effect: e.effect,
showPlusIcon: false,
description: e.description,
),
);
},
childCount: resonances.length,
loaded: (_, __, resonances) => SliverToBoxAdapter(
child: IntrinsicHeight(
child: ResponsiveGridRow(
children: resonances
.map(
(e) => ResponsiveGridCol(
sm: 6,
md: 6,
lg: 4,
child: e.principal.isNotEmpty && e.secondary.isNotEmpty
? ElementReactionCard.withImages(
key: Key(e.name),
name: e.name,
effect: e.effect,
principal: e.principal,
secondary: e.secondary,
)
: ElementReactionCard.withoutImage(
name: e.name,
effect: e.effect,
showPlusIcon: false,
description: e.description,
),
),
)
.toList(),
),
),
),
);
Expand Down
21 changes: 7 additions & 14 deletions pubspec.lock
Expand Up @@ -307,13 +307,6 @@ packages:
url: "https://pub.dartlang.org"
source: hosted
version: "0.9.0"
flutter_layout_grid:
dependency: "direct main"
description:
name: flutter_layout_grid
url: "https://pub.dartlang.org"
source: hosted
version: "1.0.3"
flutter_local_notifications:
dependency: "direct main"
description:
Expand Down Expand Up @@ -595,13 +588,6 @@ packages:
url: "https://pub.dartlang.org"
source: hosted
version: "1.0.0"
nil:
dependency: "direct main"
description:
name: nil
url: "https://pub.dartlang.org"
source: hosted
version: "1.1.1"
numberpicker:
dependency: "direct main"
description:
Expand Down Expand Up @@ -805,6 +791,13 @@ packages:
url: "https://pub.dartlang.org"
source: hosted
version: "0.4.1"
responsive_grid:
dependency: "direct main"
description:
name: responsive_grid
url: "https://pub.dartlang.org"
source: hosted
version: "2.0.0"
screenshot:
dependency: "direct main"
description:
Expand Down
2 changes: 1 addition & 1 deletion pubspec.yaml
Expand Up @@ -30,7 +30,6 @@ dependencies:
flutter_bloc: ^7.0.1
flutter_colorpicker: ^0.4.0
flutter_inappwebview: ^5.3.2
flutter_layout_grid: ^1.0.3
flutter_local_notifications: ^5.0.0+1
flutter_localizations:
sdk: flutter
Expand All @@ -57,6 +56,7 @@ dependencies:
pull_to_refresh: ^2.0.0
rate_my_app: ^1.1.0+1
responsive_builder: ^0.4.1
responsive_grid: ^2.0.0
screenshot: ^1.2.1
shared_preferences: ^2.0.6
sprintf: ^6.0.0
Expand Down

0 comments on commit a175c65

Please sign in to comment.