Skip to content

Commit 8f0d27f

Browse files
nathansdevnathansdev
committed
message alignment fixed and added screenshots
1 parent 8e2ab40 commit 8f0d27f

12 files changed

+102
-112
lines changed

‎lib/chat/chat_home_page.dart‎

Lines changed: 5 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import 'package:contraflutterkit/utils/colors.dart';
22
import 'package:flutter/cupertino.dart';
33
import 'package:flutter/material.dart';
4-
import 'package:flutter_svg/flutter_svg.dart';
54

65
import 'chat_list_page.dart';
76

@@ -33,26 +32,20 @@ class _ChatHomePageState extends State<ChatHomePage> {
3332
),
3433
bottomNavigationBar: BottomNavigationBar(
3534
items: [
35+
BottomNavigationBarItem(icon: Icon(Icons.home), title: Text("Home")),
3636
BottomNavigationBarItem(
37-
icon: SvgPicture.asset("assets/icons/ic_circle.svg"),
38-
title: Text("Home")),
37+
icon: Icon(Icons.search), title: Text("Search")),
3938
BottomNavigationBarItem(
40-
icon: SvgPicture.asset("assets/icons/ic_circle.svg"),
41-
title: Text("Search")),
42-
BottomNavigationBarItem(
43-
icon: SvgPicture.asset("assets/icons/ic_circle.svg"),
44-
title: Text("Chat")),
45-
BottomNavigationBarItem(
46-
icon: SvgPicture.asset("assets/icons/ic_circle.svg"),
47-
title: Text("About")),
39+
icon: Icon(Icons.chat_bubble), title: Text("Chat")),
40+
BottomNavigationBarItem(icon: Icon(Icons.info), title: Text("About")),
4841
],
4942
currentIndex: _currentIndex,
5043
onTap: _onItemTapped,
5144
selectedItemColor: wood_smoke,
5245
unselectedItemColor: trout,
5346
showSelectedLabels: true,
5447
showUnselectedLabels: true,
55-
selectedIconTheme: IconThemeData(color: wood_smoke, opacity: 0),
48+
selectedIconTheme: IconThemeData(color: wood_smoke, opacity: 1),
5649
unselectedIconTheme: IconThemeData(color: trout, opacity: 0.6),
5750
selectedLabelStyle: TextStyle(
5851
color: wood_smoke, fontSize: 12, fontWeight: FontWeight.w800),

‎lib/chat/chat_list_item.dart‎

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ class ChatListItemWidget extends StatelessWidget {
2424
flex: 1,
2525
child: RoundImageWithText(
2626
size: 48,
27-
text: "A",
27+
text: chat.name.substring(0, 1),
2828
color: dandelion,
2929
borderColor: wood_smoke,
3030
shadowColor: wood_smoke,
@@ -76,10 +76,12 @@ class ChatListItemWidget extends StatelessWidget {
7676
SizedBox(
7777
height: 10,
7878
),
79-
BadgeText(
80-
text: chat.count,
81-
color: flamingo,
82-
)
79+
chat.count.isNotEmpty
80+
? BadgeText(
81+
text: chat.count,
82+
color: flamingo,
83+
)
84+
: SizedBox()
8385
],
8486
),
8587
)

‎lib/chat/chat_list_page.dart‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -35,17 +35,17 @@ class _ChatListPageState extends State<ChatListPage> {
3535
name: "Harray",
3636
message: "No food left in the kitchen",
3737
time: "3.30 AM",
38-
count: "2"));
38+
count: ""));
3939
_items.add(Chat(
4040
name: "Leonard",
4141
message: "Get groceries while coming",
4242
time: "3.30 AM",
43-
count: "2"));
43+
count: ""));
4444
_items.add(Chat(
4545
name: "Sheldon",
4646
message: "Please have a look",
4747
time: "3.30 AM",
48-
count: "2"));
48+
count: ""));
4949
_items.add(Chat(
5050
name: "Chirag",
5151
message: "Please have a look",
@@ -55,12 +55,12 @@ class _ChatListPageState extends State<ChatListPage> {
5555
name: "Charli",
5656
message: "Please have a look",
5757
time: "3.30 AM",
58-
count: "2"));
58+
count: "4"));
5959
_items.add(Chat(
6060
name: "Karthick",
6161
message: "Can we have coffe?",
6262
time: "3.30 AM",
63-
count: "2"));
63+
count: "4"));
6464
_items.add(Chat(
6565
name: "Murali",
6666
message: "Lets meet tommorrow",

‎lib/chat/chat_message_item.dart‎

Lines changed: 16 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -45,18 +45,22 @@ class ChatMessageItemWidget extends StatelessWidget {
4545
SizedBox(
4646
width: 12,
4747
),
48-
Container(
49-
padding: EdgeInsets.all(16),
50-
decoration: ShapeDecoration(
51-
color: message.isUser ? caribbean_color : color,
52-
shape: RoundedRectangleBorder(
53-
borderRadius: BorderRadius.all(Radius.circular(16)),
54-
side: BorderSide(color: borderColor, width: 2))),
55-
child: Text(
56-
message.message,
57-
textAlign: TextAlign.start,
58-
style: TextStyle(
59-
color: textColor, fontWeight: FontWeight.bold, fontSize: 17),
48+
Flexible(
49+
child: Container(
50+
padding: EdgeInsets.all(16),
51+
decoration: ShapeDecoration(
52+
color: message.isUser ? caribbean_color : color,
53+
shape: RoundedRectangleBorder(
54+
borderRadius: BorderRadius.all(Radius.circular(16)),
55+
side: BorderSide(color: borderColor, width: 2))),
56+
child: Text(
57+
message.message,
58+
textAlign: TextAlign.start,
59+
style: TextStyle(
60+
color: textColor,
61+
fontWeight: FontWeight.bold,
62+
fontSize: 17),
63+
),
6064
),
6165
),
6266
],

‎lib/chat/chat_messages_page.dart‎

Lines changed: 65 additions & 75 deletions
Original file line numberDiff line numberDiff line change
@@ -25,80 +25,56 @@ class _ChatMessagesPageState extends State<ChatMessagesPage> {
2525
@override
2626
void initState() {
2727
super.initState();
28+
_items.add(
29+
Message(name: "Charli", message: "Hi", time: "3.20 AM", isUser: false));
2830
_items.add(Message(
2931
name: "Charli",
30-
message: "Please have a look",
31-
time: "3.00 AM",
32-
isUser: false));
33-
_items.add(Message(
34-
name: "Charli",
35-
message: "Please have a look",
32+
message: "How are you?",
3633
time: "3.20 AM",
3734
isUser: false));
3835
_items.add(Message(
3936
name: "Charli",
40-
message: "Please have a look",
41-
time: "3.10 AM",
37+
message: "Its been long time",
38+
time: "3.20 AM",
4239
isUser: false));
4340
_items.add(Message(
4441
name: "Charli",
4542
message: "Please have a look",
46-
time: "3.50 AM",
43+
time: "3.20 AM",
4744
isUser: false));
45+
_items.add(
46+
Message(name: "Charli", message: "Hey", time: "4.00 AM", isUser: true));
4847
_items.add(Message(
4948
name: "Charli",
50-
message: "Please have a look",
49+
message: "Hi, I am good",
5150
time: "4.00 AM",
5251
isUser: true));
5352
_items.add(Message(
5453
name: "Charli",
55-
message: "Please have a look",
54+
message: "I have completed the document",
5655
time: "4.10 AM",
5756
isUser: false));
5857
_items.add(Message(
5958
name: "Charli",
60-
message: "Please have a look",
61-
time: "3.35 AM",
62-
isUser: true));
63-
_items.add(Message(
64-
name: "Charli",
65-
message: "Please have a look",
66-
time: "3.35 AM",
67-
isUser: true));
68-
_items.add(Message(
69-
name: "Charli",
70-
message: "Please have a look",
71-
time: "3.50 AM",
59+
message: "Will share with you",
60+
time: "4.10 AM",
7261
isUser: false));
7362
_items.add(Message(
74-
name: "Charli",
75-
message: "Please have a look",
76-
time: "3.60 AM",
77-
isUser: false));
63+
name: "Charli", message: "Yes Please", time: "3.35 AM", isUser: true));
7864
_items.add(Message(
7965
name: "Charli",
80-
message: "Please have a look",
66+
message: "Hello again",
8167
time: "3.55 AM",
8268
isUser: false));
8369
_items.add(Message(
8470
name: "Charli",
85-
message: "Please have a look",
86-
time: "3.50 AM",
87-
isUser: false));
88-
_items.add(Message(
89-
name: "Charli",
90-
message: "Please have a look",
91-
time: "3.35 AM",
92-
isUser: false));
93-
_items.add(Message(
94-
name: "Charli",
95-
message: "Please have a look",
96-
time: "3.35 AM",
71+
message: "I have shared a file",
72+
time: "3.55 AM",
9773
isUser: false));
9874
_items.add(Message(
9975
name: "Charli",
100-
message: "Please have a look",
101-
time: "3.35 AM",
76+
message: "Please take a look at it",
77+
time: "3.55 AM",
10278
isUser: false));
10379
_items.add(Message(
10480
name: "Charli", message: "Sure", time: "3.35 AM", isUser: true));
@@ -114,41 +90,55 @@ class _ChatMessagesPageState extends State<ChatMessagesPage> {
11490
return Scaffold(
11591
backgroundColor: white,
11692
appBar: CustomAppBar(
117-
height: 120,
118-
child: Row(
119-
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
120-
crossAxisAlignment: CrossAxisAlignment.end,
121-
children: <Widget>[
122-
Expanded(
123-
flex: 1,
124-
child: Padding(
125-
padding: const EdgeInsets.only(left: 24.0),
126-
child: Align(
127-
alignment: Alignment.bottomLeft,
128-
child: ButtonRoundWithShadow(
129-
size: 48,
130-
borderColor: wood_smoke,
131-
color: white,
132-
callback: () {
133-
Navigator.pop(context);
134-
},
135-
shadowColor: wood_smoke,
136-
iconPath: "assets/icons/arrow_back.svg"),
93+
height: 150,
94+
child: Column(
95+
mainAxisAlignment: MainAxisAlignment.end,
96+
children: [
97+
Row(
98+
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
99+
crossAxisAlignment: CrossAxisAlignment.end,
100+
children: <Widget>[
101+
Expanded(
102+
flex: 1,
103+
child: Padding(
104+
padding: const EdgeInsets.only(left: 24.0),
105+
child: Align(
106+
alignment: Alignment.bottomLeft,
107+
child: ButtonRoundWithShadow(
108+
size: 48,
109+
borderColor: wood_smoke,
110+
color: white,
111+
callback: () {
112+
Navigator.pop(context);
113+
},
114+
shadowColor: wood_smoke,
115+
iconPath: "assets/icons/arrow_back.svg"),
116+
),
117+
),
137118
),
138-
),
139-
),
140-
Expanded(
141-
flex: 1,
142-
child: LoginText(
143-
size: 27,
144-
alignment: Alignment.bottomCenter,
145-
text: "Karthick",
146-
),
119+
Expanded(
120+
flex: 1,
121+
child: LoginText(
122+
size: 27,
123+
alignment: Alignment.bottomCenter,
124+
text: widget.chat.name,
125+
),
126+
),
127+
Expanded(
128+
flex: 1,
129+
child: SizedBox(
130+
width: 20,
131+
),
132+
)
133+
],
147134
),
148-
Expanded(
149-
flex: 1,
150-
child: SizedBox(
151-
width: 20,
135+
Container(
136+
padding: EdgeInsets.only(top: 24),
137+
alignment: Alignment.bottomCenter,
138+
child: Divider(
139+
color: wood_smoke,
140+
thickness: 3,
141+
height: 0,
152142
),
153143
)
154144
],

‎lib/chat/chat_search_item.dart‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ class ChatSearchItemWidget extends StatelessWidget {
2424
flex: 1,
2525
child: RoundImageWithText(
2626
size: 54,
27-
text: "A",
27+
text: chat.name.substring(0, 1),
2828
color: dandelion,
2929
borderColor: wood_smoke,
3030
shadowColor: wood_smoke,

‎lib/chat/chat_search_page.dart‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -125,7 +125,7 @@ class _ChatSearchPageState extends State<ChatSearchPage> {
125125
return Scaffold(
126126
backgroundColor: white,
127127
appBar: CustomAppBar(
128-
height: 120,
128+
height: 140,
129129
child: Padding(
130130
padding: const EdgeInsets.symmetric(horizontal: 24.0),
131131
child: Row(

‎lib/custom_widgets/custom_app_bar.dart‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ class CustomAppBar extends PreferredSize {
1414
Widget build(BuildContext context) {
1515
return Container(
1616
height: preferredSize.height,
17-
alignment: Alignment.bottomLeft,
17+
alignment: Alignment.bottomCenter,
1818
child: child);
1919
}
2020
}

‎lib/login/login_text.dart‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ class LoginText extends StatelessWidget {
1414
alignment: alignment,
1515
child: Text(
1616
text,
17+
maxLines: 1,
1718
style: TextStyle(
1819
fontSize: size == null ? 36 : size,
1920
fontWeight: FontWeight.w800,

‎screenshots/chat_home_page.jpg‎

174 KB
Loading

0 commit comments

Comments
 (0)