bachelor/wonders
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Intial pass on collection screen

Browse Source
This commit is contained in:
Shawn 2022-10-27 10:24:28 -06:00
parent 630a7a38e5
commit b5157d14ce
3 changed files with 121 additions and 94 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
lib/ui/screens/collection/collection_screen.dart
View File

@ -76,12 +76,14 @@ class _CollectionScreenState extends State<CollectionScreen> with GetItStateMixi
return ColoredBox(
color: $styles.colors.greyStrong,
child: Stack(children: [
Positioned.fill(
child: Column(
children: [
Expanded(
child: Column(crossAxisAlignment: CrossAxisAlignment.stretch, children: [
SimpleHeader($strings.collectionTitleCollection),
_NewlyDiscoveredRow(count: discovered, onPressed: _scrollToTarget),
_CollectionList(
Flexible(
child: _CollectionList(
states: _states,
fromId: widget.fromId,
scrollKey: _scrollKey,
@ -89,13 +91,12 @@ class _CollectionScreenState extends State<CollectionScreen> with GetItStateMixi
onPressed: (o) => _showDetails(context, o),
onReset: discovered + explored > 0 ? _handleReset : null,
),
]),
),
Positioned.fill(
top: null,
child: _CollectionFooter(count: discovered + explored, total: total),
),
]),
),
_CollectionFooter(count: discovered + explored, total: total),
],
),
);
}
}

22
lib/ui/screens/collection/widgets/_collection_footer.dart
View File

@ -10,19 +10,23 @@ class _CollectionFooter extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Stack(children: [
Transform.translate(
offset: Offset(0, -$styles.insets.xl),
child: VtGradient(
[$styles.colors.greyStrong.withOpacity(0), $styles.colors.greyStrong],
const [0, 1],
height: $styles.insets.xl,
),
),
// TODO SB: Maybe restore this gradient? Need to come up with alternate approach since list can now scroll horizontally
// Transform.translate(
// offset: Offset(0, -$styles.insets.xl),
// child: VtGradient(
// [$styles.colors.greyStrong.withOpacity(0), $styles.colors.greyStrong],
// const [0, 1],
// height: $styles.insets.xl,
// ),
// ),
Container(
padding: EdgeInsets.symmetric(horizontal: $styles.insets.md, vertical: $styles.insets.sm),
color: $styles.colors.greyStrong,
child: SafeArea(
top: false,
child: Center(
child: SizedBox(
width: $styles.sizes.maxContentWidth1,
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
@ -33,6 +37,8 @@ class _CollectionFooter extends StatelessWidget {
],
),
),
),
),
)
]);
}

124
lib/ui/screens/collection/widgets/_collection_list.dart
View File

@ -22,70 +22,90 @@ class _CollectionList extends StatelessWidget {
@override
Widget build(BuildContext context) {
List<WonderData> wonders = wondersLogic.all;
List<Widget> children = [];
for (int i = 0; i < wonders.length; i++) {
WonderData data = wonders[i];
children.add(_buildCategoryTitle(context, data, data.type == scrollWonder ? scrollKey : null));
children.add(Gap($styles.insets.md));
children.add(_buildCollectibleRow(context, data.type, states));
children.add(Gap($styles.insets.xl));
bool vtMode = context.isLandscape == false;
// Create list of collections that is shared by both hz and vt layouts
List<Widget> collections = [
...wonders.map((d) {
return _buildSingleCollection(
context,
height: vtMode ? 300 : 400,
width: vtMode ? null : 600,
data: d,
);
}).toList()
];
// Scroll view adapts to scroll vertically or horizontally
return SingleChildScrollView(
scrollDirection: vtMode ? Axis.vertical : Axis.horizontal,
child: Padding(
padding: EdgeInsets.all($styles.insets.lg),
child: vtMode
? SeparatedColumn(
mainAxisSize: MainAxisSize.min,
separatorBuilder: () => Gap($styles.insets.lg),
children: collections,
)
: SeparatedRow(
separatorBuilder: () => Gap($styles.insets.xl * 2),
mainAxisSize: MainAxisSize.min,
children: collections,
),
),
);
}
children.add(_buildResetBtn(context));
Widget _buildSingleCollection(BuildContext context, {double? width, double? height, required WonderData data}) {
List<CollectibleData> collectibles = collectiblesLogic.forWonder(data.type);
return Flexible(
child: RepaintBoundary(
child: ScrollDecorator.shadow(
builder: (controller) => SingleChildScrollView(
controller: controller,
padding: EdgeInsets.all($styles.insets.md).copyWith(bottom: $styles.insets.offset * 2.5),
return Center(
child: SizedBox(
width: width ?? double.infinity,
height: height ?? double.infinity,
child: Column(
children: children,
),
),
),
),
);
}
Widget _buildCategoryTitle(BuildContext context, WonderData data, Key? key) {
return Text(
mainAxisAlignment: MainAxisAlignment.center,
children: [
/// Title
Text(
data.title.toUpperCase(),
key: data.type == scrollWonder ? scrollKey : null,
textAlign: TextAlign.left,
key: key,
style: $styles.text.title1.copyWith(color: $styles.colors.offWhite),
);
}
),
Gap($styles.insets.md),
Widget _buildCollectibleRow(BuildContext context, WonderType wonder, Map<String, int> states) {
final double height = $styles.insets.lg * 6;
List<CollectibleData> list = collectiblesLogic.forWonder(wonder);
if (list.isEmpty) return Container(height: height, color: $styles.colors.black);
List<Widget> children = [];
for (int i = 0; i < list.length; i++) {
if (i > 0) children.add(Gap($styles.insets.md));
CollectibleData collectible = list[i];
int state = states[collectible.id] ?? CollectibleState.lost;
children.add(Flexible(
/// Images
Expanded(
child: SeparatedRow(
separatorBuilder: () => Gap($styles.insets.sm),
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
...collectibles.map((e) {
int state = states[e.id] ?? CollectibleState.lost;
return Flexible(
child: _CollectionTile(
collectible: collectible,
collectible: e,
state: state,
onPressed: onPressed,
heroTag: collectible.id == fromId ? 'collectible_image_$fromId' : null,
heroTag: e.id == fromId ? 'collectible_image_$fromId' : null,
),
));
}
return SizedBox(height: height, child: Row(crossAxisAlignment: CrossAxisAlignment.stretch, children: children));
);
}).toList()
]),
)
],
),
),
);
}
Widget _buildResetBtn(BuildContext context) {
Widget btn = AppBtn.from(
onPressed: onReset ?? () {},
text: $strings.collectionButtonReset,
isSecondary: true,
expand: true,
);
return AnimatedOpacity(opacity: onReset == null ? 0.25 : 1, duration: $styles.times.fast, child: btn);
}
// TODO: Restore reset functionality somehow
// Widget _buildResetBtn(BuildContext context) {
// Widget btn = AppBtn.from(
// onPressed: onReset ?? () {},
// text: $strings.collectionButtonReset,
// isSecondary: true,
// expand: true,
// );
// return AnimatedOpacity(opacity: onReset == null ? 0.25 : 1, duration: $styles.times.fast, child: btn);
// }
}