added new guide

This commit is contained in:
Deven Joshi
2021-08-27 13:38:44 +05:30
parent b279b840a8
commit 8afbba8e78
@@ -22,6 +22,12 @@ There are several things you can change in the theme including text styles and c
You can also set a different theme for the user's own messages and messages received by them.
:::note
Theming allows you to change minor factors like style while using the widget directly allows you much
more customization such as replacing a certain widget with another. Some things can only be customized
through the widget and not the theme.
:::
Here is an example:
```dart
@@ -60,3 +66,74 @@ MessageThemeData(
You can change the attributes of the avatar (if displayed) using the `avatarTheme` property.
```dart
MessageThemeData(
avatarTheme: AvatarThemeData(
borderRadius: BorderRadius.circular(8),
),
)
```
#### Changing Reaction theme
You also customize the reactions attached to every message using the theme.
```dart
MessageThemeData(
reactionsBackgroundColor: Colors.red,
reactionsBorderColor: Colors.redAccent,
reactionsMaskColor: Colors.pink,
),
```
### Changing Message Actions
When a message is long pressed, the `MessageActionsModal` is shown.
The `MessageWidget` allows showing or hiding some options if you so choose.
```dart
MessageWidget(
...
this.showUsername = true,
this.showTimestamp = true,
this.showReactions = true,
this.showDeleteMessage = true,
this.showEditMessage = true,
this.showReplyMessage = true,
this.showThreadReplyMessage = true,
this.showResendMessage = true,
this.showCopyMessage = true,
this.showFlagButton = true,
this.showPinButton = true,
this.showPinHighlight = true,
),
```
### Building attachments
The `customAttachmentBuilder` property allows you to build any kind of attachment (inbuilt or custom)
in your own way. While a separate guide is written for this, it is included here because of relevance.
```dart
MessageListView(
messageBuilder: (context, details, messages, defaultMessage) {
return defaultMessage.copyWith(
customAttachmentBuilders: {
'location': (context, message, attachments) {
final attachmentWidget = Image.network(
_buildMapAttachment(
attachments[0].extraData['latitude'],
attachments[0].extraData['longitude'],
),
);
return wrapAttachmentWidget(context, attachmentWidget, null, true, BorderRadius.circular(8.0));
}
},
);
},
),
```