Adding Bottom Navigation bar

android/app/build.gradle

@@ -36,7 +36,7 @@ android {
     defaultConfig {
         // TODO: Specify your own unique Application ID (https://developer.android.com/studio/build/application-id.html).
         applicationId "org.zxconnect.mobile.le_kiosque_by_gcs"
-        minSdkVersion 16
+        minSdkVersion 21
         targetSdkVersion 30
         versionCode flutterVersionCode.toInteger()
         versionName flutterVersionName

ios/Runner/Info.plist

@@ -1,56 +1,57 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
 <plist version="1.0">
-    <dict>
-        <key>CFBundleDevelopmentRegion</key>
-        <string>$(DEVELOPMENT_LANGUAGE)</string>
-        <key>CFBundleExecutable</key>
-        <string>$(EXECUTABLE_NAME)</string>
-        <key>CFBundleIdentifier</key>
-        <string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
-        <key>CFBundleInfoDictionaryVersion</key>
-        <string>6.0</string>
-        <key>CFBundleName</key>
-        <string>le_kiosque_by_gcs</string>
-        <key>CFBundlePackageType</key>
-        <string>APPL</string>
-        <key>CFBundleShortVersionString</key>
-        <string>$(FLUTTER_BUILD_NAME)</string>
-        <key>CFBundleSignature</key>
-        <string>????</string>
-        <key>CFBundleVersion</key>
-        <string>$(FLUTTER_BUILD_NUMBER)</string>
-        <key>LSRequiresIPhoneOS</key>
-        <true/>
-        <key>UILaunchStoryboardName</key>
-        <string>LaunchScreen</string>
-        <key>UIMainStoryboardFile</key>
-        <string>Main</string>
-        <key>UISupportedInterfaceOrientations</key>
-        <array>
-            <string>UIInterfaceOrientationPortrait</string>
-        </array>
-        <key>UISupportedInterfaceOrientations~ipad</key>
-        <array>
-            <string>UIInterfaceOrientationPortrait</string>
-            <string>UIInterfaceOrientationPortraitUpsideDown</string>
-            <string>UIInterfaceOrientationLandscapeLeft</string>
-            <string>UIInterfaceOrientationLandscapeRight</string>
-        </array>
-        <key>UIViewControllerBasedStatusBarAppearance</key>
-        <false/>
-        <key>CFBundleURLTypes</key>
-        <array>
-            <dict>
-                <key>CFBundleURLSchemes</key>
-                <array>
-                    <string>fb894030758020771</string>
-                </array>
-            </dict>
-        </array>
-        <key>FacebookAppID</key>
-        <string>894030758020771</string>
-        <key>FacebookDisplayName</key>
-        <string>Le Kiosque By GC&amp;S</string>
-    </dict>
+<dict>
+	<key>CFBundleDevelopmentRegion</key>
+	<string>$(DEVELOPMENT_LANGUAGE)</string>
+	<key>CFBundleExecutable</key>
+	<string>$(EXECUTABLE_NAME)</string>
+	<key>CFBundleIdentifier</key>
+	<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
+	<key>CFBundleInfoDictionaryVersion</key>
+	<string>6.0</string>
+	<key>CFBundleName</key>
+	<string>le_kiosque_by_gcs</string>
+	<key>CFBundlePackageType</key>
+	<string>APPL</string>
+	<key>CFBundleShortVersionString</key>
+	<string>$(FLUTTER_BUILD_NAME)</string>
+	<key>CFBundleSignature</key>
+	<string>????</string>
+	<key>CFBundleVersion</key>
+	<string>$(FLUTTER_BUILD_NUMBER)</string>
+	<key>LSRequiresIPhoneOS</key>
+	<true/>
+	<key>UILaunchStoryboardName</key>
+	<string>LaunchScreen</string>
+	<key>UIMainStoryboardFile</key>
+	<string>Main</string>
+	<key>UISupportedInterfaceOrientations</key>
+	<array>
+		<string>UIInterfaceOrientationPortrait</string>
+	</array>
+	<key>UISupportedInterfaceOrientations~ipad</key>
+	<array>
+		<string>UIInterfaceOrientationPortrait</string>
+		<string>UIInterfaceOrientationPortraitUpsideDown</string>
+		<string>UIInterfaceOrientationLandscapeLeft</string>
+		<string>UIInterfaceOrientationLandscapeRight</string>
+	</array>
+	<key>UIViewControllerBasedStatusBarAppearance</key>
+	<false/>
+	<key>CFBundleURLTypes</key>
+	<array>
+		<dict>
+			<key>CFBundleURLSchemes</key>
+			<array>
+				<string>fb894030758020771</string>
+				<string>com.googleusercontent.apps.944092516126-hkrk2q9uqomp41t2sttm47hpu7av0t81</string>
+			</array>
+		</dict>
+	</array>
+	<key>FacebookAppID</key>
+	<string>894030758020771</string>
+	<key>FacebookDisplayName</key>
+	<string>Le Kiosque By GC&amp;S</string>
+</dict>
 </plist>

lib/main.dart

@@ -1,6 +1,11 @@
+import 'package:firebase_core/firebase_core.dart';
 import 'package:flutter/material.dart';
+import 'package:le_kiosque_by_gcs/services/auth/main_auth.dart';
+import 'package:le_kiosque_by_gcs/ui/landing.dart';
 
-void main() {
+void main() async {
+  WidgetsFlutterBinding.ensureInitialized();
+  await Firebase.initializeApp();
   runApp(MyApp());
 }
 
@@ -8,12 +13,14 @@ class MyApp extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return MaterialApp(
-      showSemanticsDebugger: false,
+      debugShowCheckedModeBanner: false,
       title: 'Le Kiosque By GC&S',
       theme: ThemeData(
-        primarySwatch: Colors.white,
+        primarySwatch: Colors.blue,
+      ),
+      home: LandingPageView(
+        auth: MainAuth(),
       ),
-      home: Container(),
     );
   }
 }

lib/services/auth/auth.dart

@@ -0,0 +1,13 @@
+
+import 'package:firebase_auth/firebase_auth.dart';
+
+abstract class Auth {
+  Future<User> signInWithGoogle();
+
+  Future<User> signInWithFacebook();
+
+  Future<void> signOut();
+
+  Stream<User> authStateChanges();
+}
+

lib/services/auth/main_auth.dart

@@ -0,0 +1,69 @@
+
+import 'package:le_kiosque_by_gcs/services/auth/auth.dart';
+import 'package:firebase_auth/firebase_auth.dart';
+import 'package:flutter_login_facebook/flutter_login_facebook.dart';
+import 'package:google_sign_in/google_sign_in.dart';
+
+class MainAuth implements Auth {
+
+  FirebaseAuth _auth = FirebaseAuth.instance;
+
+  @override
+  Future<User> signInWithGoogle() async {
+    final googleSignIn = GoogleSignIn();
+    final googleUser = await googleSignIn.signIn();
+
+    if (googleUser != null) {
+      final userAuth = await googleUser.authentication;
+      if (userAuth.accessToken != null) {
+        final authCredential = GoogleAuthProvider.credential(
+            accessToken: userAuth.accessToken, idToken: userAuth.idToken);
+        final authResult = await _auth.signInWithCredential(authCredential);
+        return authResult.user;
+      } else {
+        throw FirebaseAuthException(message: "Auth Abord");
+      }
+    } else {
+      throw FirebaseAuthException(message: "Auth Abord");
+    }
+  }
+
+  @override
+  Future<void> signOut() async {
+    final googleSignIn = GoogleSignIn();
+    final facebookAuth = FacebookLogin();
+
+    await facebookAuth.logOut();
+    await googleSignIn.signOut();
+    await _auth.signOut();
+  }
+
+  @override
+  Stream<User> authStateChanges() => _auth.authStateChanges();
+
+  @override
+  Future<User> signInWithFacebook() async {
+    final facebookAuth = FacebookLogin();
+    final result = await facebookAuth.logIn(permissions: [
+      FacebookPermission.publicProfile,
+      FacebookPermission.email
+    ]);
+
+    switch (result.status) {
+      case FacebookLoginStatus.Success:
+        final accessToken = result.accessToken.token;
+        final credential = FacebookAuthProvider.credential(accessToken);
+        final authResult = await _auth.signInWithCredential(credential);
+        return authResult.user;
+        break;
+      case FacebookLoginStatus.Cancel:
+        throw FirebaseAuthException(message: "Auth Abord");
+        break;
+      case FacebookLoginStatus.Error:
+        throw FirebaseAuthException(message: result.error.developerMessage);
+        break;
+      default:
+        throw UnimplementedError();
+    }
+  }
+}

lib/ui/auth.dart

@@ -1,13 +1,107 @@
 import 'package:flutter/material.dart';
+import 'package:le_kiosque_by_gcs/services/auth/auth.dart';
 
-class AuthView extends StatefulWidget {
-  @override
-  _AuthViewState createState() => _AuthViewState();
-}
+import 'custom/custom_elevated_button.dart';
+
+class AuthView extends StatelessWidget {
+  const AuthView({Key key, this.auth}) : super(key: key);
+  final Auth auth;
+
+  Future<void> _signWithGoogle() async {
+    try {
+      await auth.signInWithGoogle();
+    } catch (e) {
+      print("Error $e");
+    }
+  }
+
+  Future<void> _signInWithFacebook() async {
+    try {
+      await auth.signInWithFacebook();
+    } catch (e) {
+      print("Error $e");
+    }
+  }
 
-class _AuthViewState extends State<AuthView> {
   @override
   Widget build(BuildContext context) {
-    return Container();
+    return Scaffold(
+      resizeToAvoidBottomInset: false,
+      body: Column(
+        children: [
+          Container(
+            height: 550,
+            decoration: BoxDecoration(
+              image: DecorationImage(
+                image: AssetImage("assets/images/login_back.png"),
+                fit: BoxFit.cover,
+              ),
+            ),
+          ),
+          Expanded(
+            child: Transform.translate(
+              offset: Offset(0, -50),
+              child: Container(
+                width: double.infinity,
+                decoration: BoxDecoration(
+                  color: Colors.grey[200],
+                  borderRadius: BorderRadius.only(
+                    topLeft: Radius.circular(30),
+                    topRight: Radius.circular(30),
+                  ),
+                ),
+                child: Padding(
+                  padding: const EdgeInsets.only(
+                    top: 32,
+                    left: 24,
+                    right: 24,
+                    bottom: 24,
+                  ),
+                  child: Column(
+                    crossAxisAlignment: CrossAxisAlignment.stretch,
+                    children: [
+                      Text(
+                        "S'identifier",
+                        style: TextStyle(
+                            fontSize: 26,
+                            fontWeight: FontWeight.bold,
+                            color: Colors.black,
+                            inherit: false),
+                      ),
+                      SizedBox(height: 32),
+                      CustomElevatedButton(
+                        imageAsset: "assets/images/google_logo.png",
+                        color: Colors.white,
+                        textColor: Colors.black,
+                        onPressed: _signWithGoogle,
+                        text: "Se connecter avec Google",
+                      ),
+                      SizedBox(height: 24),
+                      CustomElevatedButton(
+                        imageAsset: "assets/images/facebook_logo.png",
+                        color: Color(0xFF334D92),
+                        textColor: Colors.white,
+                        onPressed: _signInWithFacebook,
+                        text: "Se connecter avec Facebook",
+                      ),
+                      SizedBox(
+                        height: 48,
+                      ),
+                      Text(
+                        "En vous connectant, vous acceptez nos conditions et termes d'utilisation.",
+                        style: TextStyle(
+                          inherit: false,
+                          color: Colors.black87,
+                        ),
+                      )
+                    ],
+                  ),
+                ),
+              ),
+            ),
+          )
+        ],
+      ),
+    );
   }
 }

lib/ui/custom/custom_elevated_button.dart

@@ -0,0 +1,58 @@
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+
+class CustomElevatedButton extends StatelessWidget {
+  CustomElevatedButton({
+    this.onPressed,
+    this.color,
+    this.height: 50,
+    this.textColor,
+    this.text,
+    this.imageAsset: "",
+  });
+
+  final VoidCallback onPressed;
+  final Color color;
+  final double height;
+  final Color textColor;
+  final String text;
+  final String imageAsset;
+
+  @override
+  Widget build(BuildContext context) {
+    return SizedBox(
+      height: height,
+      child: ElevatedButton(
+        style: ButtonStyle(
+          backgroundColor: MaterialStateProperty.all(color),
+          shape: MaterialStateProperty.all(
+            RoundedRectangleBorder(
+              borderRadius: BorderRadius.all(
+                Radius.circular(16),
+              ),
+            ),
+          ),
+        ),
+        onPressed: onPressed,
+        child: Row(
+          mainAxisAlignment: MainAxisAlignment.spaceBetween,
+          children: [
+            SizedBox(
+              height: 20,
+              width: 20,
+              child: Image.asset(imageAsset),
+            ),
+            Text(
+              text,
+              style: TextStyle(fontSize: 15, color: textColor),
+            ),
+            Opacity(
+              child: Image.asset(imageAsset),
+              opacity: 0,
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}

lib/ui/landing.dart

@@ -0,0 +1,34 @@
+import 'package:firebase_auth/firebase_auth.dart';
+import 'package:flutter/material.dart';
+import 'package:le_kiosque_by_gcs/services/auth/auth.dart';
+import 'package:le_kiosque_by_gcs/ui/auth.dart';
+import 'package:le_kiosque_by_gcs/ui/main.dart';
+
+class LandingPageView extends StatelessWidget {
+  final Auth auth;
+
+  const LandingPageView({Key key, this.auth}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return StreamBuilder<User>(
+        stream: auth.authStateChanges(),
+        builder: (context, snapshot) {
+          if (snapshot.connectionState == ConnectionState.active) {
+            if (snapshot.data == null) {
+              return AuthView(auth: auth);
+            } else {
+              return MainView();
+            }
+          }
+          else {
+            return Scaffold(
+              body: Center(
+                child: CircularProgressIndicator(),
+              ),
+            );
+          }
+        }
+    );
+  }
+}

lib/ui/main.dart

@@ -0,0 +1,104 @@
+import 'package:firebase_auth/firebase_auth.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter/widgets.dart';
+
+class MainView extends StatefulWidget {
+  @override
+  _MainViewState createState() => _MainViewState();
+}
+
+class _MainViewState extends State<MainView> {
+  int _selectedIndex = 0;
+
+  void _onItemTapped(int index) {
+    setState(() {
+      _selectedIndex = index;
+    });
+  }
+
+  void _showSearchView(BuildContext context) {
+    Navigator.of(context).push(
+      MaterialPageRoute(
+        builder: (context) => Scaffold(),
+      ),
+    );
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(
+        title: Text(
+          "Le Kiosque By GC&S",
+          style: TextStyle(
+            color: Colors.black,
+          ),
+        ),
+        leading: Builder(
+          builder: (BuildContext context) {
+            return Padding(
+              padding: const EdgeInsets.only(left: 16),
+              child: Image.asset("assets/images/kiosque_logo.png"),
+            );
+          },
+        ),
+        elevation: 4,
+        actions: [
+          Padding(
+            padding: const EdgeInsets.all(8.0),
+            child: Container(
+              decoration: BoxDecoration(
+                shape: BoxShape.circle,
+                color: Color(0xFFF1F1F1),
+              ),
+              child: TextButton(
+                onPressed: () => _showSearchView(context),
+                child: Icon(
+                  Icons.search,
+                  color: Colors.grey,
+                ),
+              ),
+            ),
+          )
+        ],
+        backgroundColor: Colors.white,
+      ),
+      bottomNavigationBar: BottomNavigationBar(
+        currentIndex: _selectedIndex,
+        type: BottomNavigationBarType.fixed,
+        onTap: _onItemTapped,
+        selectedItemColor: Colors.grey,
+        items: [
+          BottomNavigationBarItem(
+            icon: Icon(
+              Icons.home_rounded,
+              color: Colors.grey,
+            ),
+            label: 'Accueil',
+          ),
+          BottomNavigationBarItem(
+            icon: Icon(
+              Icons.subscriptions_rounded,
+              color: Colors.grey,
+            ),
+            label: 'A la une',
+          ),
+          BottomNavigationBarItem(
+            icon: Icon(
+              Icons.amp_stories_rounded,
+              color: Colors.grey,
+            ),
+            label: 'Abonnement',
+          ),
+          BottomNavigationBarItem(
+            icon: Icon(
+              Icons.people_rounded,
+              color: Colors.grey,
+            ),
+            label: 'Mon profil',
+          ),
+        ],
+      ),
+    );
+  }
+}

pubspec.lock

@@ -111,6 +111,13 @@ packages:
     description: flutter
     source: sdk
     version: "0.0.0"
+  flutter_auth_buttons:
+    dependency: "direct main"
+    description:
+      name: flutter_auth_buttons
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "0.10.0"
   flutter_login_facebook:
     dependency: "direct main"
     description:

pubspec.yaml

@@ -32,6 +32,7 @@ dependencies:
   firebase_auth: 0.18.2
   google_sign_in: ^4.5.6
   flutter_login_facebook: 0.4.0+1
+  flutter_auth_buttons: ^0.10.0
 
 dev_dependencies:
   flutter_test:
@@ -48,6 +49,9 @@ flutter:
   # the material Icons class.
   uses-material-design: true
 
+  assets:
+    - assets/images/
+
   # To add assets to your application, add an assets section, like this:
   # assets:
   #   - images/a_dot_burr.jpeg