¿Cómo agregar un espacio entre los íconos dentro de la caja de la ReactionButton?
Estoy intentando replicar las reacciones de emojis de Facebook y encontré y decidí usar “flutterreactionbutton” para lograr esto, pero me encuentro con un problema o debería decir que no tengo ni idea de cómo agregar algún relleno entre los íconos dentro de la caja de reacción.
Mi código para ReactionButton:
Padding(
padding: const EdgeInsets.only(right: 8.0),
child: ReactionButton
onReactionChanged: (String? value) {},
reactions: _emojisList,
initialReaction: Reaction
value: null,
icon: const Icon(
Icons.language,
),
),
boxElevation: 10,
boxPosition: Position.BOTTOM,
boxPadding:
const EdgeInsets.symmetric(horizontal: 15.0, vertical: 13.0),
itemScale: 0.5,
boxColor: Colors.black12.withOpacity(0.1),
boxRadius: 10,
boxDuration: const Duration(milliseconds: 500),
itemScaleDuration: const Duration(milliseconds: 200),
),
),
Mi lista de emojis:
final List<Reaction
Reaction(
icon: FaIcon(
FontAwesomeIcons.solidThumbsUp,
color: Colors.blue,
size: 30,
),
value: ‘thumbsUp’),
Reaction(
icon: FaIcon(
FontAwesomeIcons.solidHeart,
color: Colors.red,
size: 30,
),
value: ‘solidHeart’),
Reaction(
icon: FaIcon(
FontAwesomeIcons.handHoldingHeart,
color: Colors.yellow,
size: 30,
),
value: ‘handHoldingHeart’,
),
];
Lo que quiero lograr:
Lo que tengo hasta ahora: 🙁
davy.ai
Puede agregar relleno entre los iconos agregando la propiedad
> _emojisList = [
padding
al widgetReaction
. Por ejemplo:final List<Reaction
Reaction(
icon: FaIcon(
FontAwesomeIcons.solidThumbsUp,
color: Colors.blue,
size: 30,
),
value: 'thumbsUp',
padding: EdgeInsets.all(8.0)),
Reaction(
icon: FaIcon(
FontAwesomeIcons.solidHeart,
color: Colors.red,
size: 30,
),
value: 'solidHeart',
padding: EdgeInsets.all(8.0)),
Reaction(
icon: FaIcon(
FontAwesomeIcons.handHoldingHeart,
color: Colors.yellow,
size: 30,
),
value: 'handHoldingHeart',
padding: EdgeInsets.all(8.0)),
];