dania/finger_print_app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

more chnages has been done for the usr setting screen

Browse Source
This commit is contained in:
Daniah Ayad Al-sultani
2025-12-09 17:26:37 +03:00
parent 5931732b41
commit 993f396537
2 changed files with 217 additions and 154 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
lib/screens/main_screen.dart
View File

@@ -1,3 +1,4 @@
import 'package:coda_project/screens/user_settings_screen.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart'; import 'package:flutter_svg/flutter_svg.dart';
import '../widgets/app_background.dart'; import '../widgets/app_background.dart';
@@ -48,11 +49,20 @@ class _MainPageState extends State<MainPage> {
setState(() { setState(() {
_settingsIndex = index; _settingsIndex = index;
}); });
// 🟢 If user clicked the first icon (user.svg), open settings screen
if (index == 0) {
Navigator.push(
context,
MaterialPageRoute(builder: (_) => const UserSettingsScreen()),
);
}
}, },
showBackButton: false, showBackButton: false,
iconPaths: _settingsIconPaths, iconPaths: _settingsIconPaths,
), ),
// Main content area // Main content area
Expanded( Expanded(
child: IndexedStack(index: _currentIndex, children: _screens), child: IndexedStack(index: _currentIndex, children: _screens),

215
lib/screens/user_settings_screen.dart
View File

@@ -1,5 +1,7 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart'; import 'package:flutter_svg/flutter_svg.dart';
import '../widgets/app_background.dart';
import '../widgets/settings_bar.dart';
class UserSettingsScreen extends StatelessWidget { class UserSettingsScreen extends StatelessWidget {
const UserSettingsScreen({super.key}); const UserSettingsScreen({super.key});
@@ -8,51 +10,95 @@ class UserSettingsScreen extends StatelessWidget {
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Directionality( return Directionality(
textDirection: TextDirection.rtl, textDirection: TextDirection.rtl,
child: Stack( child: Scaffold(
body: AppBackground(
child: SafeArea(
child: Column(
children: [ children: [
// ⭐ You already have your app background + settings bar outside this widget /// -------------------- SETTINGS BAR --------------------
Directionality(
textDirection: TextDirection.ltr, // KEEP LOGO LEFT, BACK RIGHT
child: SettingsBar(
selectedIndex: 0,
onTap: (_) {},
showBackButton: true,
onBackTap: () => Navigator.pop(context),
iconPaths: const [],
),
),
// -------------------- WHITE CARD -------------------- const SizedBox(height: 10),
Positioned(
top: 140, /// -------------------- PAGE TITLE --------------------
left: 20, const Text(
right: 20, "الإعدادات",
child: Container( style: TextStyle(
padding: const EdgeInsets.only(top: 70, bottom: 25), fontSize: 26,
decoration: BoxDecoration(
color: Colors.white, color: Colors.white,
borderRadius: BorderRadius.circular(16), fontWeight: FontWeight.bold,
),
),
const SizedBox(height: 20),
/// -------------------- FORM CONTAINER --------------------
Expanded(
child: Center(
child: Stack(
clipBehavior: Clip.none,
children: [
/// Outer border container
Container(
width: MediaQuery.of(context).size.width * 0.85,
decoration: BoxDecoration(
color: const Color(0xFFEEFFFA), // LIGHT GREEN FIXED
borderRadius: BorderRadius.circular(28),
border: Border.all(
color: const Color(0xDD00C28E),
width: 1,
),
boxShadow: const [ boxShadow: const [
BoxShadow( BoxShadow(
color: Color(0x33000000), color: Colors.black26,
blurRadius: 12, blurRadius: 8,
offset: Offset(0, 5), offset: Offset(0, 4),
), ),
], ],
), ),
padding: const EdgeInsets.symmetric(
horizontal: 18,
vertical: 40,
),
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [ children: [
// -------------------- EMPLOYEE NAME -------------------- const SizedBox(height: 55),
Text(
/// -------------------- USER NAME --------------------
const Center(
child: Text(
"اسم الموظف", "اسم الموظف",
style: TextStyle( style: TextStyle(
fontSize: 20, fontSize: 20,
fontWeight: FontWeight.w700, fontWeight: FontWeight.bold,
color: Colors.black, color: Colors.black87,
fontFamily: "AbdEriady", ),
), ),
), ),
const SizedBox(height: 6), const SizedBox(height: 4),
Row( GestureDetector(
mainAxisAlignment: MainAxisAlignment.center, onTap: () {},
child: Center(
child: Row(
mainAxisSize: MainAxisSize.min,
children: [ children: [
Text( const Text(
"تغيير كلمة المرور", "تغيير كلمة المرور",
style: TextStyle( style: TextStyle(
fontSize: 12, fontSize: 13,
color: Colors.grey[700], color: Colors.black54,
), ),
), ),
const SizedBox(width: 4), const SizedBox(width: 4),
@@ -60,87 +106,87 @@ class UserSettingsScreen extends StatelessWidget {
"assets/images/edit.svg", "assets/images/edit.svg",
width: 16, width: 16,
height: 16, height: 16,
) ),
], ],
), ),
),
),
const SizedBox(height: 25), const SizedBox(height: 18),
// -------------------- NOTIFICATION TOGGLE -------------------- /// -------------------- NOTIFICATION SWITCH --------------------
Padding( Row(
padding: const EdgeInsets.symmetric(horizontal: 18), mainAxisAlignment: MainAxisAlignment.spaceBetween,
child: Row(
children: [ children: [
Switch( Switch(
value: true, value: true,
activeColor: const Color(0xFF177046), activeColor: const Color(0xFF177046),
inactiveTrackColor: Colors.grey[400], inactiveThumbColor: Colors.black,
onChanged: (value) {}, onChanged: (v) {},
), ),
const Spacer(),
Text( /// RTL – text on right, icon on left
Row(
children: [
const Text(
"الإشعارات", "الإشعارات",
style: TextStyle( style: TextStyle(
fontSize: 16, fontSize: 16,
fontWeight: FontWeight.w500, color: Colors.black87,
), ),
), ),
const SizedBox(width: 8), const SizedBox(width: 8),
SvgPicture.asset( SvgPicture.asset(
"assets/images/bell.svg", "assets/images/notification.svg",
width: 20, width: 22,
height: 20,
), ),
], ],
), ),
],
), ),
_divider(), _buildDivider(),
// -------------------- ABOUT COMPANY -------------------- _buildSettingsRow(
_settingsTile(
label: "عن الشركة", label: "عن الشركة",
iconPath: "assets/images/info.svg", icon: "assets/images/info.svg",
onTap: () {},
), ),
_divider(), _buildDivider(),
// -------------------- LOGOUT -------------------- _buildSettingsRow(
_settingsTile(
label: "تسجيل خروج", label: "تسجيل خروج",
iconPath: "assets/images/logout.svg", icon: "assets/images/logout.svg",
onTap: () {},
), ),
_divider(), _buildDivider(),
// -------------------- EMPLOYEE LEAVES -------------------- _buildSettingsRow(
_settingsTile(
label: "إجازات الموظفين", label: "إجازات الموظفين",
iconPath: "assets/images/leaves.svg", icon: "assets/images/holiday.svg",
onTap: () {},
), ),
], ],
), ),
), ),
),
// -------------------- PROFILE IMAGE -------------------- /// -------------------- USER AVATAR --------------------
Positioned( Positioned(
top: 90, top: -45,
left: 0, left: 0,
right: 0, right: 0,
child: Center( child: Center(
child: Container( child: Container(
width: 120, width: 105,
height: 120, height: 105,
padding: const EdgeInsets.all(6),
decoration: BoxDecoration( decoration: BoxDecoration(
shape: BoxShape.circle,
color: const Color(0xFFE1E1E1),
border: Border.all(
color: const Color(0xFF177046), color: const Color(0xFF177046),
shape: BoxShape.circle, width: 6,
),
child: Container(
decoration: const BoxDecoration(
shape: BoxShape.circle,
color: Color(0xFFD9D9D9), // placeholder profile
), ),
), ),
), ),
@@ -148,41 +194,48 @@ class UserSettingsScreen extends StatelessWidget {
), ),
], ],
), ),
),
),
],
),
),
),
),
); );
} }
// Divider line styled like design // Divider line
Widget _divider() { Widget _buildDivider() {
return Container( return Container(
margin: const EdgeInsets.symmetric(vertical: 12),
height: 1,
width: double.infinity, width: double.infinity,
color: const Color(0xFFD1D1D1), margin: const EdgeInsets.symmetric(vertical: 12),
height: 1.2,
color: const Color(0xFFB5DECC),
); );
} }
// Settings row tile // RTL Settings row (text right, icon left)
Widget _settingsTile({ Widget _buildSettingsRow({
required String label, required String label,
required String iconPath, required String icon,
required VoidCallback onTap,
}) { }) {
return Padding( return GestureDetector(
padding: const EdgeInsets.symmetric(horizontal: 18), onTap: onTap,
child: Row( child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [ children: [
/// ICON on LEFT — RTL
SvgPicture.asset(icon, width: 22),
/// TEXT on RIGHT — RTL
Text( Text(
label, label,
style: const TextStyle( style: const TextStyle(
fontSize: 15, fontSize: 16,
fontWeight: FontWeight.w600, color: Colors.black87,
), ),
), ),
const Spacer(),
SvgPicture.asset(
iconPath,
width: 20,
height: 20,
),
], ],
), ),
); );