fixed navigation and ui bugs in summary

This commit is contained in:
kima 2023-06-25 14:36:18 +02:00
parent 50bc03f403
commit 51e2c63134
6 changed files with 315 additions and 297 deletions

View File

@ -13,7 +13,6 @@ import 'package:flutter_feather_icons/flutter_feather_icons.dart';
import 'package:i18n_extension/i18n_widget.dart';
import 'package:intl/intl.dart';
import 'package:provider/provider.dart';
import 'package:wtf_sliding_sheet/wtf_sliding_sheet.dart';
import 'live_card.i18n.dart';
class LiveCard extends StatefulWidget {
@ -68,30 +67,31 @@ class _LiveCardState extends State<LiveCard> {
),
),
onTap: () {
showSlidingBottomSheet(
context,
useRootNavigator: true,
builder: (context) => SlidingSheetDialog(
color: Colors.black.withOpacity(0.99),
duration: const Duration(milliseconds: 400),
scrollSpec: const ScrollSpec.bouncingScroll(),
snapSpec: const SnapSpec(
snap: true,
snappings: [1.0],
initialSnap: 1.0,
positioning: SnapPositioning.relativeToAvailableSpace,
),
minHeight: MediaQuery.of(context).size.height,
cornerRadius: 16,
cornerRadiusOnFullscreen: 0,
builder: (context, state) => const Material(
color: Colors.black,
child: SummaryScreen(
currentPage: 'start',
),
),
),
);
// showSlidingBottomSheet(
// context,
// useRootNavigator: true,
// builder: (context) => SlidingSheetDialog(
// color: Colors.black.withOpacity(0.99),
// duration: const Duration(milliseconds: 400),
// scrollSpec: const ScrollSpec.bouncingScroll(),
// snapSpec: const SnapSpec(
// snap: true,
// snappings: [1.0],
// initialSnap: 1.0,
// positioning: SnapPositioning.relativeToAvailableSpace,
// ),
// minHeight: MediaQuery.of(context).size.height,
// cornerRadius: 16,
// cornerRadiusOnFullscreen: 0,
// builder: (context, state) => const Material(
// color: Colors.black,
// child: SummaryScreen(
// currentPage: 'start',
// ),
// ),
// ),
// );
SummaryScreen.show(context: context, currentPage: 'start');
},
);
break;

View File

@ -198,163 +198,164 @@ class _GradesBodyState extends State<GradesBody> {
getGrades();
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
height: ((100 * subjectTiles5.length) /
(subjectTiles5[0].runtimeType == AnimatedContainer
? 1.95
: 1.2))
.toDouble(),
child: ListView.builder(
padding: const EdgeInsets.only(left: 5),
physics: const BouncingScrollPhysics(),
itemCount: max(subjectTiles5.length, 1),
itemBuilder: (context, index) {
if (subjectTiles5.isNotEmpty) {
EdgeInsetsGeometry panelPadding =
const EdgeInsets.symmetric(horizontal: 24.0);
return Expanded(
child: ListView(
children: [
SizedBox(
height: ((100 * subjectTiles5.length) /
(subjectTiles5[0].runtimeType == AnimatedContainer
? 1.95
: 1.2))
.toDouble(),
child: ListView.builder(
padding: const EdgeInsets.only(left: 5),
physics: const BouncingScrollPhysics(),
itemCount: max(subjectTiles5.length, 1),
itemBuilder: (context, index) {
if (subjectTiles5.isNotEmpty) {
EdgeInsetsGeometry panelPadding =
const EdgeInsets.symmetric(horizontal: 24.0);
if (subjectTiles5[index].runtimeType == AnimatedContainer) {
return Padding(
padding: const EdgeInsets.only(top: 8),
child: subjectTiles5[index]);
if (subjectTiles5[index].runtimeType == AnimatedContainer) {
return Padding(
padding: const EdgeInsets.only(top: 8),
child: subjectTiles5[index]);
} else {
return Padding(
padding: panelPadding, child: subjectTiles5[index]);
}
} else {
return Padding(
padding: panelPadding, child: subjectTiles5[index]);
return Container();
}
} else {
return Container();
}
},
},
),
),
),
const SizedBox(height: 12.0),
Text(
'tryagain'.i18n,
style: const TextStyle(
fontWeight: FontWeight.bold,
fontSize: 22.0,
color: Colors.white,
const SizedBox(height: 12.0),
Text(
'tryagain'.i18n,
style: const TextStyle(
fontWeight: FontWeight.bold,
fontSize: 22.0,
color: Colors.white,
),
),
),
const SizedBox(height: 12.0),
SizedBox(
height: ((100 * subjectTiles3.length) /
(subjectTiles3[0].runtimeType == AnimatedContainer
? 1.95
: 1.2))
.toDouble(),
child: ListView.builder(
padding: const EdgeInsets.only(left: 5),
physics: const BouncingScrollPhysics(),
itemCount: max(subjectTiles3.length, 1),
itemBuilder: (context, index) {
if (subjectTiles3.isNotEmpty) {
EdgeInsetsGeometry panelPadding =
const EdgeInsets.symmetric(horizontal: 24.0);
const SizedBox(height: 12.0),
SizedBox(
height: ((100 * subjectTiles3.length) /
(subjectTiles3[0].runtimeType == AnimatedContainer
? 1.95
: 1.2))
.toDouble(),
child: ListView.builder(
padding: const EdgeInsets.only(left: 5),
physics: const BouncingScrollPhysics(),
itemCount: max(subjectTiles3.length, 1),
itemBuilder: (context, index) {
if (subjectTiles3.isNotEmpty) {
EdgeInsetsGeometry panelPadding =
const EdgeInsets.symmetric(horizontal: 24.0);
if (subjectTiles3[index].runtimeType == AnimatedContainer) {
return Padding(
padding: const EdgeInsets.only(top: 8),
child: subjectTiles3[index]);
if (subjectTiles3[index].runtimeType == AnimatedContainer) {
return Padding(
padding: const EdgeInsets.only(top: 8),
child: subjectTiles3[index]);
} else {
return Padding(
padding: panelPadding, child: subjectTiles3[index]);
}
} else {
return Padding(
padding: panelPadding, child: subjectTiles3[index]);
return Container();
}
} else {
return Container();
}
},
},
),
),
),
const SizedBox(height: 12.0),
Text(
'oops'.i18n,
style: const TextStyle(
fontWeight: FontWeight.bold,
fontSize: 22.0,
color: Colors.white,
const SizedBox(height: 12.0),
Text(
'oops'.i18n,
style: const TextStyle(
fontWeight: FontWeight.bold,
fontSize: 22.0,
color: Colors.white,
),
),
),
const SizedBox(height: 12.0),
SizedBox(
height: ((100 * subjectTiles1.length) /
(subjectTiles1[0].runtimeType == AnimatedContainer
? 1.95
: 1.2))
.toDouble(),
child: ListView.builder(
padding: const EdgeInsets.only(left: 5),
physics: const BouncingScrollPhysics(),
itemCount: max(subjectTiles1.length, 1),
itemBuilder: (context, index) {
if (subjectTiles1.isNotEmpty) {
EdgeInsetsGeometry panelPadding =
const EdgeInsets.symmetric(horizontal: 24.0);
const SizedBox(height: 12.0),
SizedBox(
height: ((100 * subjectTiles1.length) /
(subjectTiles1[0].runtimeType == AnimatedContainer
? 1.95
: 1.2))
.toDouble(),
child: ListView.builder(
padding: const EdgeInsets.only(left: 5),
physics: const BouncingScrollPhysics(),
itemCount: max(subjectTiles1.length, 1),
itemBuilder: (context, index) {
if (subjectTiles1.isNotEmpty) {
EdgeInsetsGeometry panelPadding =
const EdgeInsets.symmetric(horizontal: 24.0);
if (subjectTiles1[index].runtimeType == AnimatedContainer) {
return Padding(
padding: const EdgeInsets.only(top: 8),
child: subjectTiles1[index]);
if (subjectTiles1[index].runtimeType == AnimatedContainer) {
return Padding(
padding: const EdgeInsets.only(top: 8),
child: subjectTiles1[index]);
} else {
return Padding(
padding: panelPadding, child: subjectTiles1[index]);
}
} else {
return Padding(
padding: panelPadding, child: subjectTiles1[index]);
return Container();
}
} else {
return Container();
}
},
},
),
),
),
const SizedBox(height: 40.0),
Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Text(
'endyear_avg'.i18n,
textAlign: TextAlign.center,
style: const TextStyle(
fontWeight: FontWeight.bold,
fontSize: 22.0,
color: Colors.white,
),
),
Container(
margin: const EdgeInsets.only(top: 10.0),
padding:
const EdgeInsets.symmetric(horizontal: 16.0, vertical: 4.0),
decoration: BoxDecoration(
color: gradeColor(context: context, value: endYearAvg)
.withOpacity(.2),
border: Border.all(
color: (gradeColor(context: context, value: endYearAvg))
.withOpacity(0.0),
width: 2.0,
),
borderRadius: BorderRadius.circular(45.0),
),
child: AutoSizeText.rich(
TextSpan(
text: endYearAvgText,
),
maxLines: 1,
minFontSize: 5,
const SizedBox(height: 30.0),
Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Text(
'endyear_avg'.i18n,
textAlign: TextAlign.center,
style: TextStyle(
color: gradeColor(context: context, value: endYearAvg),
fontWeight: FontWeight.w800,
fontSize: 32.0,
style: const TextStyle(
fontWeight: FontWeight.bold,
fontSize: 22.0,
color: Colors.white,
),
),
),
],
Container(
margin: const EdgeInsets.only(top: 10.0),
padding: const EdgeInsets.symmetric(
horizontal: 16.0, vertical: 4.0),
decoration: BoxDecoration(
color: gradeColor(context: context, value: endYearAvg)
.withOpacity(.2),
border: Border.all(
color: (gradeColor(context: context, value: endYearAvg))
.withOpacity(0.0),
width: 2.0,
),
borderRadius: BorderRadius.circular(45.0),
),
child: AutoSizeText.rich(
TextSpan(
text: endYearAvgText,
),
maxLines: 1,
minFontSize: 5,
textAlign: TextAlign.center,
style: TextStyle(
color: gradeColor(context: context, value: endYearAvg),
fontWeight: FontWeight.w800,
fontSize: 32.0,
),
),
),
],
),
),
),
],
],
),
);
}
}

View File

@ -230,34 +230,34 @@ class _LessonsBodyState extends State<LessonsBody> {
getAndSortDelays();
generateTiles();
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.center,
children: [
lessons[0],
const SizedBox(height: 18.0),
Text(
'dontfelt'.i18n,
style: const TextStyle(
fontWeight: FontWeight.bold,
fontSize: 22.0,
color: Colors.white,
return Expanded(
child: ListView(
children: [
lessons[0],
const SizedBox(height: 18.0),
Text(
'dontfelt'.i18n,
style: const TextStyle(
fontWeight: FontWeight.bold,
fontSize: 22.0,
color: Colors.white,
),
),
),
const SizedBox(height: 18.0),
lessons[1],
const SizedBox(height: 18.0),
Text(
'youlate'.i18n,
style: const TextStyle(
fontWeight: FontWeight.bold,
fontSize: 22.0,
color: Colors.white,
const SizedBox(height: 18.0),
lessons[1],
const SizedBox(height: 18.0),
Text(
'youlate'.i18n,
style: const TextStyle(
fontWeight: FontWeight.bold,
fontSize: 22.0,
color: Colors.white,
),
),
),
const SizedBox(height: 18.0),
lessons[2],
],
const SizedBox(height: 18.0),
lessons[2],
],
),
);
}
}

View File

@ -58,11 +58,10 @@ class _PersonalityBodyState extends State<PersonalityBody> {
Widget build(BuildContext context) {
user = Provider.of<UserProvider>(context);
return Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.spaceAround,
return Expanded(
child: ListView(
children: [
const SizedBox(height: 60),
const SizedBox(height: 30),
AnimatedCrossFade(
duration: const Duration(milliseconds: 1000),
sizeCurve: Curves.easeInToLinear,
@ -80,7 +79,7 @@ class _PersonalityBodyState extends State<PersonalityBody> {
? CrossFadeState.showFirst
: CrossFadeState.showSecond,
),
const SizedBox(height: 40),
const SizedBox(height: 30),
if (isRevealed)
Center(
child: Row(
@ -122,6 +121,8 @@ class _PersonalityBodyState extends State<PersonalityBody> {
),
),
const SizedBox(height: 60),
]);
],
),
);
}
}

View File

@ -3,7 +3,6 @@ import 'package:filcnaplo/models/settings.dart';
import 'package:filcnaplo_kreta_api/providers/grade_provider.dart';
import 'package:filcnaplo_mobile_ui/screens/summary/summary_screen.dart';
import 'package:filcnaplo_mobile_ui/screens/summary/summary_screen.i18n.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_feather_icons/flutter_feather_icons.dart';
import 'package:provider/provider.dart';
@ -61,6 +60,7 @@ class _StartBodyState extends State<StartBody> {
color: Colors.black,
child: SummaryScreen(
currentPage: 'grades',
isBottomSheet: true,
),
),
),

View File

@ -1,6 +1,7 @@
import 'package:confetti/confetti.dart';
import 'package:filcnaplo/api/providers/user_provider.dart';
import 'package:filcnaplo/models/settings.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_feather_icons/flutter_feather_icons.dart';
import 'package:provider/provider.dart';
@ -15,12 +16,22 @@ import 'pages/personality_page.dart';
class SummaryScreen extends StatefulWidget {
final String currentPage;
final bool isBottomSheet;
const SummaryScreen({Key? key, this.currentPage = 'personality'})
: super(key: key);
const SummaryScreen({
Key? key,
this.currentPage = 'personality',
this.isBottomSheet = false,
}) : super(key: key);
@override
_SummaryScreenState createState() => _SummaryScreenState();
static show(
{required BuildContext context,
String currentPage = 'personality'}) =>
Navigator.of(context, rootNavigator: true).push(CupertinoPageRoute(
builder: (context) => SummaryScreen(currentPage: currentPage)));
}
class _SummaryScreenState extends State<SummaryScreen>
@ -28,7 +39,6 @@ class _SummaryScreenState extends State<SummaryScreen>
late UserProvider user;
late SettingsProvider settings;
late AnimationController _hideContainersController;
ConfettiController? _confettiController;
late String firstName;
@ -46,9 +56,6 @@ class _SummaryScreenState extends State<SummaryScreen>
@override
void initState() {
super.initState();
_hideContainersController = AnimationController(
vsync: this, duration: const Duration(milliseconds: 200));
}
@override
@ -70,106 +77,113 @@ class _SummaryScreenState extends State<SummaryScreen>
firstName = "János";
}
return AnimatedBuilder(
animation: _hideContainersController,
builder: (context, child) => Opacity(
opacity: 1 - _hideContainersController.value,
child: Container(
decoration: BoxDecoration(gradient: _backgroundGradient),
child: Container(
decoration: BoxDecoration(gradient: _backgroundGradient),
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height,
child: SafeArea(
child: Padding(
padding: EdgeInsets.only(
left: 24.0,
right: 24.0,
top: MediaQuery.of(context).padding.top,
bottom: 52.0,
),
child: Column(
crossAxisAlignment: widget.currentPage == 'start'
? CrossAxisAlignment.center
: CrossAxisAlignment.start,
mainAxisAlignment: widget.currentPage == 'start'
? MainAxisAlignment.spaceBetween
: MainAxisAlignment.start,
return widget.isBottomSheet
? buildContainer()
: Scaffold(
body: buildContainer(),
);
}
Widget buildContainer() {
return Container(
decoration: BoxDecoration(gradient: _backgroundGradient),
child: Container(
decoration: BoxDecoration(gradient: _backgroundGradient),
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height,
child: SafeArea(
child: Padding(
padding: const EdgeInsets.only(
left: 24.0,
right: 24.0,
top: 15.0,
bottom: 40.0,
),
child: Column(
crossAxisAlignment: widget.currentPage == 'start'
? CrossAxisAlignment.center
: CrossAxisAlignment.start,
mainAxisAlignment: widget.currentPage == 'start'
? MainAxisAlignment.spaceBetween
: MainAxisAlignment.start,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'greeting'.i18n.fill([firstName]),
textAlign: TextAlign.left,
maxLines: 2,
overflow: TextOverflow.fade,
style: const TextStyle(
fontWeight: FontWeight.w900,
fontSize: 26.0,
color: Colors.white,
),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'greeting'.i18n.fill([firstName]),
textAlign: TextAlign.left,
maxLines: 2,
overflow: TextOverflow.ellipsis,
softWrap: true,
style: const TextStyle(
fontWeight: FontWeight.w900,
fontSize: 26.0,
color: Colors.white,
),
Text(
widget.currentPage == 'start'
? 'title_start'.i18n
: widget.currentPage == 'grades'
? 'title_grades'.i18n
: widget.currentPage == 'lessons'
? 'title_lessons'.i18n
: widget.currentPage == 'personality'
? 'title_personality'.i18n
: '',
overflow: TextOverflow.fade,
style: const TextStyle(
fontWeight: FontWeight.bold,
fontSize: 22.0,
color: Colors.white,
),
),
Text(
widget.currentPage == 'start'
? 'title_start'.i18n
: widget.currentPage == 'grades'
? 'title_grades'.i18n
: widget.currentPage == 'lessons'
? 'title_lessons'.i18n
: widget.currentPage == 'personality'
? 'title_personality'.i18n
: '',
maxLines: 1,
overflow: TextOverflow.fade,
softWrap: false,
style: const TextStyle(
fontWeight: FontWeight.bold,
fontSize: 22.0,
color: Colors.white,
),
],
),
widget.currentPage != 'start'
? IconButton(
onPressed: () async {
Navigator.of(context).pop();
if (widget.currentPage == 'grades') {
openNewPage(page: 'lessons');
} else if (widget.currentPage == 'lessons') {
openNewPage(page: 'allsum');
} else if (widget.currentPage == 'allsum') {
openNewPage(page: 'personality');
} else {
Navigator.of(context).maybePop();
}
},
icon: Icon(
widget.currentPage == 'personality'
? FeatherIcons.x
: FeatherIcons.arrowRight,
color: Colors.white,
),
)
: Container()
],
),
],
),
),
const SizedBox(height: 12.0),
widget.currentPage == 'start'
? const StartBody()
: widget.currentPage == 'grades'
? const GradesBody()
: widget.currentPage == 'lessons'
? const LessonsBody()
: widget.currentPage == 'allsum'
? const AllSumBody()
: const PersonalityBody(),
widget.currentPage != 'start'
? IconButton(
onPressed: () async {
Navigator.of(context).pop();
if (widget.currentPage == 'grades') {
openNewPage(page: 'lessons');
} else if (widget.currentPage == 'lessons') {
openNewPage(page: 'allsum');
} else if (widget.currentPage == 'allsum') {
openNewPage(page: 'personality');
} else {
Navigator.of(context).maybePop();
}
},
icon: Icon(
widget.currentPage == 'personality'
? FeatherIcons.x
: FeatherIcons.arrowRight,
color: Colors.white,
),
)
: Container()
],
),
),
const SizedBox(height: 12.0),
widget.currentPage == 'start'
? const StartBody()
: widget.currentPage == 'grades'
? const GradesBody()
: widget.currentPage == 'lessons'
? const LessonsBody()
: widget.currentPage == 'allsum'
? const AllSumBody()
: const PersonalityBody(),
],
),
),
),
@ -198,9 +212,11 @@ class _SummaryScreenState extends State<SummaryScreen>
color: Colors.black,
child: SummaryScreen(
currentPage: page,
isBottomSheet: true,
),
),
),
);
//SummaryScreen.show(context: context, currentPage: page);
}
}