Adding Search View

lib/model/magazine.dart

@@ -16,7 +16,7 @@ class Magazine {
   Magazine({
     this.validated,
     this.uid,
-    this.title,
+    @required this.title,
     this.urlCover,
     this.publishedAt,
     this.createdAt,
@@ -27,3 +27,18 @@ class Magazine {
     this.uidCategory,
   });
 }
+
+// TODO: Removing it
+final summary =
+    "Voyez ce jeu exquis wallon, de graphie en kit mais bref. Portez ce vieux whisky au juge blond qui fume sur son île intérieure, à côté de l\"alcôve ovoïde, où les bûches se consument dans l\"âtre";
+final url =
+    "https://miningandbusiness.com/wp-content/uploads/2021/02/03f19c3a-1d92-4be7-ac54-f52b37e626ad-561x771.jpg";
+final urlPrd = "http://www.africau.edu/images/default/sample.pdf";
+
+final magazinesTest = [
+  Magazine(urlCover: url, magazineUrl: urlPrd, summaryText: summary, title: "Mining and business"),
+  Magazine(urlCover: url, magazineUrl: urlPrd, summaryText: summary, title: "Mining and business"),
+  Magazine(urlCover: url, magazineUrl: urlPrd, summaryText: summary, title: "Mining and business"),
+  Magazine(urlCover: url, magazineUrl: urlPrd, summaryText: summary, title: "Mining and business"),
+  Magazine(urlCover: url, magazineUrl: urlPrd, summaryText: summary, title: "Mining and business")
+];

lib/ui/view/main.dart

@@ -4,7 +4,7 @@ import 'package:flutter/widgets.dart';
 import 'package:le_kiosque_by_gcs/ui/view/home.dart';
 import 'package:le_kiosque_by_gcs/ui/view/news.dart';
 import 'package:le_kiosque_by_gcs/ui/view/profile.dart';
-import 'package:le_kiosque_by_gcs/ui/view/search.dart';
+import 'package:le_kiosque_by_gcs/ui/view/search/search.dart';
 import 'package:le_kiosque_by_gcs/ui/view/setting/setting.dart';
 import 'package:le_kiosque_by_gcs/ui/view/subscription/subscription.dart';
 

lib/ui/view/search.dart

@@ -1,8 +0,0 @@
-import 'package:flutter/cupertino.dart';
-
-class SearchView extends StatelessWidget {
-  @override
-  Widget build(BuildContext context) {
-    return Container();
-  }
-}

lib/ui/view/search/item_mag_search.dart

@@ -0,0 +1,57 @@
+import 'package:flutter/material.dart';
+import 'package:le_kiosque_by_gcs/model/magazine.dart';
+
+class ItemMagazineSearch extends StatelessWidget {
+  const ItemMagazineSearch({
+    Key key,
+    @required this.magazine,
+  }) : super(key: key);
+
+  final Magazine magazine;
+
+  @override
+  Widget build(BuildContext context) {
+    return Padding(
+      padding: EdgeInsets.only(top: 16, left: 16, right: 16),
+      child: Row(
+        mainAxisAlignment: MainAxisAlignment.spaceBetween,
+        children: [
+          Row(
+            children: [
+              Container(
+                height: 50,
+                width: 50,
+                decoration: BoxDecoration(
+                  shape: BoxShape.circle,
+                  image: DecorationImage(
+                    image: NetworkImage(magazine.urlCover),
+                    fit: BoxFit.cover,
+                  ),
+                ),
+              ),
+              Padding(
+                padding: EdgeInsets.only(left: 16.0),
+                child: Text(
+                  magazine.title,
+                  style: TextStyle(
+                    fontSize: 16,
+                    color: Color(0xFF3B3B3B),
+                  ),
+                ),
+              ),
+            ],
+          ),
+          InkWell(
+            onTap: () => _removeRecentSearch(context),
+            child: Icon(
+              Icons.close,
+              color: Color(0xFF5D5D5D),
+            ),
+          )
+        ],
+      ),
+    );
+  }
+
+  _removeRecentSearch(BuildContext context) {}
+}

lib/ui/view/search/search.dart

@@ -0,0 +1,66 @@
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+import 'package:le_kiosque_by_gcs/model/magazine.dart';
+import 'package:le_kiosque_by_gcs/ui/view/search/item_mag_search.dart';
+
+class SearchView extends StatelessWidget {
+  @override
+  Widget build(BuildContext context) {
+    // TODO: Removing test data
+    return Scaffold(
+      appBar: AppBar(
+        toolbarHeight: 65,
+        backgroundColor: Colors.white,
+        iconTheme: IconThemeData(
+          color: Color(0xFF545454), //change your color here
+        ),
+        title: SizedBox(
+          height: 46,
+          child: TextField(
+            maxLines: 1,
+            decoration: InputDecoration(
+              contentPadding: EdgeInsets.all(8),
+              prefixIcon: Icon(
+                Icons.search,
+                color: Color(0xFF545454),
+              ),
+              hintText: 'Rechercher un article',
+              border: OutlineInputBorder(
+                borderRadius: const BorderRadius.all(
+                  const Radius.circular(32.0),
+                ),
+                borderSide: BorderSide(
+                  width: 0,
+                  style: BorderStyle.none,
+                ),
+              ),
+              filled: true,
+              fillColor: Colors.grey[200],
+            ),
+          ),
+        ),
+      ),
+      body: ListView.builder(
+        itemCount: magazinesTest.length + 1,
+        itemBuilder: (context, index) {
+          if (index == 0) {
+            return Padding(
+              padding: const EdgeInsets.all(16.0),
+              child: Text(
+                "Recherches récentes",
+                style: TextStyle(
+                  fontSize: 22,
+                  color: Color(0xFF3B3B3B),
+                ),
+              ),
+            );
+          } else {
+            return ItemMagazineSearch(
+              magazine: magazinesTest[index - 1],
+            );
+          }
+        },
+      ),
+    );
+  }
+}

lib/ui/view/setting/setting.dart

@@ -61,6 +61,9 @@ class SettingView extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    // TOdo: Remove statique data
+
+
     return Scaffold(
       appBar: AppBar(
         centerTitle: false,