Skip to content

Commit c1e5090

Browse files
CubeRomanMagellanMagellan
CubeRomanMagellan
and
Magellan
authored
SK-606: Update UI for profile (#103)
* SK-567: flutter sdk development (#90) * create monorepo * add api * remove client old api * add tokens management * rename sama_chat_api to sama_sdk * SK-578: share to image (#91) * create monorepo * add api * remove client old api * add tokens management * rename sama_chat_api to sama_sdk * add image share to support * fix Popup with Send Image after share again --------- Co-authored-by: Magellan <magellan@connectycube.com> * add check for deleted user opponent (#93) Co-authored-by: Magellan <magellan@connectycube.com> * add MediaAttachmentBloc to menu (#95) Co-authored-by: Magellan <magellan@connectycube.com> * SK-589: implement ability to take a photo (#92) * create monorepo * add api * remove client old api * add tokens management * rename sama_chat_api to sama_sdk * add image share to support * add image_picker * add camera picker * update agpVersion --------- Co-authored-by: Magellan <magellan@connectycube.com> * SK-587: Hard back does not work (#94) * add pop invoke * minor fix didPop * add swipe ios impl --------- Co-authored-by: Magellan <magellan@connectycube.com> * fix app routing (#96) Co-authored-by: Magellan <magellan@connectycube.com> * add blocking (#97) Co-authored-by: Magellan <magellan@connectycube.com> * add auto complete (#98) Co-authored-by: Magellan <magellan@connectycube.com> * fix reply bubble (#99) Co-authored-by: Magellan <magellan@connectycube.com> * update login page * add expending to reset password * add fresh icons to chat list * update avatar view * update profile card * add card to profile * make fields more round --------- Co-authored-by: Magellan <magellan@connectycube.com>
1 parent f6f1b2c commit c1e5090

4 files changed

Lines changed: 105 additions & 102 deletions

File tree

‎sama_chat_client/lib/src/features/conversations_list/view/conversations_page.dart‎

Lines changed: 7 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -46,22 +46,7 @@ class HomePage extends StatelessWidget {
4646
}
4747
},
4848
child: const ConversationsList(),
49-
),
50-
floatingActionButton: state.status == SharingIntentStatus.processing
51-
? null
52-
: ConnectionChecker(
53-
child: FloatingActionButton(
54-
// fix error https://github.com/flutter/flutter/issues/115358
55-
heroTag: null,
56-
child: const Padding(
57-
padding: EdgeInsets.only(top: 4.0),
58-
child: Icon(Icons.add_comment_outlined, size: 32.0),
59-
),
60-
onPressed: () {
61-
context.push(groupCreateScreenPath);
62-
},
63-
),
64-
));
49+
));
6550
});
6651
}
6752
}
@@ -104,8 +89,8 @@ class ChatAppBar extends StatelessWidget implements PreferredSizeWidget {
10489
leading: Align(
10590
alignment: Alignment.centerRight,
10691
child: IconButton(
107-
icon:
108-
const Icon(Icons.person_outline, color: lightWhite, size: 32.0),
92+
icon: const Icon(Icons.account_circle_outlined,
93+
color: lightWhite, size: 32.0),
10994
tooltip: 'Profile',
11095
onPressed: () {
11196
context.push(profilePath);
@@ -119,8 +104,8 @@ class ChatAppBar extends StatelessWidget implements PreferredSizeWidget {
119104
child: IconButton(
120105
onPressed: () => _openSearch(context),
121106
icon: const Icon(
122-
Icons.search,
123-
color: white,
107+
Icons.edit_note_outlined,
108+
color: lightWhite,
124109
size: 32,
125110
),
126111
),
@@ -130,7 +115,8 @@ class ChatAppBar extends StatelessWidget implements PreferredSizeWidget {
130115
}
131116

132117
_openSearch(BuildContext context) {
133-
context.push(globalSearchPath);
118+
context.push(groupCreateScreenPath);
119+
// context.push(globalSearchPath);
134120
}
135121

136122
@override

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

Lines changed: 77 additions & 70 deletions
Original file line numberDiff line numberDiff line change
@@ -44,19 +44,18 @@ class AvatarNameTile extends StatelessWidget {
4444

4545
@override
4646
Widget build(BuildContext context) {
47-
return ListTile(
47+
return IntrinsicWidth(
48+
child: ListTile(
4849
titleAlignment: ListTileTitleAlignment.top,
49-
title: Center(
50-
child: Padding(
51-
padding: const EdgeInsets.only(top: 8),
52-
child: _UserAvatar(),
53-
),
50+
title: Padding(
51+
padding: const EdgeInsets.only(top: 8),
52+
child: _UserAvatar(),
5453
),
5554
subtitle: Padding(
5655
padding: const EdgeInsets.only(bottom: 4),
5756
child: _UserFullName(),
5857
),
59-
);
58+
));
6059
}
6160
}
6261

@@ -72,20 +71,32 @@ class ProfileCard extends StatelessWidget {
7271
child: Card(
7372
child: Padding(
7473
padding: EdgeInsets.all(15),
75-
child: Column(
76-
mainAxisSize: MainAxisSize.min,
74+
child: Stack(
7775
children: [
78-
ConnectionChecker(child: AvatarNameTile()),
79-
ConnectionChecker(child: _UsernameForm()),
80-
SizedBox(height: columnItemMargin),
81-
ConnectionChecker(child: _PhoneForm()),
82-
SizedBox(height: columnItemMargin),
83-
ConnectionChecker(child: _EmailForm()),
84-
SizedBox(height: columnItemMargin),
85-
ConnectionChecker(child: _AccountForm()),
86-
Expanded(
87-
child: Align(
88-
alignment: Alignment.bottomRight, child: _LogoutForm()))
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+
),
89100
],
90101
),
91102
),
@@ -122,50 +133,48 @@ class _UserFullName extends StatelessWidget {
122133
previous.userLastname != current.userLastname &&
123134
current.userLastname.isPure,
124135
builder: (context, state) {
125-
return Align(
126-
alignment: Alignment.center,
127-
child: TextButton(
128-
onPressed: () {
129-
showDialog(
130-
context: context,
131-
builder: (_) {
132-
return BlocProvider.value(
133-
value: BlocProvider.of<ProfileBloc>(context),
134-
child: const NameDialogInput(),
135-
);
136-
});
137-
},
138-
style: TextButton.styleFrom(
139-
minimumSize: Size.zero,
140-
tapTargetSize: MaterialTapTargetSize.shrinkWrap,
141-
alignment: Alignment.center),
142-
child: Column(children: [
143-
Text(
144-
state.userFirstname.value.isEmpty
145-
? "First name"
146-
: state.userFirstname.value,
147-
style: TextStyle(
148-
fontSize: 22,
149-
fontWeight: state.userFirstname.value.isEmpty
150-
? FontWeight.w200
151-
: FontWeight.bold,
152-
color: signalBlack),
153-
overflow: TextOverflow.ellipsis,
154-
),
155-
Text(
156-
state.userLastname.value.isEmpty
157-
? "Last name"
158-
: state.userLastname.value,
159-
style: TextStyle(
160-
fontSize: 18,
161-
color: signalBlack,
162-
fontWeight: state.userLastname.value.isEmpty
163-
? FontWeight.w200
164-
: FontWeight.normal),
165-
overflow: TextOverflow.ellipsis,
166-
),
167-
]),
168-
));
136+
return TextButton(
137+
onPressed: () {
138+
showDialog(
139+
context: context,
140+
builder: (_) {
141+
return BlocProvider.value(
142+
value: BlocProvider.of<ProfileBloc>(context),
143+
child: const NameDialogInput(),
144+
);
145+
});
146+
},
147+
style: TextButton.styleFrom(
148+
minimumSize: Size.zero,
149+
tapTargetSize: MaterialTapTargetSize.shrinkWrap,
150+
alignment: Alignment.center),
151+
child: Column(mainAxisSize: MainAxisSize.min, children: [
152+
Text(
153+
state.userFirstname.value.isEmpty
154+
? "First name"
155+
: state.userFirstname.value,
156+
style: TextStyle(
157+
fontSize: 22,
158+
fontWeight: state.userFirstname.value.isEmpty
159+
? FontWeight.w200
160+
: FontWeight.bold,
161+
color: signalBlack),
162+
overflow: TextOverflow.ellipsis,
163+
),
164+
Text(
165+
state.userLastname.value.isEmpty
166+
? "Last name"
167+
: state.userLastname.value,
168+
style: TextStyle(
169+
fontSize: 18,
170+
color: signalBlack,
171+
fontWeight: state.userLastname.value.isEmpty
172+
? FontWeight.w200
173+
: FontWeight.normal),
174+
overflow: TextOverflow.ellipsis,
175+
),
176+
]),
177+
);
169178
});
170179
}
171180
}
@@ -185,7 +194,7 @@ class _UsernameForm extends StatelessWidget {
185194
}
186195

187196
class _PhoneForm extends StatelessWidget {
188-
const _PhoneForm({super.key});
197+
const _PhoneForm();
189198

190199
@override
191200
Widget build(BuildContext context) {
@@ -325,15 +334,13 @@ class _LogoutForm extends StatelessWidget {
325334

326335
@override
327336
Widget build(BuildContext context) {
328-
return TextButton.icon(
337+
return ElevatedButton.icon(
329338
onPressed: () {
330339
context.read<AuthenticationBloc>().add(AuthenticationLogoutRequested());
331340
},
332341
icon: const Icon(Icons.exit_to_app_outlined, color: dullGray, size: 25),
333342
style: TextButton.styleFrom(
334-
minimumSize: Size.zero,
335-
tapTargetSize: MaterialTapTargetSize.shrinkWrap,
336-
alignment: Alignment.centerLeft),
343+
backgroundColor: paleMallow, alignment: Alignment.centerLeft),
337344
label: const Text(
338345
'Logout',
339346
style: TextStyle(fontWeight: FontWeight.w300),
@@ -451,7 +458,7 @@ class InfoDialogInput extends StatelessWidget {
451458
return AlertDialog(
452459
title: const Text('Edit personal info'),
453460
actionsPadding: const EdgeInsets.only(bottom: 8),
454-
contentPadding: const EdgeInsets.fromLTRB(16, 16, 16, 8),
461+
contentPadding: const EdgeInsets.fromLTRB(26, 16, 16, 8),
455462
content: Column(mainAxisSize: MainAxisSize.min, children: [
456463
Container(
457464
padding: const EdgeInsets.all(8),

‎sama_chat_client/lib/src/shared/ui/colors.dart‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ const Color dullGray = Color(0xFF6D6D6D);
1111
const Color signalBlack = Color(0xFF2A2A2A);
1212
const Color blackBlue = Color(0xFF1B1B1D);
1313
const Color black = Color(0xFF000000);
14+
const Color paleMallow = Color(0xFFE6E7F8);
1415
const Color lightMallow = Color(0xFFDBDCFC);
1516
const Color slateBlue = Color(0xFF7678E5);
1617
const Color cyan = Color(0xFF00FFFF);

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

Lines changed: 20 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -14,25 +14,34 @@ class AvatarForm extends StatelessWidget {
1414
return Container(
1515
decoration: BoxDecoration(
1616
color: black,
17-
borderRadius: BorderRadius.circular(5.0),
17+
shape: BoxShape.circle,
18+
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+
],
1827
),
19-
padding: const EdgeInsets.all(4.0),
2028
height: 85.0,
2129
width: 85.0,
2230
child: Center(child: () {
2331
if (avatar == null || avatar!.isEmpty) {
2432
return _defaultIcon();
2533
} else {
26-
return Image.network(
34+
return ClipOval(
35+
child: Image.network(
2736
avatar!,
28-
height: 75.0,
29-
width: 75.0,
37+
height: 85.0,
38+
width: 85.0,
3039
fit: BoxFit.cover,
3140
errorBuilder: (BuildContext context, Object exception,
3241
StackTrace? stackTrace) {
3342
return _defaultIcon();
3443
},
35-
);
44+
));
3645
}
3746
}()));
3847
}
@@ -90,19 +99,19 @@ class UserPhoneForm extends StatelessWidget {
9099
return Ink(
91100
padding: const EdgeInsets.all(8),
92101
decoration: BoxDecoration(
93-
color: lightWhite,
102+
color: white,
94103
border: Border.all(
95104
color: lightWhite,
96105
),
97-
borderRadius: BorderRadius.circular(10),
106+
borderRadius: BorderRadius.circular(30),
98107
),
99108
child: Column(
100109
crossAxisAlignment: CrossAxisAlignment.start,
101110
children: [
102111
const Row(
103-
crossAxisAlignment: CrossAxisAlignment.end,
112+
crossAxisAlignment: CrossAxisAlignment.center,
104113
children: [
105-
Icon(Icons.local_phone_outlined, color: dullGray, size: 25),
114+
Icon(Icons.local_phone_outlined, color: dullGray, size: 26),
106115
Text(
107116
' Mobile phone',
108117
style: TextStyle(fontWeight: FontWeight.w300),
@@ -137,7 +146,7 @@ class UserEmailForm extends StatelessWidget {
137146
border: Border.all(
138147
color: lightWhite,
139148
),
140-
borderRadius: BorderRadius.circular(10),
149+
borderRadius: BorderRadius.circular(30),
141150
),
142151
child: Column(
143152
crossAxisAlignment: CrossAxisAlignment.start,

0 commit comments

Comments
 (0)