diff --git a/lib/Pages/ProfilePage.dart b/lib/Pages/ProfilePage.dart index 368a95d..3f18715 100644 --- a/lib/Pages/ProfilePage.dart +++ b/lib/Pages/ProfilePage.dart @@ -1,8 +1,10 @@ import 'package:flutter/material.dart'; import 'package:queuing_system/Presentation/custom_icons_icons.dart'; +import 'package:queuing_system/SubPages/EditProfile.dart'; import 'package:queuing_system/Variables/color.dart'; import 'package:queuing_system/Variables/size.dart'; import 'package:queuing_system/Widgets/ProfileDetails.dart'; +import 'package:queuing_system/Widgets/TextField.dart'; class ProfilePage extends StatefulWidget { @override @@ -10,6 +12,8 @@ class ProfilePage extends StatefulWidget { } class _ProfilePageState extends State { + bool editpro = true; + @override Widget build(BuildContext context) { return Scaffold( @@ -25,7 +29,7 @@ class _ProfilePageState extends State { Stack( alignment: Alignment.center, children: [ - Container(height: PhoneSize(context).height/1.3,), + Container(height: PhoneSize(context).height / 1.0), Positioned( top: 80, left: 0, @@ -46,61 +50,212 @@ class _ProfilePageState extends State { ), padding: EdgeInsets.all(10), child: Column( - crossAxisAlignment: CrossAxisAlignment.start, children: [ - SizedBox(height: 70), - ProfileDetails(icon: CustomIcons.profile, text: 'John Doe Mayers',color: Colors.grey,), - - SizedBox(height: 10), - ProfileDetails( icon: CustomIcons.contact,text: '22 Years Old',color: Colors.grey,), - - SizedBox(height: 10), - ProfileDetails(icon: Icons.contact_phone,text: '639-323-265-144', color: Colors.grey,), - - SizedBox(height: 10), - ProfileDetails( - icon: Icons.location_on, - text: '#61 Marinig Cabuya Laguna asd as dsa dasd qeqw asqwdasdsadas dqwe qwe asdqw eas dqwe ad wae dasd as asd asd as da sdas dsa dasdasd asd asdas dasd asd asd asd asdqwe wqe qwe wq', - color: Colors.grey, + Visibility( + visible: !editpro, + child: Column( + children: [ + SizedBox(height: 60), + EditProfile( + icon: Icon(Icons.mail), + text: 'Email', + initialValue: 'bautistaivan_26@yahoo.com', + ), + EditProfile( + icon: Icon(Icons.lock), + text: 'Password', + initialValue: 'asdsadas', + ), + EditProfile( + icon: Icon(Icons.lock), + text: 'Confirm Password', + initialValue: 'asdsadas', + ), + SizedBox(height: 20,), + Row( + children: [ + Flexible( + child: EditProfile( + text: 'First Name', + initialValue: 'John Doe', + icon: Icon(CustomIcons.profile), + ), + ), + Flexible( + child: EditProfile( + text: 'Last Name', + initialValue: 'Mayers', + icon: null, + ), + ), + ], + ), + SizedBox(height: 10), + Row( + children: [ + Flexible( + flex: 2, + child: EditProfile( + text: 'Contact Number', + initialValue: '639-323-265-144', + icon: Icon(Icons.contact_phone), + ), + ), + Flexible( + child: EditProfile( + text: 'Age', + initialValue: '22', + icon: Icon(Icons.cake), + ), + ), + ], + ), + SizedBox(height: 10), + Row( + children: [ + Flexible( + + child: EditProfile( + text: 'State', + initialValue: 'Cabuyao', + icon: Icon(Icons.location_on), + ), + ), + Flexible( + child: EditProfile( + text: 'Province', + initialValue: 'Laguna', + icon: null, + ), + ), + ], + ), + SizedBox(height: 10), + EditProfile( + text: 'Complete Address', + initialValue: + '# 168 Purok 1, Barangay kabuto', + icon: Icon(Icons.home), + ), + ], + ), + ), + Visibility( + visible: editpro, + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + SizedBox(height: 70), + SizedBox(height: 50), + ProfileDetails( + icon: Icons.contact_phone, + text: '639-323-265-144', + color: Colors.grey), + SizedBox(height: 10), + ProfileDetails( + icon: Icons.cake, + text: '22 Years Old', + color: Colors.grey), + SizedBox(height: 10), + ProfileDetails( + icon: Icons.location_on, + text: 'Calamba, City Laguna', + color: Colors.grey, + ), + SizedBox(height: 10), + ProfileDetails( + icon: Icons.home, + text: '# 168 Purok 1, Barangay kabuto', + color: Colors.grey, + ), + ], + ), ), ], ), ), ), ), + Positioned( + top: 150, + child: Visibility( + visible: editpro, + child: Column( + children: [ + Text( + 'Jonh Doe Mayers', + style: TextStyle( + fontWeight: FontWeight.bold, fontSize: 25), + ), + Text('bautistaivan_26@yahoo.com', + style: TextStyle(color: Colors.black54)), + ], + ), + ), + ), Positioned( right: 20, top: 100, - child: Icon( - CustomIcons.edit_profile, - color: secondaryColor, + child: GestureDetector( + onTap: () { + setState(() { + if (editpro == false) { + editpro = true; + } else { + editpro = false; + } + }); + }, + child: Icon( + editpro ? CustomIcons.edit_profile : Icons.save, + color: secondaryColor, + ), ), ), Positioned( top: 0, - child: Container( - margin: EdgeInsets.only(left: 5), - width: 150.0, - height: 150.0, - decoration: new BoxDecoration( - border: Border.all( - color: secondaryColor, - width: 5, + child: Stack( + children: [ + Container( + height: 160, + width: 160, ), - // boxShadow: [ - // BoxShadow( - // color: Colors.grey.withOpacity(0.8), - // spreadRadius: 2, - // blurRadius: 5, - // offset: Offset(0, 3), - // ), - // ], - shape: BoxShape.circle, - image: new DecorationImage( - fit: BoxFit.fill, - image: AssetImage('assets/IU.jpg'), + Container( + margin: EdgeInsets.only(left: 5), + width: 150.0, + height: 150.0, + decoration: new BoxDecoration( + border: Border.all( + color: secondaryColor, + width: 5, + ), + shape: BoxShape.circle, + image: new DecorationImage( + fit: BoxFit.fill, + image: AssetImage('assets/IU.jpg'), + ), + ), ), - ), + Visibility( + visible: !editpro, + child: Positioned( + bottom: 0, + right: 0, + child: RawMaterialButton( + onPressed: () {}, + elevation: 2.0, + fillColor: primaryColor, + child: Icon( + Icons.create, + size: 10.0, + color: Colors.white, + ), + padding: EdgeInsets.all(15.0), + shape: CircleBorder(), + ), + ), + ), + ], ), ), ], @@ -112,4 +267,50 @@ class _ProfilePageState extends State { ), ); } -} \ No newline at end of file +} + +class EditProfile extends StatelessWidget { + const EditProfile({ + Key key, + @required this.text, + @required this.initialValue, + @required this.icon, + }) : super(key: key); + + final String text; + final String initialValue; + final Icon icon; + + + @override + Widget build(BuildContext context) { + return Container( + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Padding( + padding: const EdgeInsets.only(left: 11.0), + child: Text('$text'), + ), + Container( + height: 40, + child: MyTextField( + initial: initialValue, + icons: icon, + controller: null, + hintText: "$text", + keyboardType: null, + inputFormatter: [], + ), + // child: TextFormField( + // initialValue: '$initialValue', + // decoration: new InputDecoration( + // prefixIcon: icon, + // labelStyle: new TextStyle(color: const Color(0xFF424242))), + // ), + ), + ], + ), + ); + } +} diff --git a/lib/Widgets/TextField.dart b/lib/Widgets/TextField.dart index 94b1a85..3f88b9c 100644 --- a/lib/Widgets/TextField.dart +++ b/lib/Widgets/TextField.dart @@ -1,33 +1,34 @@ - import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; class MyTextField extends StatefulWidget { - const MyTextField({ - @required this.controller, - @required this.hintText, - @required this.inputFormatter, - @required this.keyboardType, - - }); + const MyTextField( + {@required this.controller, + @required this.hintText, + @required this.inputFormatter, + @required this.keyboardType, + this.icons, + this.initial}); final String hintText; final TextEditingController controller; final List inputFormatter; final TextInputType keyboardType; + final Icon icons; + final String initial; @override _MyTextFieldState createState() => _MyTextFieldState(); } class _MyTextFieldState extends State { - bool isTextObscure; bool isDisposed = false; @override void initState() { - if (widget.hintText == "Password" || widget.hintText == "Confirm Password") { + if (widget.hintText == "Password" || + widget.hintText == "Confirm Password") { isTextObscure = false; } else { isTextObscure = true; @@ -48,50 +49,49 @@ class _MyTextFieldState extends State { Container( height: 40, child: new TextFormField( + initialValue: widget.initial, keyboardType: widget.keyboardType, inputFormatters: widget.inputFormatter, controller: widget.controller, obscureText: !isTextObscure, decoration: new InputDecoration( + prefixIcon: widget.icons, filled: true, fillColor: Color(0xFFEFEFEF), hintText: widget.hintText, - contentPadding: EdgeInsets.fromLTRB(10, 10, 40, 10), - border: OutlineInputBorder( - borderRadius: BorderRadius.circular(5.0), - borderSide: BorderSide(color: Color(0xFFEFEFEF)) - ), + contentPadding: EdgeInsets.fromLTRB(10, 10, 10, 10), + border: OutlineInputBorder( + borderRadius: BorderRadius.circular(5.0), + borderSide: BorderSide(color: Color(0xFFEFEFEF))), enabledBorder: OutlineInputBorder( - borderRadius: BorderRadius.circular(5.0), - borderSide: BorderSide(color: Color(0xFFEFEFEF)) - ), + borderRadius: BorderRadius.circular(5.0), + borderSide: BorderSide(color: Color(0xFFEFEFEF))), ), ), ), - widget.hintText == "Password" || widget.hintText == "Confirm Password" ? Positioned( - right: 0, - top: -5, - child: Container( - child: IconButton( - icon: Icon( - isTextObscure - ? Icons.visibility - : Icons.visibility_off, - size: 20, - ), - onPressed: () { - if(!isDisposed){ - setState(() { - isTextObscure = !isTextObscure; - }); - } - }, - color: Colors.grey, - ), - ), - ) : Container(), + widget.hintText == "Password" || widget.hintText == "Confirm Password" + ? Positioned( + right: 0, + top: -5, + child: Container( + child: IconButton( + icon: Icon( + isTextObscure ? Icons.visibility : Icons.visibility_off, + size: 20, + ), + onPressed: () { + if (!isDisposed) { + setState(() { + isTextObscure = !isTextObscure; + }); + } + }, + color: Colors.grey, + ), + ), + ) + : Container(), ], ); } } -