Merge pull request #120 from SCCapstone/profile-nghia

Profile nghia

app/lib/models/userModel.dart

@@ -0,0 +1,24 @@
+class User {
+  String name;
+  String about;
+  String imagePath;
+  //final List<StepState> progress;
+
+  //save user data
+  //get user data
+
+  User({required this.name, required this.about, required this.imagePath});
+
+  void saveData() {}
+  void loadData() {}
+}
+
+class UserPreferences {
+  static User myUser = User(
+      name: "Lorem Ipsum",
+      about: "BIO: This is where the profile would be. "
+          "This is would hold the users information as well as the settings area of the app. "
+          "This would keep statistics such as your streaks and could even show proficiencies",
+      imagePath:
+          "https://static.vecteezy.com/system/resources/thumbnails/003/337/584/small/default-avatar-photo-placeholder-profile-icon-vector.jpg");
+}

app/lib/screens/EditProfile.dart

@@ -0,0 +1,68 @@
+import 'package:flutter/material.dart';
+import 'package:pohnpeian_language_app/models/userModel.dart';
+import 'package:pohnpeian_language_app/theme/style.dart' as style;
+
+class EditProfilePage extends StatefulWidget {
+  @override
+  _EditProfilePageState createState() => _EditProfilePageState();
+}
+
+class _EditProfilePageState extends State<EditProfilePage> {
+  TextEditingController nameController = TextEditingController();
+  TextEditingController aboutController = TextEditingController();
+  User user = UserPreferences.myUser;
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(
+        title: const Text("Profile"),
+        backgroundColor: const Color.fromARGB(255, 117, 178, 221),
+      ),
+      body: ListView(
+        children: [
+          Container(
+              margin: const EdgeInsets.all(30),
+              child: TextFormField(
+                  controller: nameController,
+                  decoration: const InputDecoration(
+                    border: OutlineInputBorder(),
+                    labelText: 'User Name',
+                    labelStyle: TextStyle(color: Colors.black),
+                  ))),
+          Container(
+              margin: const EdgeInsets.fromLTRB(30, 0, 30, 30),
+              child: TextFormField(
+                  keyboardType: TextInputType.multiline,
+                  maxLines: 7,
+                  controller: aboutController,
+                  decoration: const InputDecoration(
+                    alignLabelWithHint: true,
+                    border: OutlineInputBorder(),
+                    labelText: 'About Me',
+                    labelStyle: TextStyle(
+                      color: Colors.black,
+                    ),
+                  ))),
+          Container(
+              margin: const EdgeInsets.fromLTRB(30, 0, 30, 0),
+              child: ElevatedButton(
+                style: ElevatedButton.styleFrom(
+                  backgroundColor: style.secondary,
+                ),
+                child: const Text('Submit Changes'),
+                onPressed: () {
+                  // state conditions for changing name
+                  if (nameController.text != "") {
+                    UserPreferences.myUser.name = nameController.text;
+                  }
+                  UserPreferences.myUser.about = aboutController.text;
+                  UserPreferences.myUser.saveData();
+                  Navigator.pop(context);
+                },
+              ))
+        ],
+      ),
+    );
+  }
+}

app/lib/screens/ProfileScreen.dart

@@ -1,5 +1,8 @@
 import 'package:cloud_firestore/cloud_firestore.dart';
 import 'package:flutter/material.dart';
+import 'package:pohnpeian_language_app/models/userModel.dart' as usermodel;
+import 'package:pohnpeian_language_app/theme/style.dart' as style;
+import 'package:pohnpeian_language_app/screens/EditProfile.dart';
 
 class ProfileScreen extends StatefulWidget {
   const ProfileScreen({super.key});
@@ -11,39 +14,71 @@ class ProfileScreen extends StatefulWidget {
 class _ProfileScreenState extends State<ProfileScreen> {
   @override
   Widget build(BuildContext context) {
+    usermodel.UserPreferences.myUser.loadData();
     return Scaffold(
         // ignore: prefer_const_constructors
-        appBar: AppBar(title: Text("Profile"),
-            backgroundColor: Color.fromARGB(255, 117, 178, 221),
-            
-            ),
-        body: Column(
-          mainAxisAlignment: MainAxisAlignment.center,
+        appBar: AppBar(
+          automaticallyImplyLeading: false,
+          title: Text("Profile"),
+          backgroundColor: Color.fromARGB(255, 117, 178, 221),
+        ),
+        body: ListView(
           children: [
             Container(
-                height: 60,
-                width: 60,
-                child: CircleAvatar(
-                    backgroundImage: NetworkImage(
-                        "https://static.vecteezy.com/system/resources/thumbnails/003/337/584/small/default-avatar-photo-placeholder-profile-icon-vector.jpg"))),
-            Text("USERNAME"),
+                margin: EdgeInsets.fromLTRB(0, 40, 0, 30),
+                child: Center(
+                    child: Stack(children: [
+                  SizedBox(
+                      height: 120,
+                      width: 120,
+                      child: CircleAvatar(
+                          backgroundImage: NetworkImage(
+                              usermodel.UserPreferences.myUser.imagePath))),
+                  Positioned(
+                      bottom: 0,
+                      right: 4,
+                      child: ClipOval(
+                        child: Material(
+                          color: style.secondary, // Button color
+                          child: InkWell(
+                              splashColor: style.primary,
+                              onTap: () => Navigator.push(
+                                      context,
+                                      MaterialPageRoute(
+                                        builder: (context) => EditProfilePage(),
+                                      ))
+                                  .then((_) => setState(
+                                      () {})), // .then allows for the page to refresh
+                              child: const SizedBox(
+                                  height: 40,
+                                  width: 40,
+                                  child: Icon(
+                                    Icons.edit,
+                                    color: Colors.white,
+                                  ))),
+                        ),
+                      ))
+                ]))),
+            Center(
+                child: Text(
+              usermodel.UserPreferences.myUser.name,
+              style: TextStyle(fontSize: 20),
+            )),
             Container(
                 margin: EdgeInsets.all(30),
                 // ignore: prefer_const_constructors
-                child: Text(
-                    "BIO: This is where the profile would be. " 
-                    "This is would hold the users information as well as the settings area of the app. "
-                    "This would keep statistics such as your streaks and could even show proficiencies.") ),
-            TextButton(onPressed: () {
-              final docUser = FirebaseFirestore.instance
-			          .collection('Users')
-			          .doc('userBase');
-
-			       docUser.set({
-				       'name': '',
-			});
+                child: Text(usermodel.UserPreferences.myUser.about)),
+            TextButton(
+                onPressed: () {
+                  final docUser = FirebaseFirestore.instance
+                      .collection('Users')
+                      .doc('userBase');
 
-            }, child: Text(" Delete Account ")),
+                  docUser.set({
+                    'name': '',
+                  });
+                },
+                child: Text(" Delete Account ")),
           ],
         ));
   }