Skip to content

Commit bb99f15

Browse files
CubeRomanMagellanMagellan
andauthored
SK-613: Implement mobile changes for Profile screen (#105)
* fix profile alignment * add lock portrait mode --------- Co-authored-by: Magellan <magellan@connectycube.com>
1 parent 67363cc commit bb99f15

3 files changed

Lines changed: 92 additions & 62 deletions

File tree

sama_chat_client/lib/main.dart

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import 'package:firebase_core/firebase_core.dart';
22
import 'package:firebase_messaging/firebase_messaging.dart';
33
import 'package:flutter/material.dart';
4+
import 'package:flutter/services.dart';
45
import 'package:flutter_bloc/flutter_bloc.dart';
56

67
import 'sama_firebase_options.dart';
@@ -30,6 +31,12 @@ final GlobalKey<NavigatorState> navigatorKey = GlobalKey<NavigatorState>();
3031

3132
Future<void> main() async {
3233
WidgetsFlutterBinding.ensureInitialized();
34+
35+
await SystemChrome.setPreferredOrientations([
36+
DeviceOrientation.portraitUp,
37+
DeviceOrientation.portraitDown,
38+
]);
39+
3340
await Firebase.initializeApp(
3441
options: await SamaFirebaseOptions.currentPlatform,
3542
);

sama_chat_client/lib/src/features/profile/view/profile_form.dart

Lines changed: 50 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -48,7 +48,7 @@ class AvatarNameTile extends StatelessWidget {
4848
child: ListTile(
4949
titleAlignment: ListTileTitleAlignment.top,
5050
title: Padding(
51-
padding: const EdgeInsets.only(top: 8),
51+
padding: const EdgeInsets.only(top: 4),
5252
child: _UserAvatar(),
5353
),
5454
subtitle: Padding(
@@ -66,46 +66,58 @@ class ProfileCard extends StatelessWidget {
6666
Widget build(BuildContext context) {
6767
return Padding(
6868
padding: EdgeInsets.only(bottom: Platform.isIOS ? 0.0 : 4.0),
69-
child: const SizedBox(
70-
width: double.infinity,
71-
child: Card(
72-
child: Padding(
73-
padding: EdgeInsets.all(15),
74-
child: Stack(
75-
children: [
76-
Card(
77-
color: paleMallow,
78-
margin: EdgeInsets.only(top: 60),
79-
child: Padding(
80-
padding: EdgeInsets.only(top: 100, left: 4, right: 4),
81-
child: Column(
82-
mainAxisSize: MainAxisSize.min,
83-
children: [
84-
ConnectionChecker(child: _UsernameForm()),
85-
SizedBox(height: columnItemMargin),
86-
ConnectionChecker(child: _PhoneForm()),
87-
SizedBox(height: columnItemMargin),
88-
ConnectionChecker(child: _EmailForm()),
89-
SizedBox(height: columnItemMargin),
90-
ConnectionChecker(child: _AccountForm()),
91-
],
92-
),
93-
),
94-
),
95-
Align(alignment: Alignment.bottomRight, child: _LogoutForm()),
96-
Align(
97-
alignment: Alignment.topCenter,
98-
child: ConnectionChecker(child: AvatarNameTile()),
99-
),
100-
],
101-
),
69+
child: Card(
70+
child: Padding(
71+
padding: const EdgeInsets.all(15),
72+
child: Stack(
73+
children: [
74+
_UserData(),
75+
const Align(
76+
alignment: Alignment.bottomRight, child: _LogoutForm()),
77+
],
10278
),
10379
),
10480
),
10581
);
10682
}
10783
}
10884

85+
class _UserData extends StatelessWidget {
86+
@override
87+
Widget build(BuildContext context) {
88+
return const Align(
89+
alignment: Alignment(0, -0.5),
90+
child: IntrinsicHeight(
91+
child: Stack(
92+
children: [
93+
Card(
94+
color: paleMallow,
95+
margin: EdgeInsets.only(top: 40),
96+
child: Padding(
97+
padding: EdgeInsets.only(top: 100, left: 4, right: 4),
98+
child: Column(
99+
mainAxisSize: MainAxisSize.min,
100+
children: [
101+
ConnectionChecker(child: _UsernameForm()),
102+
SizedBox(height: columnItemMargin),
103+
ConnectionChecker(child: _PhoneForm()),
104+
SizedBox(height: columnItemMargin),
105+
ConnectionChecker(child: _EmailForm()),
106+
SizedBox(height: columnItemMargin),
107+
ConnectionChecker(child: _AccountForm()),
108+
],
109+
),
110+
),
111+
),
112+
Align(
113+
alignment: Alignment(0, -1.1),
114+
child: ConnectionChecker(child: AvatarNameTile()),
115+
),
116+
],
117+
)));
118+
}
119+
}
120+
109121
class _UserAvatar extends StatelessWidget {
110122
@override
111123
Widget build(BuildContext context) {
@@ -435,6 +447,7 @@ class NameDialogInput extends StatelessWidget {
435447
),
436448
),
437449
]),
450+
actionsAlignment: MainAxisAlignment.spaceAround,
438451
actions: _formActions(context));
439452
});
440453
}
@@ -493,7 +506,7 @@ class InfoDialogInput extends StatelessWidget {
493506
),
494507
errorText: state.userPhone.displayError ==
495508
UserPhoneValidationError.outOfRange
496-
? 'The phone number should be 3 to 15 digits in length.'
509+
? 'The phone range 3 to 15 digits.'
497510
: null,
498511
),
499512
),
@@ -538,6 +551,7 @@ class InfoDialogInput extends StatelessWidget {
538551
),
539552
),
540553
]),
554+
actionsAlignment: MainAxisAlignment.spaceAround,
541555
actions: _formActions(context));
542556
});
543557
}
@@ -640,6 +654,7 @@ class _ChangePasswordInput extends StatelessWidget {
640654
),
641655
),
642656
]),
657+
actionsAlignment: MainAxisAlignment.spaceAround,
643658
actions: _formActions(context));
644659
});
645660
}

sama_chat_client/lib/src/shared/ui/view/user_forms.dart

Lines changed: 35 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -16,14 +16,14 @@ class AvatarForm extends StatelessWidget {
1616
color: black,
1717
shape: BoxShape.circle,
1818
border: Border.all(color: white, width: 2),
19-
boxShadow: [
20-
BoxShadow(
21-
color: black.withValues(alpha: 0.5),
22-
spreadRadius: 3,
23-
blurRadius: 7,
24-
offset: const Offset(0, 3), // Controls the shadow's position
25-
),
26-
],
19+
boxShadow: [
20+
BoxShadow(
21+
color: black.withValues(alpha: 0.5),
22+
spreadRadius: 3,
23+
blurRadius: 7,
24+
offset: const Offset(0, 3), // Controls the shadow's position
25+
),
26+
],
2727
),
2828
height: 85.0,
2929
width: 85.0,
@@ -77,11 +77,13 @@ class UsernameForm extends StatelessWidget {
7777
),
7878
],
7979
),
80-
Text(
81-
userLogin ?? "",
82-
style:
83-
const TextStyle(fontSize: 18, fontWeight: FontWeight.normal),
84-
),
80+
Padding(
81+
padding: const EdgeInsets.only(left: 4),
82+
child: Text(
83+
userLogin ?? "",
84+
style: const TextStyle(
85+
fontSize: 18, fontWeight: FontWeight.normal),
86+
)),
8587
],
8688
));
8789
}
@@ -118,13 +120,16 @@ class UserPhoneForm extends StatelessWidget {
118120
),
119121
],
120122
),
121-
Text(
122-
userPhone == null ? userPhoneStub : userPhone!,
123-
style: TextStyle(
124-
fontSize: 18,
125-
fontWeight:
126-
userPhone == null ? FontWeight.w200 : FontWeight.normal),
127-
),
123+
Padding(
124+
padding: const EdgeInsets.only(left: 4),
125+
child: Text(
126+
userPhone == null ? userPhoneStub : userPhone!,
127+
style: TextStyle(
128+
fontSize: 18,
129+
fontWeight: userPhone == null
130+
? FontWeight.w200
131+
: FontWeight.normal),
132+
)),
128133
],
129134
));
130135
}
@@ -161,13 +166,16 @@ class UserEmailForm extends StatelessWidget {
161166
),
162167
],
163168
),
164-
Text(
165-
userEmail == null ? userEmailStub : userEmail!,
166-
style: TextStyle(
167-
fontSize: 18,
168-
fontWeight:
169-
userEmail == null ? FontWeight.w200 : FontWeight.normal),
170-
),
169+
Padding(
170+
padding: const EdgeInsets.only(left: 4),
171+
child: Text(
172+
userEmail == null ? userEmailStub : userEmail!,
173+
style: TextStyle(
174+
fontSize: 18,
175+
fontWeight: userEmail == null
176+
? FontWeight.w200
177+
: FontWeight.normal),
178+
)),
171179
],
172180
));
173181
}

0 commit comments

Comments
 (0)