Skip to content

Commit 92075b8

Browse files
sumit-codersumit-coder
committed
settings tab is done for now
1 parent fbdd5f5 commit 92075b8

File tree

5 files changed

+209
-3
lines changed

5 files changed

+209
-3
lines changed

‎assets/images/dark.png‎

8.71 KB
Loading

‎assets/images/light.png‎

7.12 KB
Loading

‎lib/views/screens/home_screen/home_screen.dart‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
22
import 'package:flutter_animate/flutter_animate.dart';
33
import 'package:help_me_design/views/screens/tabs/components_tab/components_tab.dart';
44
import 'package:help_me_design/views/screens/tabs/inspiration_tab/inspiration_tab.dart';
5+
import 'package:help_me_design/views/screens/tabs/settings_tab/settings_tab.dart';
56

67
import '../tabs/categories_screens.dart';
78
import '../tabs/code_snippet_tab/code_snippet_tab.dart';
@@ -21,20 +22,22 @@ class MyHomePage extends StatefulWidget {
2122
}
2223

2324
class _MyHomePageState extends State<MyHomePage> {
24-
SideTabType activeButton = SideTabType.inspiration;
25+
SideTabType activeButton = SideTabType.settings;
2526

2627
Widget switchTabs(SideTabType newActiveTab) {
2728
switch (newActiveTab) {
2829
case SideTabType.explore:
2930
return ExploreView();
3031
case SideTabType.inspiration:
3132
return InspirationTab();
32-
case SideTabType.docs:
33-
return DocsView();
33+
// case SideTabType.docs:
34+
// return DocsView();
3435
case SideTabType.codeSnippet:
3536
return CodeSnippetScreen();
3637
case SideTabType.components:
3738
return const ComponentsTab();
39+
case SideTabType.settings:
40+
return const SettingsTab();
3841
default:
3942
return const CategoriesView();
4043
}

‎lib/views/screens/tabs/inspiration_tab/widgets/inspiration_list_view.dart‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -163,6 +163,9 @@ class _InspirationCardState extends State<InspirationCard> {
163163
child: Image.network(
164164
widget.imageUrl,
165165
fit: BoxFit.cover,
166+
errorBuilder: (context, error, stackTrace) {
167+
return Icon(Icons.error_rounded);
168+
},
166169
),
167170
),
168171
),

‎lib/views/screens/tabs/settings_tab/settings_tab.dart‎

Lines changed: 200 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,200 @@
1+
import 'package:flutter/material.dart';
2+
import 'package:help_me_design/appwrite_service/auth_service.dart';
3+
import 'package:help_me_design/theme/my_colors.dart';
4+
import 'package:help_me_design/theme/my_design_system.dart';
5+
import 'package:help_me_design/theme/my_theme.dart';
6+
import 'package:help_me_design/views/widgets/button_tap_effect.dart';
7+
import 'package:provider/provider.dart';
8+
9+
import '../../../../constants/text_constants.dart';
10+
import '../../../widgets/container_pattern_painter.dart';
11+
import '../widgets/tab_view_hero_card.dart';
12+
13+
class SettingsTab extends StatelessWidget {
14+
const SettingsTab({Key? key}) : super(key: key);
15+
16+
@override
17+
Widget build(BuildContext context) {
18+
var themeData = Theme.of(context);
19+
var authService = Provider.of<AuthService>(context, listen: false);
20+
var themeMangerProvider = Provider.of<ThemeManager>(context, listen: false);
21+
return Container(
22+
// width: 200,
23+
// height: 200,
24+
// color: Colors.deepPurple,
25+
child: SingleChildScrollView(
26+
child: Column(
27+
children: [
28+
TabViewHeroCard(
29+
// title: MyTextConstants.docsTabHeadline,
30+
title: "Settings.",
31+
shortDescription: "Setting, Profile, About",
32+
posterImage: 'https://i.ibb.co/SNVPkKM/original-dd50f8430ab324b03b6af592e73ca6c7-removebg-preview.png',
33+
bgPattern: ContainerSquarePatternTwoPainter(44, context),
34+
),
35+
SizedBox(height: MySpaceSystem.spaceX2),
36+
Column(
37+
crossAxisAlignment: CrossAxisAlignment.start,
38+
children: [
39+
// Profile Section
40+
SectionDividerWithTitle(
41+
title: 'Profile',
42+
bodyWidget: Row(
43+
mainAxisAlignment: MainAxisAlignment.spaceBetween,
44+
children: [
45+
Row(
46+
children: [
47+
const Icon(Icons.person_4, color: DesignSystemColors.secondaryColorDark, size: 78),
48+
const SizedBox(width: MySpaceSystem.spaceX),
49+
Column(
50+
mainAxisAlignment: MainAxisAlignment.start,
51+
crossAxisAlignment: CrossAxisAlignment.start,
52+
children: [
53+
Text("Default Name", style: MyTextTypeSystem.titleMediumDark),
54+
const SizedBox(height: MySpaceSystem.spaceX),
55+
Text(authService.currentUser.email, style: MyTextTypeSystem.titleLargeDark),
56+
],
57+
),
58+
],
59+
),
60+
ButtonTapEffect(
61+
onTap: () {},
62+
child: Container(
63+
height: 64,
64+
decoration: BoxDecoration(
65+
boxShadow: cardShadow,
66+
color: DesignSystemColors.secondaryColorDark,
67+
borderRadius: BorderRadius.circular(8),
68+
),
69+
padding: EdgeInsets.symmetric(horizontal: MySpaceSystem.spaceX2),
70+
child: Row(
71+
crossAxisAlignment: CrossAxisAlignment.center,
72+
children: [
73+
SizedBox(width: MySpaceSystem.spaceX1),
74+
Text("Logout", style: MyTextTypeSystem.titleMedium),
75+
SizedBox(width: MySpaceSystem.spaceX1),
76+
const Icon(Icons.logout_rounded, color: DesignSystemColors.secondaryColor, size: 34),
77+
],
78+
),
79+
),
80+
),
81+
],
82+
),
83+
),
84+
SizedBox(height: MySpaceSystem.spaceX4),
85+
SectionDividerWithTitle(
86+
title: 'Theme',
87+
bodyWidget: Row(
88+
mainAxisAlignment: MainAxisAlignment.start,
89+
children: [
90+
ThemeModeCard(
91+
isActive: themeData.brightness == Brightness.dark ? true : false,
92+
title: 'Dark Mode',
93+
mode: 'dark',
94+
activeBorderColor: DesignSystemColors.secondaryColor,
95+
modeColor: DesignSystemColors.secondaryColorDark,
96+
onTap: () {
97+
themeMangerProvider.changeThemeMode(ThemeMode.dark);
98+
},
99+
),
100+
SizedBox(width: MySpaceSystem.spaceX3),
101+
ThemeModeCard(
102+
isActive: themeData.brightness == Brightness.light ? true : false,
103+
title: 'Light Mode',
104+
mode: 'light',
105+
activeBorderColor: DesignSystemColors.secondaryColorDark,
106+
modeColor: DesignSystemColors.secondaryColor,
107+
onTap: () {
108+
themeMangerProvider.changeThemeMode(ThemeMode.light);
109+
},
110+
),
111+
],
112+
),
113+
),
114+
SizedBox(height: MySpaceSystem.spaceX3),
115+
],
116+
)
117+
],
118+
),
119+
),
120+
);
121+
}
122+
}
123+
124+
class ThemeModeCard extends StatelessWidget {
125+
const ThemeModeCard({
126+
super.key,
127+
required this.title,
128+
required this.mode,
129+
required this.isActive,
130+
required this.activeBorderColor,
131+
required this.modeColor,
132+
required this.onTap,
133+
});
134+
135+
final String title;
136+
final String mode;
137+
final bool isActive;
138+
final Color activeBorderColor;
139+
final Color modeColor;
140+
final VoidCallback onTap;
141+
142+
@override
143+
Widget build(BuildContext context) {
144+
return ButtonTapEffect(
145+
onTap: onTap,
146+
child: Container(
147+
height: 200,
148+
width: 200,
149+
decoration: BoxDecoration(
150+
boxShadow: cardShadow,
151+
color: modeColor,
152+
borderRadius: BorderRadius.circular(10),
153+
border: Border.all(width: 2, color: isActive ? activeBorderColor : modeColor),
154+
),
155+
padding: EdgeInsets.all(MySpaceSystem.spaceX2),
156+
child: Column(
157+
crossAxisAlignment: CrossAxisAlignment.center,
158+
mainAxisAlignment: MainAxisAlignment.start,
159+
children: [
160+
ClipRRect(
161+
borderRadius: const BorderRadius.only(topLeft: Radius.circular(4), topRight: Radius.circular(4)),
162+
child: Image.asset(mode == 'dark' ? 'assets/images/dark.png' : 'assets/images/light.png'),
163+
),
164+
SizedBox(height: MySpaceSystem.spaceX3),
165+
Text(title, style: mode == 'dark' ? MyTextTypeSystem.titleLarge : MyTextTypeSystem.titleLargeDark),
166+
SizedBox(height: MySpaceSystem.spaceX1),
167+
],
168+
),
169+
),
170+
);
171+
}
172+
}
173+
174+
class SectionDividerWithTitle extends StatelessWidget {
175+
const SectionDividerWithTitle({Key? key, required this.title, required this.bodyWidget}) : super(key: key);
176+
177+
final String title;
178+
final Widget bodyWidget;
179+
180+
@override
181+
Widget build(BuildContext context) {
182+
return Padding(
183+
padding: EdgeInsets.only(left: MySpaceSystem.spaceX3),
184+
child: Column(
185+
crossAxisAlignment: CrossAxisAlignment.start,
186+
children: [
187+
Text(
188+
title,
189+
style: MyTextTypeSystem.titleXXLargeDark,
190+
),
191+
SizedBox(height: MySpaceSystem.spaceX1),
192+
const Divider(height: 1, thickness: 1, color: DesignSystemColors.secondaryColorDark),
193+
SizedBox(height: MySpaceSystem.spaceX1),
194+
SizedBox(height: MySpaceSystem.spaceX3),
195+
bodyWidget,
196+
],
197+
),
198+
);
199+
}
200+
}

0 commit comments

Comments
 (0)