Skip to content

Commit 44d1eaf

Browse files
kushchoudhary98Kush Choudhary
andauthored
Redesigned the Profile list-view (#749)
Co-authored-by: Kush Choudhary <kushchoudhary@Kushs-MacBook-Pro.local>
1 parent 288bd4c commit 44d1eaf

File tree

1 file changed

+65
-125
lines changed

1 file changed

+65
-125
lines changed

lib/app/modules/home/views/profile_config.dart

Lines changed: 65 additions & 125 deletions
Original file line numberDiff line numberDiff line change
@@ -21,81 +21,21 @@ class _ProfileSelectState extends State<ProfileSelect> {
2121
HomeController controller = Get.find<HomeController>();
2222
ThemeController themeController = Get.find<ThemeController>();
2323

24+
final scrollKey = GlobalKey();
25+
26+
@override
27+
void initState() {
28+
super.initState();
29+
_scrollToSelected();
30+
}
31+
2432
@override
2533
Widget build(BuildContext context) {
26-
return Obx(() => AnimatedSwitcher(
27-
duration: const Duration(milliseconds: 250),
28-
transitionBuilder: (child, animation) {
29-
return SizeTransition(
30-
sizeFactor: animation, axis: Axis.horizontal, child: child,);
31-
},
32-
child: !controller.expandProfile.value
33-
? InkWell(
34-
onTap: () async {
35-
controller.isProfile.value = true;
36-
controller.isProfileUpdate.value = true;
37-
Get.toNamed('/add-update-alarm',
38-
arguments: controller.genFakeAlarmModel(),);
39-
},
40-
child: Container(
41-
key: const ValueKey(1),
42-
child: Row(
43-
children: [
44-
Padding(
45-
padding: EdgeInsets.only(
46-
left: 18 * controller.scalingFactor.value,
47-
),
48-
child: Obx(
49-
() => Container(
50-
padding: EdgeInsets.symmetric(
51-
horizontal: 24 * controller.scalingFactor.value,
52-
vertical: 4 * controller.scalingFactor.value,
53-
),
54-
constraints: BoxConstraints(maxWidth: MediaQuery.of(context).size.width * 2 / 3),
55-
decoration: BoxDecoration(
56-
gradient: LinearGradient(
57-
begin: Alignment.topLeft,
58-
end: Alignment.topCenter,
59-
stops: const [0.2, 0.2],
60-
colors: [
61-
kprimaryColor,
62-
themeController.secondaryBackgroundColor.value,
63-
],
64-
),
65-
borderRadius: BorderRadius.circular(18),),
66-
child: Text(
67-
'${controller.selectedProfile}',
68-
style: Theme.of(context)
69-
.textTheme
70-
.displaySmall!
71-
.copyWith(
72-
color: themeController.primaryTextColor.value.withOpacity(
73-
0.75,
74-
),
75-
fontSize:
76-
22 * controller.scalingFactor.value,
77-
overflow: TextOverflow.ellipsis
78-
,),
79-
),),
80-
),
81-
),
82-
Padding(
83-
padding: const EdgeInsets.symmetric(horizontal: 8.0),
84-
child: InkWell(
85-
borderRadius: BorderRadius.circular(28),
86-
onTap: () {
87-
controller.expandProfile.value =
88-
!controller.expandProfile.value;
89-
},
90-
child: const Padding(
91-
padding: EdgeInsets.all(8.0),
92-
child: Icon(Icons.arrow_forward_ios),
93-
),
94-
),
95-
),
96-
InkWell(
97-
borderRadius: BorderRadius.circular(28),
98-
onTap: () async {
34+
return Obx(() => Row(
35+
mainAxisAlignment: MainAxisAlignment.center,
36+
children: [
37+
TextButton(
38+
onPressed: () async {
9939
controller.isProfile.value = true;
10040
controller.profileModel.value =
10141
(await IsarDb.getProfile(
@@ -105,56 +45,49 @@ class _ProfileSelectState extends State<ProfileSelect> {
10545
'/add-update-alarm',arguments: controller.genFakeAlarmModel(),
10646
);
10747
},
108-
child: const Padding(
109-
padding: EdgeInsets.all(8.0),
110-
child: Icon(Icons.add),
111-
),
112-
),
113-
],
114-
),
48+
style: ButtonStyle(
49+
backgroundColor: WidgetStateProperty.all(themeController.secondaryBackgroundColor.value),
50+
foregroundColor: WidgetStateProperty.all(themeController.primaryColor.value),
51+
shape: WidgetStateProperty.all(const CircleBorder()),
11552
),
116-
)
117-
: Row(
118-
children: [
119-
Padding(
120-
padding: EdgeInsets.only(
121-
left: 24 * controller.scalingFactor.value,
122-
),
123-
child: InkWell(
124-
onTap: () {
125-
controller.expandProfile.value =
126-
!controller.expandProfile.value;
127-
},
128-
child: const Icon(Icons.arrow_back_ios),
129-
),
130-
),
131-
SizedBox(
132-
width: Get.width * 0.8,
133-
key: const ValueKey(2),
134-
child: StreamBuilder(
135-
stream: IsarDb.getProfiles(),
136-
builder: (context, snapshot) {
137-
if (snapshot.hasData) {
138-
final profiles = snapshot.data;
139-
return SingleChildScrollView(
140-
scrollDirection: Axis.horizontal,
141-
child: Row(
142-
children: profiles!
143-
.map((e) => profileCapsule(e))
144-
.toList(),
145-
),
146-
);
147-
}
148-
return SizedBox();
149-
},),
150-
),
151-
],
152-
),),);
53+
child: Padding(padding: const EdgeInsets.all(2.0),
54+
child: Icon(
55+
Icons.add,
56+
color: themeController.primaryColor.value,
57+
size: 30 * controller.scalingFactor.value,
58+
),
59+
),
60+
),
61+
SizedBox(
62+
width: Get.width * 0.8,
63+
child: StreamBuilder(
64+
stream: IsarDb.getProfiles(),
65+
builder: (context, snapshot) {
66+
if (snapshot.hasData){
67+
final profiles = snapshot.data;
68+
return SingleChildScrollView(
69+
scrollDirection: Axis.horizontal,
70+
child: Row(
71+
children: profiles!
72+
.map((e) => profileCapsule(e))
73+
.toList(),
74+
),
75+
);
76+
}
77+
return SizedBox();
78+
},
79+
),
80+
)
81+
],
82+
));
15383
}
15484

15585
Widget profileCapsule(ProfileModel profile) {
15686
return Padding(
157-
padding: const EdgeInsets.symmetric(horizontal: 8.0),
87+
key: profile.profileName == controller.selectedProfile.value
88+
? scrollKey
89+
: null,
90+
padding: const EdgeInsets.symmetric(horizontal: 4.0),
15891
child: InkWell(
15992
borderRadius: BorderRadius.circular(18),
16093
onTap: () {
@@ -163,25 +96,32 @@ class _ProfileSelectState extends State<ProfileSelect> {
16396
},
16497
child: Obx(() => Container(
16598
padding: EdgeInsets.symmetric(
166-
horizontal: 24 * controller.scalingFactor.value,
167-
vertical: 4 * controller.scalingFactor.value,
99+
horizontal: 18 * controller.scalingFactor.value,
100+
vertical: 7 * controller.scalingFactor.value,
168101
),
169102
decoration: BoxDecoration(
170103
color: profile.profileName == controller.selectedProfile.value
171-
? kprimaryColor.withOpacity(0.5)
104+
? kprimaryColor
172105
: themeController.secondaryBackgroundColor.value,
173-
borderRadius: BorderRadius.circular(18),),
106+
borderRadius: BorderRadius.circular(30),),
174107
child: Text(
175108
profile.profileName,
176109
style: Theme.of(context).textTheme.displaySmall!.copyWith(
177-
color: themeController.primaryTextColor.value.withOpacity(
178-
0.75,
179-
),
110+
color: profile.profileName == controller.selectedProfile.value
111+
? themeController.secondaryBackgroundColor.value
112+
: themeController.primaryDisabledTextColor.value,
180113
fontSize: 22 * controller.scalingFactor.value,
181114
),
182115
),
183116
),),
184117
),
185118
);
186119
}
120+
121+
void _scrollToSelected() {
122+
Future.delayed(1000.milliseconds, () {
123+
Scrollable.ensureVisible(scrollKey.currentContext!,
124+
duration: 500.milliseconds,);
125+
});
126+
}
187127
}

0 commit comments

Comments
 (0)