feat: add borderRadius option for the MessageTheme

This commit is contained in:
Freek van de Ven 2025-02-17 14:41:20 +01:00 committed by FlutterJoey
parent 70eeb816e2
commit 7a0fd49070
2 changed files with 15 additions and 1 deletions

View file

@ -108,6 +108,7 @@ class MessageTheme {
this.borderColor,
this.textColor,
this.timeTextColor,
this.borderRadius,
this.messageAlignment,
this.messageSidePadding,
this.textAlignment,
@ -122,6 +123,7 @@ class MessageTheme {
borderColor: theme.colorScheme.primary,
textColor: theme.colorScheme.onPrimary,
timeTextColor: theme.colorScheme.onPrimary,
borderRadius: BorderRadius.circular(12),
textAlignment: TextAlign.start,
messageSidePadding: 144.0,
messageAlignment: null,
@ -158,6 +160,10 @@ class MessageTheme {
/// Defaults to [ThemeData.colorScheme.primaryColor]
final Color? borderColor;
/// The border radius of the message container
/// Defaults to [BorderRadius.circular(12)]
final BorderRadius? borderRadius;
/// The padding on the side of the message
/// If not set, the padding is 144.0
final double? messageSidePadding;
@ -177,6 +183,7 @@ class MessageTheme {
Color? borderColor,
Color? textColor,
Color? timeTextColor,
BorderRadius? borderRadius,
double? messageSidePadding,
TextAlign? messageAlignment,
TextAlign? textAlignment,
@ -189,6 +196,7 @@ class MessageTheme {
borderColor: borderColor ?? this.borderColor,
textColor: textColor ?? this.textColor,
timeTextColor: timeTextColor ?? this.timeTextColor,
borderRadius: borderRadius ?? this.borderRadius,
messageSidePadding: messageSidePadding ?? this.messageSidePadding,
messageAlignment: messageAlignment ?? this.messageAlignment,
textAlignment: textAlignment ?? this.textAlignment,
@ -204,6 +212,7 @@ class MessageTheme {
borderColor: borderColor ?? other.borderColor,
textColor: textColor ?? other.textColor,
timeTextColor: timeTextColor ?? other.timeTextColor,
borderRadius: borderRadius ?? other.borderRadius,
messageSidePadding: messageSidePadding ?? other.messageSidePadding,
messageAlignment: messageAlignment ?? other.messageAlignment,
textAlignment: textAlignment ?? other.textAlignment,

View file

@ -173,6 +173,7 @@ class _ChatMessageBubble extends StatelessWidget {
DefaultChatMessageContainer(
backgroundColor: messageTheme.backgroundColor!,
borderColor: messageTheme.borderColor!,
borderRadius: messageTheme.borderRadius!,
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
@ -258,6 +259,7 @@ class DefaultChatMessageContainer extends StatelessWidget {
const DefaultChatMessageContainer({
required this.backgroundColor,
required this.borderColor,
required this.borderRadius,
required this.child,
super.key,
});
@ -268,6 +270,9 @@ class DefaultChatMessageContainer extends StatelessWidget {
/// The color of the border around the message
final Color borderColor;
/// The border radius of the message container
final BorderRadius borderRadius;
/// The content of the message
final Widget child;
@ -275,7 +280,7 @@ class DefaultChatMessageContainer extends StatelessWidget {
Widget build(BuildContext context) => DecoratedBox(
decoration: BoxDecoration(
color: backgroundColor,
borderRadius: BorderRadius.circular(12),
borderRadius: borderRadius,
border: Border.all(
width: 1,
color: borderColor,