furniture app design

ricardocaste · Jan 29, 2020 · 050bcd1 · 050bcd1
1 parent ef839e4
commit 050bcd1
Show file tree

Hide file tree

Showing 25 changed files with 1,163 additions and 27 deletions.
diff --git a/README.md b/README.md
@@ -17,6 +17,7 @@ My effort on replicating various apps UI on flutter.
 - **[My flutter plugins](#my-flutter-plugins)**
 - **[Complete App Examples](#complete-app-examples)**
 - **[Code Examples](#code-examples)**
+- **[Contributors](#contributors)**
 - **[Animation Examples UI](#animations)**
 - **[Ecommerce UIs](#ecommerce)**
 - **[Login/signup UIs](#user-flow-screens)**
@@ -37,6 +38,7 @@ My effort on replicating various apps UI on flutter.
 - **[Travel App UIs](#travel-app)**
 - **[Grocery App UI Kit](#grocery-app-ui-kit)**
 - **[Bank App Clone](#bank-app-clone)**
+- **[Furniture App UI](#furniture-app-ui)**
 
 ## Speed codes [Youtube](https://youtube.com/c/reactbits)
 
@@ -121,8 +123,10 @@ These are some of my flutter plugins, that might help you in your flutter develo
 ## Contributors
 
 1. [Damodar Lohani](https://github.com/lohanidamodar)
-2. [Siddhartha Joshi](https://github.com/cimplesid)
-3. [Sudip Thapa](https://github.com/sudeepthapa)
+2. [Sudip Thapa](https://github.com/sudeepthapa)
+3. [Shyam Adhikari (UI/UX Designer)](http://uilearner.com)
+4.  [Mausam Rayamajhi](https://github.com/mausamRayamajhi)
+5. [Siddhartha Joshi](https://github.com/cimplesid)
 
 ## Packages Used
 
@@ -219,3 +223,7 @@ The code for Springy Widget is taken and refactored from (https://github.com/mat
 ## Bank App Clone
 Bank app clone by [Mausam Rayamajhi](https://github.com/mausamRayamajhi)
 <img height="480px" src="screenshots/nic1.png"> <img height="480px" src="screenshots/nic2.png"> <img height="480px" src="screenshots/nic3.png">
+
+## Furniture App UI 
+Furniture App by  [Mausam Rayamajhi](https://github.com/mausamRayamajhi)
+<img height="480px" src="screenshots/f1.png"> <img height="480px" src="screenshots/f2.gif"> 
diff --git a/assets/fonts/MyFlutterApp.ttf b/assets/fonts/MyFlutterApp.ttf
diff --git a/assets/fonts/icomoon.ttf b/assets/fonts/icomoon.ttf
diff --git a/lib/core/presentation/routes.dart b/lib/core/presentation/routes.dart
@@ -1,6 +1,7 @@
 
 import 'package:flutter/material.dart';
 import 'package:flutter_ui_challenges/core/data/models/menu.dart';
+import 'package:flutter_ui_challenges/src/furniture_app/furniture_app.dart';
 import 'package:flutter_ui_challenges/src/nic_asia_clone/nic_asia_app.dart';
 import 'package:flutter_ui_challenges/src/pages/animations/anim4.dart';
 import 'package:flutter_ui_challenges/src/pages/animations/anim5.dart';
@@ -307,6 +308,7 @@ final List<dynamic> pages = [
     ]),
     SubMenuItem("Grocery UI Kit", GroceryHomePage(), path: GroceryHomePage.path),
     SubMenuItem("Bank App Clone", NicAsiaApp(), path: NicAsiaApp.path),
+    SubMenuItem("Furniture App", FurnitureApp(), path: FurnitureApp.path),
   ];
 
   SubMenuItem getItemForKey(String key) {

diff --git a/lib/src/furniture_app/furniture_app.dart b/lib/src/furniture_app/furniture_app.dart
@@ -0,0 +1,32 @@
+/**
+ * Author: Mausam Rayamajhi
+ * profile: https://github.com/mausamRayamajhi
+  */
+  import 'package:flutter/material.dart';
+
+import 'pages/furniture.dart';
+import 'pages/profile.dart';
+
+class FurnitureApp extends StatelessWidget {
+  static final String path = "lib/src/furniture_app/furniture_app.dart";
+  @override
+  Widget build(BuildContext context) {
+    return MaterialApp(
+      debugShowCheckedModeBanner: false,
+      title: 'Flutter Demo',
+      initialRoute: '/',
+      routes: <String, WidgetBuilder>{
+        '/': (BuildContext context) => SafeArea(
+              child: SafeArea(
+                child: Profile(),
+              ),
+            ),
+        '/furniture': (BuildContext context) => SafeArea(
+              child: SafeArea(
+                child: Furniture(),
+              ),
+            ),
+      },
+    );
+  }
+}
diff --git a/lib/src/furniture_app/icon/custome_icon.dart b/lib/src/furniture_app/icon/custome_icon.dart
@@ -0,0 +1,19 @@
+import 'package:flutter/widgets.dart';
+
+class CustomIcon {
+  CustomIcon._();
+
+  static const _icomoon = 'icomoon';
+  static const _kFontFam = 'MyFlutterApp';
+
+  static const IconData truck = const IconData(0xe800, fontFamily: _kFontFam);
+  static const IconData chat = const IconData(0xe801, fontFamily: _kFontFam);
+  static const IconData money = const IconData(0xe802, fontFamily: _kFontFam);
+  static const IconData account_balance_wallet =
+      const IconData(0xf008, fontFamily: _kFontFam);
+
+  static const IconData wallet = const IconData(0xe910, fontFamily: _icomoon);
+  static const IconData delivery = const IconData(0xe904, fontFamily: _icomoon);
+  static const IconData message = const IconData(0xe900, fontFamily: _icomoon);
+  static const IconData service = const IconData(0xe90f, fontFamily: _icomoon);
+}
diff --git a/lib/src/furniture_app/pages/furniture.dart b/lib/src/furniture_app/pages/furniture.dart
@@ -0,0 +1,102 @@
+import '../utils/constant.dart';
+import '../widgets/furniture/bottomItem.dart';
+import '../widgets/furniture/furniture_category.dart';
+import '../widgets/furniture/item_navigation.dart';
+import '../widgets/furniture/lamp.dart';
+import '../widgets/title_large.dart';
+import '../widgets/title_small.dart';
+import 'package:flutter/material.dart';
+
+class Furniture extends StatelessWidget {
+  @override
+  Widget build(BuildContext context) {
+    Size deviceSize = MediaQuery.of(context).size;
+    return Material(
+      color: Colors.white,
+      child: SingleChildScrollView(
+              child: Column(
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: <Widget>[
+            Padding(
+              padding: const EdgeInsets.only(
+                left: 20.0,
+                right: 20.0,
+                top: 20.0,
+              ),
+              child: TitleLarge(
+                title: 'Furniture',
+                icon: Icons.add_shopping_cart,
+              ),
+            ),
+            buildFurnitureCategories,
+            Padding(
+              padding: const EdgeInsets.only(
+                left: 20.0,
+                right: 20.0,
+              ),
+              child: TitleSmall(
+                subTitle: 'Good quality item',
+                title: 'Modern',
+              ),
+            ),
+            SizedBox(
+              height: 20.0,
+            ),
+            buildLampsWithSlider(),
+            Padding(
+              padding: const EdgeInsets.only(left: 20.0, right: 20.0, top: 10.0),
+              child: TitleSmall(
+                subTitle: 'In recent month',
+                title: 'Popular',
+              ),
+            ),
+            SizedBox(
+              height: 15.0,
+            ),
+            BottomItem(),
+            const SizedBox(height: 10.0),
+          ],
+        ),
+      ),
+    );
+  }
+
+  Container buildLampsWithSlider() {
+    return Container(
+      //color: Colors.yellow,
+      height: 350,
+      child: Stack(
+        children: <Widget>[
+          buildLamps,
+          Positioned(
+            bottom: 40.0,
+            right: 50.0,
+            child: ItemNavigation(),
+          )
+        ],
+      ),
+    );
+  }
+
+  final buildLamps = ListView.builder(
+    scrollDirection: Axis.horizontal,
+    physics: BouncingScrollPhysics(),
+    shrinkWrap: true,
+    itemCount: lampList.length,
+    itemBuilder: (context, int index) => Lamp(
+          item: lampList[index],
+          index: index,
+        ),
+  );
+  final buildFurnitureCategories = Container(
+    height: 100.0,
+    //color: Colors.red,
+    child: ListView.builder(
+      scrollDirection: Axis.horizontal,
+      itemCount: furnitureCategoriesList.length,
+      itemBuilder: (context, int index) => FurnitureCategory(
+            item: furnitureCategoriesList[index],
+          ),
+    ),
+  );
+}
diff --git a/lib/src/furniture_app/pages/profile.dart b/lib/src/furniture_app/pages/profile.dart
@@ -0,0 +1,42 @@
+import '../widgets/profile/profile_categories.dart';
+import '../widgets/profile/profile_detail.dart';
+import '../widgets/profile/profile_menu.dart';
+import '../widgets/title_large.dart';
+import 'package:flutter/material.dart';
+
+class Profile extends StatelessWidget {
+  @override
+  Widget build(BuildContext context) {
+    return Material(
+      color: Colors.white,
+      child: Padding(
+        padding: const EdgeInsets.only(
+          left: 20.0,
+          right: 20.0,
+          top: 30.0,
+        ),
+        child: Column(
+          //mainAxisSize: MainAxisSize.max,
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: <Widget>[
+            TitleLarge(
+              title: 'Center',
+            ),
+            SizedBox(
+              height: 20.0,
+            ),
+            ProfileDetail(),
+            SizedBox(
+              height: 30.0,
+            ),
+            ProfileCategories(),
+            SizedBox(
+              height: 30.0,
+            ),
+            Flexible(child: ProfileMenu()),
+          ],
+        ),
+      ),
+    );
+  }
+}
diff --git a/lib/src/furniture_app/utils/constant.dart b/lib/src/furniture_app/utils/constant.dart
@@ -0,0 +1,101 @@
+import '../icon/custome_icon.dart';
+import 'package:flutter/material.dart';
+
+//COLORS
+const Color profile_info_background = Color(0xFF3775FD);
+const Color profile_info_categories_background = Color(0xFFF6F5F8);
+const Color profile_info_address = Color(0xFF8D7AEE);
+const Color profile_info_privacy = Color(0xFFF369B7);
+const Color profile_info_general = Color(0xFFFFC85B);
+const Color profile_info_notification = Color(0xFF5DD1D3);
+const Color profile_item_color = Color(0xFFC4C5C9);
+const String imagePath = 'assets/image';
+
+const String devMausam = 'https://firebasestorage.googleapis.com/v0/b/dl-flutter-ui-challenges.appspot.com/o/mausam%2Fprofile.jpg?alt=media&token=83fa8b83-f53b-489c-a799-ca5d5aceae7b';
+
+const Color furnitureCateDisableColor = Color(0xFF939BA9);
+const List lampsImage = [
+  {'image': 'https://firebasestorage.googleapis.com/v0/b/dl-flutter-ui-challenges.appspot.com/o/mausam%2Fa.jpg?alt=media&token=6af6cfed-84a6-4cf3-a5ce-875fe47f8c5b'},
+  {'image': 'https://firebasestorage.googleapis.com/v0/b/dl-flutter-ui-challenges.appspot.com/o/mausam%2Fb.jpg?alt=media&token=801b2f22-94fd-419b-8b84-c9b4fbd45d4d'},
+  {'image': 'https://firebasestorage.googleapis.com/v0/b/dl-flutter-ui-challenges.appspot.com/o/mausam%2Fc.jpg?alt=media&token=b4470e0b-411f-4925-acaf-d6cb9292a44e'},
+  {'image': 'https://firebasestorage.googleapis.com/v0/b/dl-flutter-ui-challenges.appspot.com/o/mausam%2Fd.jpg?alt=media&token=01ed6f8d-8e1d-403a-a5a0-423b7aa958be'},
+  {'image': 'https://firebasestorage.googleapis.com/v0/b/dl-flutter-ui-challenges.appspot.com/o/mausam%2Fe.jpg?alt=media&token=a9342ee6-9dc6-452d-ade7-4a1d7783e7fe'},
+  {'image': 'https://firebasestorage.googleapis.com/v0/b/dl-flutter-ui-challenges.appspot.com/o/mausam%2Ff.jpg?alt=media&token=c65c13ad-5b2f-494e-82eb-13d730d823ce'},
+];
+List<ProfileMenu> lampList = [
+  ProfileMenu(title: 'Landscape', subTitle: '384'),
+  ProfileMenu(title: 'Discus Pendant', subTitle: '274'),
+  ProfileMenu(title: 'Mushroom Lamp', subTitle: '374'),
+  ProfileMenu(title: 'Titanic Pendant', subTitle: '562'),
+  ProfileMenu(title: 'Torn Lighting', subTitle: '105'),
+  ProfileMenu(title: 'Abduction Pendant', subTitle: '365'),
+];
+const List profileItems = [
+  {'count': '846', 'name': 'Collect'},
+  {'count': '51', 'name': 'Attention'},
+  {'count': '267', 'name': 'Track'},
+  {'count': '39', 'name': 'Coupons'},
+];
+
+List<Catg> listProfileCategories = [
+  Catg(name: 'Wallet', icon: CustomIcon.account_balance_wallet, number: 0),
+  Catg(name: 'Delivery', icon: CustomIcon.truck, number: 0),
+  Catg(name: 'Message', icon: CustomIcon.chat, number: 2),
+  Catg(name: 'Service', icon: CustomIcon.money, number: 0),
+];
+
+List<FurnitureCatg> furnitureCategoriesList = [
+  FurnitureCatg(icon: Icons.desktop_windows, elivation: true),
+  FurnitureCatg(icon: CustomIcon.account_balance_wallet, elivation: false),
+  FurnitureCatg(icon: Icons.security, elivation: false),
+  FurnitureCatg(icon: CustomIcon.chat, elivation: false),
+  FurnitureCatg(icon: CustomIcon.money, elivation: false),
+];
+
+List<ProfileMenu> profileMenuList = [
+  ProfileMenu(
+    title: 'Address',
+    subTitle: 'Ensure your harvesting address',
+    iconColor: profile_info_address,
+    icon: Icons.location_on,
+  ),
+  ProfileMenu(
+    title: 'Privacy',
+    subTitle: 'System permission change',
+    iconColor: profile_info_privacy,
+    icon: Icons.lock,
+  ),
+  ProfileMenu(
+    title: 'General',
+    subTitle: 'Basic functional settings',
+    iconColor: profile_info_general,
+    icon: Icons.layers,
+  ),
+  ProfileMenu(
+    title: 'Notification',
+    subTitle: 'Take over the news in time',
+    iconColor: profile_info_notification,
+    icon: Icons.notifications,
+  ),
+];
+
+class ProfileMenu {
+  String title;
+  String subTitle;
+  IconData icon;
+  Color iconColor;
+  ProfileMenu({this.icon, this.title, this.iconColor, this.subTitle});
+}
+
+class Catg {
+  String name;
+  IconData icon;
+  int number;
+  Catg({this.icon, this.name, this.number});
+}
+
+class FurnitureCatg {
+  IconData icon;
+  bool elivation;
+  FurnitureCatg({this.icon, this.elivation});
+}