refactor: polish new chat screen

This commit is contained in:
Vick Top 2024-04-16 11:26:53 +02:00
parent 32189ba397
commit a59e149420
3 changed files with 100 additions and 84 deletions

View file

@ -31,7 +31,7 @@ class ChatRow extends StatelessWidget {
@override
Widget build(BuildContext context) => Row(
crossAxisAlignment: CrossAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding: const EdgeInsets.only(left: 10.0),
@ -39,7 +39,7 @@ class ChatRow extends StatelessWidget {
),
Expanded(
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 22.0),
padding: const EdgeInsets.only(left: 16.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
@ -48,10 +48,10 @@ class ChatRow extends StatelessWidget {
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: TextStyle(
fontSize: 18,
fontSize: 16,
fontWeight: unreadMessages > 0
? FontWeight.w600
: FontWeight.w400,
? FontWeight.w900
: FontWeight.w500,
),
),
if (subTitle != null)
@ -62,11 +62,11 @@ class ChatRow extends StatelessWidget {
style: TextStyle(
fontSize: 16,
fontWeight: unreadMessages > 0
? FontWeight.w600
: FontWeight.w400,
? FontWeight.w500
: FontWeight.w300,
),
overflow: TextOverflow.ellipsis,
maxLines: 1,
maxLines: 2,
),
),
],
@ -77,17 +77,19 @@ class ChatRow extends StatelessWidget {
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.end,
children: [
Text(
lastUsed ?? '',
if (lastUsed != null) // Check if lastUsed is not null
Padding(
padding: const EdgeInsets.only(bottom: 4.0),
child: Text(
lastUsed!,
style: const TextStyle(
color: Color(0xFFBBBBBB),
fontSize: 14,
),
),
),
if (unreadMessages > 0) ...[
Padding(
padding: const EdgeInsets.only(top: 4.0),
child: Container(
Container(
width: 20,
height: 20,
decoration: BoxDecoration(
@ -103,7 +105,6 @@ class ChatRow extends StatelessWidget {
),
),
),
),
],
],
),

View file

@ -51,16 +51,23 @@ Widget _createNewChatButton(
ChatTranslations translations,
) =>
Padding(
padding: const EdgeInsets.all(24.0),
padding: const EdgeInsets.fromLTRB(5, 24, 5, 24),
child: ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Colors.black,
minimumSize: const Size.fromHeight(50),
backgroundColor: const Color.fromRGBO(113, 198, 209, 1),
fixedSize: const Size(254, 44),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(56),
),
),
onPressed: onPressed,
child: Text(
translations.newChatButton,
style: const TextStyle(color: Colors.white),
style: const TextStyle(
color: Colors.white,
fontWeight: FontWeight.w800,
fontSize: 18,
),
),
),
);
@ -112,7 +119,7 @@ Widget _createChatRowContainer(
) =>
Padding(
padding: const EdgeInsets.symmetric(
vertical: 15.0,
vertical: 12.0,
horizontal: 10.0,
),
child: chatRow,

View file

@ -92,6 +92,8 @@ class _ChatScreenState extends State<ChatScreen> {
widget.service.chatOverviewService.getUnreadChatsCountStream(),
builder: (BuildContext context, snapshot) => Align(
alignment: Alignment.centerRight,
child: Visibility(
visible: (snapshot.data ?? 0) > 0,
child: Padding(
padding: const EdgeInsets.only(right: 22.0),
child: Text(
@ -105,6 +107,7 @@ class _ChatScreenState extends State<ChatScreen> {
),
),
),
),
],
),
Column(
@ -113,7 +116,7 @@ class _ChatScreenState extends State<ChatScreen> {
child: ListView(
controller: controller,
physics: const AlwaysScrollableScrollPhysics(),
padding: const EdgeInsets.only(top: 15.0),
padding: const EdgeInsets.fromLTRB(28, 16, 28, 0),
children: [
StreamBuilder<List<ChatModel>>(
stream: widget.service.chatOverviewService.getChatsStream(),
@ -283,7 +286,9 @@ class ChatListItem extends StatelessWidget {
final DateFormatter _dateFormatter;
@override
Widget build(BuildContext context) => GestureDetector(
Widget build(BuildContext context) => Column(
children: [
GestureDetector(
onTap: () => widget.onPressChat(chat),
child: Container(
color: Colors.transparent,
@ -331,5 +336,8 @@ class ChatListItem extends StatelessWidget {
),
),
),
),
const Divider(),
],
);
}