Skip to content

Commit

Permalink
Header updates to pages (#217)
Browse files Browse the repository at this point in the history
* Header updates to pages

* also changed edit profile header

* edited profile page to match designs

---------

Co-authored-by: cathli66 <[email protected]>
  • Loading branch information
3TTemi and cathli66 authored May 2, 2024
1 parent 986f65e commit 0d314e4
Show file tree
Hide file tree
Showing 6 changed files with 152 additions and 100 deletions.
29 changes: 27 additions & 2 deletions game/lib/achievements/achievements_page.dart
Original file line number Diff line number Diff line change
Expand Up @@ -49,9 +49,15 @@ class _AchievementsPageState extends State<AchievementsPage> {
List<String> selectedCategories = [];
List<String> selectedLocations = [];
String selectedDifficulty = '';

@override
Widget build(BuildContext context) {
var headerStyle = TextStyle(
color: Color(0xFFFFF8F1),
fontSize: 20,
fontFamily: 'Poppins',
fontWeight: FontWeight.w600,
);

return Container(
decoration: BoxDecoration(
color: Color(0xFFED5656),
Expand All @@ -60,7 +66,26 @@ class _AchievementsPageState extends State<AchievementsPage> {
bottom: false,
child: Scaffold(
appBar: AppBar(
title: const Text('Achievements'),
backgroundColor: Color.fromARGB(255, 237, 86, 86),
toolbarHeight: MediaQuery.of(context).size.height * 0.1,
leading: Align(
alignment: Alignment.center,
child: IconButton(
icon: Icon(Icons.navigate_before),
color: Colors.white,
onPressed: () => Navigator.pop(context),
),
),
title: Padding(
padding: EdgeInsets.only(
top: MediaQuery.of(context).size.height * 0.01),
child: Text(
'Achievements',
style: headerStyle,
),
),
centerTitle: true, // Still useful for horizontal centering
actions: [],
),
body: Container(
width: double.infinity,
Expand Down
5 changes: 3 additions & 2 deletions game/lib/global_leaderboard/global_leaderboard_widget.dart
Original file line number Diff line number Diff line change
Expand Up @@ -44,12 +44,13 @@ class _GlobalLeaderboardWidgetState extends State<GlobalLeaderboardWidget> {
key: scaffoldKey,
backgroundColor: Color.fromARGB(255, 255, 248, 241),
appBar: AppBar(
toolbarHeight: 85,
toolbarHeight: MediaQuery.sizeOf(context).height * 0.1,
automaticallyImplyLeading: false,
backgroundColor: Color.fromARGB(255, 237, 86, 86),
flexibleSpace: FlexibleSpaceBar(
title: Padding(
padding: const EdgeInsets.only(bottom: 8),
padding: EdgeInsets.only(
bottom: MediaQuery.sizeOf(context).height * 0.01),
child: Text(
'Leaderboard',
style: leaderboardStyle,
Expand Down
36 changes: 22 additions & 14 deletions game/lib/profile/completed_feed.dart
Original file line number Diff line number Diff line change
Expand Up @@ -16,27 +16,35 @@ import 'package:tuple/tuple.dart';
class CompletedFeedWidget extends StatelessWidget {
@override
Widget build(BuildContext context) {
var headerStyle = TextStyle(
color: Color(0xFFFFF8F1),
fontSize: 20,
fontFamily: 'Poppins',
fontWeight: FontWeight.w600,
);

return Scaffold(
backgroundColor: Color.fromARGB(255, 255, 248, 241),
appBar: AppBar(
backgroundColor: Color.fromARGB(255, 237, 86, 86),
leading: IconButton(
icon: const Icon(Icons.navigate_before),
color: Colors.white,
onPressed: () {
Navigator.pop(
context,
);
},
),
title: const Text(
'Completed',
style: TextStyle(
toolbarHeight: MediaQuery.of(context).size.height * 0.1,
leading: Align(
alignment: Alignment.center,
child: IconButton(
icon: Icon(Icons.navigate_before),
color: Colors.white,
fontFamily: 'Poppins',
fontWeight: FontWeight.bold,
onPressed: () => Navigator.pop(context),
),
),
title: Padding(
padding:
EdgeInsets.only(top: MediaQuery.of(context).size.height * 0.01),
child: Text(
'Completed',
style: headerStyle,
),
),
centerTitle: true, // Still useful for horizontal centering
actions: [],
),
body: Consumer4<UserModel, EventModel, TrackerModel, ChallengeModel>(
Expand Down
46 changes: 27 additions & 19 deletions game/lib/profile/edit_profile.dart
Original file line number Diff line number Diff line change
Expand Up @@ -119,28 +119,36 @@ class _EditProfileState extends State<EditProfileWidget> {

@override
Widget build(BuildContext context) {
var headerStyle = TextStyle(
color: Color(0xFFFFF8F1),
fontSize: 20,
fontFamily: 'Poppins',
fontWeight: FontWeight.w600,
);

return Scaffold(
backgroundColor: Color.fromARGB(255, 255, 248, 241),
appBar: AppBar(
toolbarHeight: 70,
backgroundColor: Color.fromARGB(255, 237, 86, 86),
// Set widget before appBar title
leading: IconButton(
icon: const Icon(Icons.navigate_before),
color: Colors.white,
onPressed: () {
Navigator.pop(context);
},
),
title: const Text(
'Edit Profile',
style: TextStyle(
color: Colors.white,
fontFamily: 'Poppins',
fontWeight: FontWeight.bold),
),
actions: [],
),
toolbarHeight: 70,
backgroundColor: Color.fromARGB(255, 237, 86, 86),
// Set widget before appBar title
leading: IconButton(
icon: const Icon(Icons.navigate_before),
color: Colors.white,
onPressed: () {
Navigator.pop(context);
},
),
title: Padding(
padding: EdgeInsets.only(
top: MediaQuery.of(context).size.height * 0.01),
child: Text(
'Edit Profile',
style: headerStyle,
),
),
actions: [],
centerTitle: true),
body: Center(
child: Consumer<UserModel>(builder: (context, userModel, child) {
if (userModel.userData == null) {
Expand Down
100 changes: 50 additions & 50 deletions game/lib/profile/profile_page.dart
Original file line number Diff line number Diff line change
Expand Up @@ -140,54 +140,6 @@ class _ProfilePageState extends State<ProfilePage> {
style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
),
),
Padding(
padding: const EdgeInsets.only(left: 24, right: 24),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Text("Achievements",
style: TextStyle(
fontSize: 16, fontWeight: FontWeight.bold)),
TextButton(
onPressed: () {
// Handle button press, e.g., navigate to details page
Navigator.of(context).push(MaterialPageRoute(
builder: (context) => AchievementsPage()));
},
child: Text(
'View Details →',
style: TextStyle(
color: Colors.black,
fontSize: 14.0,
),
),
)
],
),
),
//To be replaced with real data
Padding(
padding: EdgeInsets.only(left: 30, right: 30),
child: Column(
children: (achList
.sortedBy((a, b) => (a
.$1.progress / // least completed first
(a.$2.requiredPoints ?? 1))
.compareTo(
b.$1.progress / (b.$2.requiredPoints ?? 1)))
.take(2)
.map((e) => ([
AchievementCell(
e.$2.description ?? "",
SvgPicture.asset(
"assets/icons/achievementsilver.svg"),
e.$1.progress,
e.$2.requiredPoints ?? 0),
SizedBox(height: 10),
]))
.expand((el) => el)
.toList()))),
//Completed Events
Padding(
padding: const EdgeInsets.only(left: 24, right: 24.0),
Expand Down Expand Up @@ -217,8 +169,8 @@ class _ProfilePageState extends State<ProfilePage> {
),
),
SizedBox(
height: 200,
width: 345,
height: MediaQuery.sizeOf(context).height * 0.25,
width: MediaQuery.sizeOf(context).width * 0.85,
child: ListView.separated(
itemCount: 2,
itemBuilder: (context, index) {
Expand Down Expand Up @@ -261,6 +213,54 @@ class _ProfilePageState extends State<ProfilePage> {
},
),
),
Padding(
padding: const EdgeInsets.only(left: 24, right: 24),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Text("Achievements",
style: TextStyle(
fontSize: 16, fontWeight: FontWeight.bold)),
TextButton(
onPressed: () {
// Handle button press, e.g., navigate to details page
Navigator.of(context).push(MaterialPageRoute(
builder: (context) => AchievementsPage()));
},
child: Text(
'View Details →',
style: TextStyle(
color: Colors.black,
fontSize: 14.0,
),
),
)
],
),
),
//To be replaced with real data
Padding(
padding: EdgeInsets.only(left: 30, right: 30),
child: Column(
children: (achList
.sortedBy((a, b) => (a
.$1.progress / // least completed first
(a.$2.requiredPoints ?? 1))
.compareTo(
b.$1.progress / (b.$2.requiredPoints ?? 1)))
.take(2)
.map((e) => ([
AchievementCell(
e.$2.description ?? "",
SvgPicture.asset(
"assets/icons/achievementsilver.svg"),
e.$1.progress,
e.$2.requiredPoints ?? 0),
SizedBox(height: 10),
]))
.expand((el) => el)
.toList()))),
],
);
}),
Expand Down
36 changes: 23 additions & 13 deletions game/lib/profile/settings_page.dart
Original file line number Diff line number Diff line change
Expand Up @@ -13,25 +13,35 @@ class SettingsPage extends StatelessWidget {

@override
Widget build(BuildContext context) {
var headerStyle = TextStyle(
color: Color(0xFFFFF8F1),
fontSize: 20,
fontFamily: 'Poppins',
fontWeight: FontWeight.w600,
);

return Scaffold(
backgroundColor: Color.fromARGB(255, 255, 248, 241),
appBar: AppBar(
backgroundColor: Color.fromARGB(255, 237, 86, 86),
// Set widget before appBar title
leading: IconButton(
icon: const Icon(Icons.navigate_before),
color: Colors.white,
onPressed: () {
Navigator.pop(context);
},
toolbarHeight: MediaQuery.of(context).size.height * 0.1,
leading: Align(
alignment: Alignment.center,
child: IconButton(
icon: Icon(Icons.navigate_before),
color: Colors.white,
onPressed: () => Navigator.pop(context),
),
),
title: const Text(
'Settings',
style: TextStyle(
color: Colors.white,
fontFamily: 'Poppins',
fontWeight: FontWeight.bold),
title: Padding(
padding:
EdgeInsets.only(top: MediaQuery.of(context).size.height * 0.01),
child: Text(
'Settings',
style: headerStyle,
),
),
centerTitle: true, // Still useful for horizontal centering
actions: [],
),
body: Center(child: LayoutBuilder(
Expand Down

0 comments on commit 0d314e4

Please sign in to comment.