rfac: Alignment of messages and reaction bubbles

This commit is contained in:
Deven Joshi
2021-05-13 17:19:40 +05:30
parent 485d99ddb4
commit 1767200c39
@@ -56,7 +56,7 @@ class ReactionBubble extends StatelessWidget {
alignment: Alignment.center, alignment: Alignment.center,
children: [ children: [
Transform.translate( Transform.translate(
offset: Offset(reverse ? -offset : offset, 0), offset: Offset(-offset, 0),
child: Container( child: Container(
padding: const EdgeInsets.all(2), padding: const EdgeInsets.all(2),
decoration: BoxDecoration( decoration: BoxDecoration(
@@ -106,7 +106,6 @@ class ReactionBubble extends StatelessWidget {
Positioned( Positioned(
bottom: 2, bottom: 2,
left: reverse ? null : 13, left: reverse ? null : 13,
right: !reverse ? null : 13,
child: _buildReactionsTail(context), child: _buildReactionsTail(context),
), ),
], ],
@@ -160,6 +159,7 @@ class ReactionBubble extends StatelessWidget {
borderColor, borderColor,
maskColor, maskColor,
tailCirclesSpace: tailCirclesSpacing, tailCirclesSpace: tailCirclesSpacing,
flipTail: !flipTail,
), ),
); );
return tail; return tail;
@@ -174,6 +174,7 @@ class ReactionBubblePainter extends CustomPainter {
this.borderColor, this.borderColor,
this.maskColor, { this.maskColor, {
this.tailCirclesSpace = 0, this.tailCirclesSpace = 0,
this.flipTail = false,
}); });
/// Color of bubble /// Color of bubble
@@ -188,6 +189,9 @@ class ReactionBubblePainter extends CustomPainter {
/// Tail circle space /// Tail circle space
final double tailCirclesSpace; final double tailCirclesSpace;
/// Flip tail
final bool flipTail;
@override @override
void paint(Canvas canvas, Size size) { void paint(Canvas canvas, Size size) {
_drawOvalMask(size, canvas); _drawOvalMask(size, canvas);
@@ -211,8 +215,9 @@ class ReactionBubblePainter extends CustomPainter {
final path = Path() final path = Path()
..addOval( ..addOval(
Rect.fromCircle( Rect.fromCircle(
center: center: const Offset(4, 3).mirrorConditionally(flipTail) +
const Offset(4, 3) + Offset(tailCirclesSpace, tailCirclesSpace), Offset(tailCirclesSpace, tailCirclesSpace)
.mirrorConditionally(flipTail),
radius: 4, radius: 4,
), ),
); );
@@ -228,8 +233,9 @@ class ReactionBubblePainter extends CustomPainter {
final path = Path() final path = Path()
..addOval( ..addOval(
Rect.fromCircle( Rect.fromCircle(
center: center: const Offset(4, 3).mirrorConditionally(flipTail) +
const Offset(4, 3) + Offset(tailCirclesSpace, tailCirclesSpace), Offset(tailCirclesSpace, tailCirclesSpace)
.mirrorConditionally(flipTail),
radius: 2, radius: 2,
), ),
); );
@@ -243,7 +249,9 @@ class ReactionBubblePainter extends CustomPainter {
final path = Path() final path = Path()
..addOval(Rect.fromCircle( ..addOval(Rect.fromCircle(
center: const Offset(4, 3) + Offset(tailCirclesSpace, tailCirclesSpace), center: const Offset(4, 3).mirrorConditionally(flipTail) +
Offset(tailCirclesSpace, tailCirclesSpace)
.mirrorConditionally(flipTail),
radius: 2, radius: 2,
)); ));
canvas.drawPath(path, paint); canvas.drawPath(path, paint);
@@ -261,7 +269,7 @@ class ReactionBubblePainter extends CustomPainter {
final path = Path() final path = Path()
..addArc( ..addArc(
Rect.fromCircle( Rect.fromCircle(
center: const Offset(1, dy), center: const Offset(1, dy).mirrorConditionally(flipTail),
radius: 4, radius: 4,
), ),
-pi * startAngle, -pi * startAngle,
@@ -281,7 +289,7 @@ class ReactionBubblePainter extends CustomPainter {
final path = Path() final path = Path()
..addArc( ..addArc(
Rect.fromCircle( Rect.fromCircle(
center: const Offset(1, dy), center: const Offset(1, dy).mirrorConditionally(flipTail),
radius: 4, radius: 4,
), ),
-pi * startAngle, -pi * startAngle,
@@ -302,7 +310,7 @@ class ReactionBubblePainter extends CustomPainter {
final path = Path() final path = Path()
..addArc( ..addArc(
Rect.fromCircle( Rect.fromCircle(
center: const Offset(1, dy), center: const Offset(1, dy).mirrorConditionally(flipTail),
radius: 6, radius: 6,
), ),
-pi * startAngle, -pi * startAngle,
@@ -314,3 +322,10 @@ class ReactionBubblePainter extends CustomPainter {
@override @override
bool shouldRepaint(CustomPainter oldDelegate) => true; bool shouldRepaint(CustomPainter oldDelegate) => true;
} }
/// Extension on [Offset]
extension YTransformer on Offset {
/// Flips x coordinate when flip is true
// ignore: avoid_positional_boolean_parameters
Offset mirrorConditionally(bool flip) => Offset(flip ? -dx : dx, dy);
}