flutter_chat_ui icon indicating copy to clipboard operation
flutter_chat_ui copied to clipboard

Feat/text in other types

Open nicolasbraun opened this issue 6 months ago • 1 comments

[!IMPORTANT]
This code is build on top of PR #814

Attemp to address #826

  • [x] FileMessages
  • [x] ImageMessages
  • Does not seem relevant for other types

Notes on Render of images

I'm not perfectly happy with the rendering of the ImageMessage ones: if the text is longer than the image then we end up with space around the image (see screenshot below). But since the main bubble width is unconstraint and i did not want to rely on IntrinsicWidth to constraint the text width to the image one I see no other solution.

image

sidenote

Most messages UI widget now share quite a lot of logic. I wonder if they should not all rely on a utility package that would expose the main "Stack + Column" builder, time and status, and maybe the style resolvers

nicolasbraun avatar Jul 04 '25 09:07 nicolasbraun

I think this is now ok.

A bit more regarding the layout for images.

  final Widget content = Column(
      mainAxisSize: MainAxisSize.min,
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        if (widget.topWidgets != null) ...widget.topWidgets!,
        Flexible(
          child: imageContent
        ),

Caused the image to be aligned start when the text was too big.

I tried Center or Align but this caused the image to have space around it, even when there was no text.

I opted for:

  final Widget content = Column(
      final Widget content = Column(
      mainAxisSize: MainAxisSize.min,
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        if (widget.topWidgets != null) ...widget.topWidgets!,
        Flexible(
          child:
              widget.message.text != null
                  ? Row(
                    mainAxisSize: MainAxisSize.max,
                    children: [Expanded(child: imageContent)],
                  )
                  : imageContent,
        ),

which works well but it will also cause the bubble to expand to the max constrained with of the parent column when there is a text, no matter the text lenght or image dimension.

Could not think of something better, maybe you will :)

nicolasbraun avatar Jul 04 '25 12:07 nicolasbraun