fix reactions overflowing the screen

This commit is contained in:
Salvatore Giordano
2020-10-27 16:15:50 +01:00
parent 58511e8f4b
commit e8411d3aa4
4 changed files with 71 additions and 63 deletions
+10 -3
View File
@@ -62,7 +62,9 @@ class MessageActionsModal extends StatelessWidget {
),
),
),
Column(
Padding(
padding: const EdgeInsets.symmetric(vertical: 8.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
@@ -75,7 +77,7 @@ class MessageActionsModal extends StatelessWidget {
messageTheme: messageTheme,
),
),
AbsorbPointer(
IgnorePointer(
child: MessageWidget(
key: Key('MessageWidget'),
reverse: reverse,
@@ -99,7 +101,8 @@ class MessageActionsModal extends StatelessWidget {
SizedBox(
height: 8,
),
Padding(
Flexible(
child: Padding(
padding: const EdgeInsets.symmetric(
horizontal: 48.0,
),
@@ -108,6 +111,7 @@ class MessageActionsModal extends StatelessWidget {
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(16),
),
child: SingleChildScrollView(
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: ListTile.divideTiles(
@@ -125,9 +129,12 @@ class MessageActionsModal extends StatelessWidget {
).toList(),
),
),
),
),
)
],
),
),
],
);
}
+1 -1
View File
@@ -68,7 +68,7 @@ class MessageReactionsModal extends StatelessWidget {
messageTheme: messageTheme,
),
),
AbsorbPointer(
IgnorePointer(
child: MessageWidget(
key: Key('MessageWidget'),
reverse: reverse,
+1 -1
View File
@@ -387,7 +387,7 @@ class _MessageWidgetState extends State<MessageWidget> {
) {
final ownId = StreamChat.of(context).user.id;
final reactionsMap = <String, Reaction>{};
widget.message.latestReactions.forEach((element) {
widget.message.latestReactions?.forEach((element) {
if (!reactionsMap.containsKey(element.type) || element.user.id == ownId) {
reactionsMap[element.type] = element;
}
+2 -1
View File
@@ -26,6 +26,7 @@ class ReactionBubble extends StatelessWidget {
@override
Widget build(BuildContext context) {
final reactionIcons = StreamChatTheme.of(context).reactionIcons;
final offset = reactions.length > 1 ? 16.0 : 2.0;
return Transform(
transform: Matrix4.rotationY(reverse ? pi : 0),
alignment: Alignment.center,
@@ -33,7 +34,7 @@ class ReactionBubble extends StatelessWidget {
alignment: Alignment.center,
children: [
Transform.translate(
offset: Offset(reverse ? 2 : -2, 0),
offset: Offset(reverse ? offset : -offset, 0),
child: Container(
padding: const EdgeInsets.symmetric(vertical: 4),
decoration: BoxDecoration(