Skip to content

Conversation

nicolasbraun
Copy link
Contributor

Motivation

The goal is to create a widget to display several image in a grid like / staggered view.

Research

  • WhatsApp does not provide it , it creates one message per image, pretty annoying
  • Signal provides several layouts up to 5 messages then add a +X mention
  • Telegram provides layouts up to 10, then splits in several message

Solution

I could do it with a custom message but it seems interesting to provide it in the library, either in flyer_chat_image_message or in another package (see discussion below).

For the moment I opted for the first solution.

Model

For the moment i just use N time the message parameter for demo purposes but we need to decide how this widget is used.

  • Opt1: this is just UI, it will take as param List of the necessary parameters and the user has to use a CustomMessage to store this on the backend.
  • Opt2: We create a new message model MultiImagesMessage
  • Opt3: We update the ImageMessage model to take either unitary param or lists (we can also force list and override fromJson for retrocompatibility (note maybe the customImageProvider should be a Function(String source) to avoid passing a List

Notes

  • I currently kept the unitary widget but the new code works well with only one image. Depending on how we decide to pass parameters we could use a unique widget.
  • I wonder if this would be possible to mix images and videos, that would be awesome, but in terms of model i'm not sure. They are not too different. Maybe the sourceextension` could determine what to display.
  • Sadly I do not see how to maybe expose to the user the "extra" on tap, or the tap on a specific image since the tap is handled at the ChatMessage level

Screenshots

Simulator Screenshot - iPhone 16 Pro Max - 2025-06-02 at 19 41 13
Simulator Screenshot - iPhone 16 Pro Max - 2025-06-02 at 19 41 04
Simulator Screenshot - iPhone 16 Pro Max - 2025-06-02 at 19 40 53
Simulator Screenshot - iPhone 16 Pro Max - 2025-06-02 at 19 40 47
Simulator Screenshot - iPhone 16 Pro Max - 2025-06-02 at 19 40 37
Simulator Screenshot - iPhone 16 Pro Max - 2025-06-02 at 19 40 04

@nicolasbraun nicolasbraun marked this pull request as draft June 9, 2025 07:44
@adar2378
Copy link
Contributor

Hey nice work <3 Is it ready to merge @nicolasbraun ?

@nicolasbraun
Copy link
Contributor Author

nicolasbraun commented Jun 26, 2025 via email

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants