You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
mohemm-flutter-app/lib/ui/chat/chat_bubble.dart

152 lines
5.4 KiB
Dart

import 'package:flutter/material.dart';
import 'package:mohem_flutter_app/classes/colors.dart';
import 'package:mohem_flutter_app/extensions/int_extensions.dart';
import 'package:mohem_flutter_app/extensions/string_extensions.dart';
import 'package:mohem_flutter_app/extensions/widget_extensions.dart';
// todo: @aamir use extension methods, and use correct widgets.
class ChatBubble extends StatelessWidget {
const ChatBubble(
{Key? key,
required this.text,
required this.replyText,
required this.isCurrentUser,
required this.isSeen,
required this.isDelivered,
required this.dateTime,
required this.isReplied,
required this.userName})
: super(key: key);
final String text;
final String replyText;
final bool isCurrentUser;
final bool isSeen;
final bool isDelivered;
final String dateTime;
final bool isReplied;
final String userName;
@override
Widget build(BuildContext context) {
return Padding(
// padding: EdgeInsets.zero,
padding: EdgeInsets.only(
left: isCurrentUser ? 110 : 20,
right: isCurrentUser ? 20 : 110,
bottom: 9,
),
child: Align(
alignment: isCurrentUser ? Alignment.centerRight : Alignment.centerLeft,
child: DecoratedBox(
decoration: BoxDecoration(
color: MyColors.white,
gradient: isCurrentUser
? null
: const LinearGradient(
transform: GradientRotation(
.46,
),
begin: Alignment.topRight,
end: Alignment.bottomLeft,
colors: <Color>[
MyColors.gradiantEndColor,
MyColors.gradiantStartColor,
],
),
borderRadius: BorderRadius.circular(
10,
),
),
child: Padding(
padding: EdgeInsets.only(
top: isReplied ? 8 : 5,
right: 8,
left: 8,
bottom: 5,
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.start,
children: [
if (isReplied)
ClipRRect(
borderRadius: BorderRadius.circular(
5.0,
),
child: Container(
decoration: BoxDecoration(
border: Border(
left: BorderSide(
width: 6,
color: isCurrentUser ? MyColors.gradiantStartColor : MyColors.white,
),
),
color: isCurrentUser ? MyColors.black.withOpacity(0.10) : MyColors.black.withOpacity(0.30),
),
child: Row(
children: [
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
(userName)
.toText12(
color: MyColors.gradiantStartColor,
isBold: false,
)
.paddingOnly(
right: 5,
top: 5,
bottom: 0,
left: 5,
),
replyText
.toText10(
color: isCurrentUser ? MyColors.grey71Color : MyColors.white.withOpacity(0.5),
isBold: false,
maxlines: 4,
)
.paddingOnly(
right: 5,
top: 5,
bottom: 8,
left: 5,
),
],
),
),
],
),
),
),
if (isReplied) 8.height,
text.toText12(
color: isCurrentUser ? MyColors.grey57Color : MyColors.white,
),
Row(
crossAxisAlignment: CrossAxisAlignment.end,
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
dateTime.toText12(
color: isCurrentUser ? MyColors.grey41Color.withOpacity(.5) : MyColors.white.withOpacity(0.7),
),
if (isCurrentUser) 5.width,
if (isCurrentUser)
Icon(
isDelivered ? Icons.done_all : Icons.done_all,
color: isSeen ? MyColors.textMixColor : MyColors.grey9DColor,
size: 14,
),
],
),
],
),
),
),
),
);
}
}