Skip to content

Commit

Permalink
Made UI modifications to improve UX
Browse files Browse the repository at this point in the history
  • Loading branch information
@angrezichatterbox
angrezichatterbox committed Feb 8, 2025
1 parent 59f8ab1 commit e5c330a
Show file tree
Hide file tree
Showing 6 changed files with 475 additions and 361 deletions.
136 changes: 68 additions & 68 deletions lib/screens/Status/status_page.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,59 +17,56 @@ class StatusView extends StatefulWidget {

class StatusViewState extends State<StatusView> {
final StatusController controller =
Get.put(StatusController(apiUrl: 'https://api.bunkmate.college'));
Get.put(StatusController(apiUrl: 'https://api.bunkmate.college'));

final Color bgColor = const Color(0xFF121212);

final Color cardColor = const Color(0xFF1E1E1E);

final Color accentColor = const Color(0xFF4CAF50);

final Color textColor = Colors.white;

final Color secondaryTextColor = Colors.white70;

DateTime now = DateTime.now();

@override
Widget build(BuildContext context) {
controller.getStatus();

return Scaffold(
backgroundColor: bgColor,
appBar: AppBar(
centerTitle: false,
backgroundColor: bgColor,
elevation: 0,
centerTitle: false,
title: Padding(
padding: const EdgeInsets.only(left: 30),
child: Obx(() {
final dayOfWeek = DateFormat('EEEE').format(now);
final selectedDay = controller.days[controller.selectedDate.value.weekday] ?? '' ;
return Text(
dayOfWeek == selectedDay ? "Today" : (selectedDay.isNotEmpty ? selectedDay : 'No Day Selected'),
style: TextStyle(
color: secondaryTextColor,
fontSize: 30,
fontWeight: FontWeight.bold,
fontFamily: GoogleFonts.lexend().fontFamily,
),
);
}),
),
actions: [
Padding(
padding: const EdgeInsets.only(left: 30),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
padding: const EdgeInsets.symmetric(horizontal: 20),
child: Row(
children: [
Obx(() => Text(
controller.days[controller.selectedDate.value.weekday]
.toString(),
style: TextStyle(
color: secondaryTextColor,
fontSize: 30,
fontWeight: FontWeight.bold,
fontFamily: GoogleFonts.lexend().fontFamily,
),
)),
_buildRewindTimeButton(context),
_buildHelpButton(context),
],
),
),
const Spacer(),
Row(
children: [
_buildRewindTimeButton(context),
_buildHelpButon(context)
],
),
],
),
body: Obx(
() => controller.courses.isNotEmpty
() => controller.courses.isNotEmpty
? _buildCourseList()
: _buildEmptyState(context),
),
Expand All @@ -87,41 +84,38 @@ class StatusViewState extends State<StatusView> {
}
}

Widget _buildHelpButon(BuildContext context) {
return Padding(
padding: const EdgeInsets.only(right: 20),
child: ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: bgColor,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(20),
),
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
Widget _buildHelpButton(BuildContext context) {
return ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: bgColor,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(20),
),
onPressed: () {
final OnboardingState? onboarding = Onboarding.of(context);
if (onboarding != null) {
onboarding.show();
} else {
print("Onboarding is null");
}
},
child: const Icon(Icons.help_outline, size: 40, color: Colors.white),
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
),
onPressed: () {
final OnboardingState? onboarding = Onboarding.of(context);
if (onboarding != null) {
onboarding.show();
} else {
print("Onboarding is null");
}
},
child: Icon(Icons.help_outline, size: 40, color: Colors.white),
);
}

Widget _buildRewindTimeButton(BuildContext context) {
return ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: bgColor,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(20),
),
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
return ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: bgColor,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(20),
),
onPressed: () => controller.selectDate(context),
child: const Icon(LineIcons.calendar, size: 40, color: Colors.white),
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
),
onPressed: () => controller.selectDate(context),
child: Icon(LineIcons.calendar, size: 40, color: Colors.white),
);
}

Expand Down Expand Up @@ -149,22 +143,22 @@ class StatusViewState extends State<StatusView> {
onTap: () => _updateCourseStatus(course, "bunked"),
onDoubleTap: () => _updateCourseStatus(course, "cancelled"),
onLongPress: () => _updateCourseStatus(course, "present"),
child: Container(
child: AnimatedContainer(
duration: Duration(milliseconds: 300),
margin: const EdgeInsets.only(bottom: 16),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(16),
color: cardColor,
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.1),
blurRadius: 10,
offset: const Offset(0, 4),
color: Colors.black.withOpacity(0.2),
blurRadius: 12,
offset: const Offset(0, 6),
),
],
),
child: ListTile(
contentPadding:
const EdgeInsets.symmetric(horizontal: 20, vertical: 12),
contentPadding: const EdgeInsets.symmetric(horizontal: 20, vertical: 12),
leading: Icon(
controller.getRandomSubjectIcon(),
size: 36,
Expand All @@ -173,7 +167,10 @@ class StatusViewState extends State<StatusView> {
title: Text(
name,
style: TextStyle(
color: textColor, fontSize: 18, fontWeight: FontWeight.w500),
color: textColor,
fontSize: 18,
fontWeight: FontWeight.w500,
),
),
trailing: Container(
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
Expand All @@ -184,9 +181,10 @@ class StatusViewState extends State<StatusView> {
child: Text(
status,
style: TextStyle(
color: statusColor,
fontSize: 14,
fontWeight: FontWeight.bold),
color: statusColor,
fontSize: 14,
fontWeight: FontWeight.bold,
),
),
),
),
Expand Down Expand Up @@ -219,9 +217,11 @@ class StatusViewState extends State<StatusView> {
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(LineIcons.calendar, size: 80, color: accentColor),
const SizedBox(height: 20),
Text(
"No Courses Scheduled Today!",
style: TextStyle(color: textColor, fontSize: 20),
style: TextStyle(color: textColor, fontSize: 20, fontWeight: FontWeight.bold),
),
const SizedBox(height: 20),
SizedBox(
Expand All @@ -235,7 +235,7 @@ class StatusViewState extends State<StatusView> {
filled: true,
),
hint: Text(
"Copy Schedule",
"Copy Schedule From",
style: TextStyle(color: secondaryTextColor, fontSize: 16),
),
dropdownColor: cardColor,
Expand Down
1 change: 1 addition & 0 deletions lib/screens/TimeTable/time_table_page.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -156,6 +156,7 @@ class _TimeTablePageState extends State<TimeTablePage> {
borderRadius: BorderRadius.circular(10),
),
child: Row(

children: [
Icon(getRandomSubjectIcon(), size: 28, color: accentColor),
const SizedBox(width: 16),
Expand Down
107 changes: 68 additions & 39 deletions lib/screens/auth/login_screen.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,8 @@ class _LoginScreenState extends State<LoginScreen>
final Color textColor = Colors.white;
final Color secondaryTextColor = Colors.white70;

final GlobalKey<FormState> _formKey = GlobalKey<FormState>();

@override
void initState() {
super.initState();
Expand Down Expand Up @@ -78,32 +80,51 @@ class _LoginScreenState extends State<LoginScreen>
),
),
SizedBox(height: screenSize.height * 0.05),
_buildAuthField(
controller: loginController.usernameController,
icon: Icons.person_outline,
hintText: "Username",
),
const SizedBox(height: 20),
_buildAuthField(
controller: loginController.passwordController,
icon: Icons.lock_outline,
hintText: "Password",
isObscure: true,
),
const SizedBox(height: 12),
Align(
alignment: Alignment.centerRight,
child: TextButton(
onPressed: () {
Get.to(const MyWidget());
},
child: Text(
"Forgot Password?",
style: GoogleFonts.lexend(
color: accentColor,
fontWeight: FontWeight.w600,
Form(
key: _formKey,
child: Column(
children: [
_buildAuthField(
controller: loginController.usernameController,
icon: Icons.person_outline,
hintText: "Username",
validator: (value) {
if (value == null || value.isEmpty) {
return "Username is required";
}
return null;
},
),
),
const SizedBox(height: 20),
_buildAuthField(
controller: loginController.passwordController,
icon: Icons.lock_outline,
hintText: "Password",
isObscure: true,
validator: (value) {
if (value == null || value.isEmpty) {
return "Password is required";
}
return null;
},
),
const SizedBox(height: 12),
Align(
alignment: Alignment.centerRight,
child: TextButton(
onPressed: () {
Get.to(const MyWidget());
},
child: Text(
"Forgot Password?",
style: GoogleFonts.lexend(
color: accentColor,
fontWeight: FontWeight.w600,
),
),
),
),
],
),
),
SizedBox(height: screenSize.height * 0.04),
Expand Down Expand Up @@ -137,20 +158,12 @@ class _LoginScreenState extends State<LoginScreen>
);
}

Widget _buildParallaxBackground(BuildContext context) {
return Positioned.fill(
child: Image.network(
"",
fit: BoxFit.cover,
),
);
}

Widget _buildAuthField({
required TextEditingController controller,
required IconData icon,
required String hintText,
bool isObscure = false,
String? Function(String?)? validator,
}) {
return Container(
decoration: BoxDecoration(
Expand All @@ -164,17 +177,18 @@ class _LoginScreenState extends State<LoginScreen>
),
],
),
child: TextField(
child: TextFormField(
controller: controller,
obscureText: isObscure,
style: GoogleFonts.lexend(color: textColor),
validator: validator,
decoration: InputDecoration(
hintText: hintText,
hintStyle: GoogleFonts.lexend(color: secondaryTextColor),
prefixIcon: Icon(icon, color: accentColor),
border: InputBorder.none,
contentPadding:
const EdgeInsets.symmetric(horizontal: 16, vertical: 16),
const EdgeInsets.symmetric(horizontal: 16, vertical: 16),
),
),
);
Expand All @@ -183,9 +197,13 @@ class _LoginScreenState extends State<LoginScreen>
Widget _buildLoginButton() {
return ElevatedButton(
onPressed: () async {
bool success = await loginController.loginFunction();
if (success) {
Get.off( Navigation());
if (_formKey.currentState?.validate() ?? false) {
bool success = await loginController.loginFunction();
if (success) {
Get.off(Navigation());
} else {
_showErrorSnackbar("Login failed. Please try again.");
}
}
},
style: ElevatedButton.styleFrom(
Expand Down Expand Up @@ -233,4 +251,15 @@ class _LoginScreenState extends State<LoginScreen>
],
);
}

void _showErrorSnackbar(String message) {
Get.snackbar(
"Error",
message,
snackPosition: SnackPosition.BOTTOM,
backgroundColor: Colors.redAccent,
colorText: Colors.white,
icon: const Icon(Icons.error, color: Colors.white),
);
}
}
Loading

0 comments on commit e5c330a

Please sign in to comment.