# Implement thumbnails for image and video in Flutter SDK

**URL:** <https://community.sendbird.com/t/implement-thumbnails-for-image-and-video-in-flutter-sdk/5102>\
**Category:** Flutter\
**Tags:** chatsdk\
**Created:** [July 19, 2022, 9:19am UTC](https://community.sendbird.com/t/implement-thumbnails-for-image-and-video-in-flutter-sdk/5102 "2022-07-19T09:19:24Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![Ashutosh\_Kumar](https://sea2.discourse-cdn.com/flex020/user_avatar/community.sendbird.com/ashutosh_kumar/32/2281_2.png) [@Ashutosh\_Kumar](https://community.sendbird.com/u/Ashutosh_Kumar)\
**Post date:** [July 19, 2022, 9:19am UTC](https://community.sendbird.com/t/implement-thumbnails-for-image-and-video-in-flutter-sdk/5102/1 "2022-07-19T09:19:24Z")

</div>

I want to show thumbnails of images sent from chat over SendBird Flutter native app code.  
Here is the sample code , But we are able to find any option to implement this.

final preMessage =  
channel.sendFileMessage(params, onCompleted: (msg, error) {  
final index =  
\_messages.indexWhere((element) =\> element.requestId == msg.requestId);  
if (index != -1) \_messages.removeAt(index);  
\_messages = [msg, …\_messages];  
\_messages.sort((a, b) =\> b.createdAt.compareTo(a.createdAt));  
markAsReadDebounce();  
log(‘Disposed Value== \>\> $isDisposed’);  
if (!isDisposed) notifyListeners();  
});  
sendFileMessage has no any parameter for thumbnails.

---

<div class="post-metadata">

**Author:** ![Tyler](https://sea2.discourse-cdn.com/flex020/user_avatar/community.sendbird.com/tyler/32/810_2.png) [@Tyler](https://community.sendbird.com/u/Tyler)\
**Post date:** [July 19, 2022, 11:16pm UTC](https://community.sendbird.com/t/implement-thumbnails-for-image-and-video-in-flutter-sdk/5102/2 "2022-07-19T23:16:52Z")

</div>

Hey @Ashutosh_Kumar,

Welcome to the Sendbird Community.

Are you looking to pass in already generated thumbnail files, sizes or urls? I do see that it does not appear to be included in the `fileMessageParams` but just want to understand what you’re looking to pass to us.

---

<div class="post-metadata">

**Author:** ![Ashutosh\_Kumar](https://sea2.discourse-cdn.com/flex020/user_avatar/community.sendbird.com/ashutosh_kumar/32/2281_2.png) [@Ashutosh\_Kumar](https://community.sendbird.com/u/Ashutosh_Kumar)\
**Post date:** [July 20, 2022, 4:03am UTC](https://community.sendbird.com/t/implement-thumbnails-for-image-and-video-in-flutter-sdk/5102/3 "2022-07-20T04:03:57Z")

</div>

Now i am able to set thumbnails size in onSendFileMessage() and getting the thumbnails in loadMessages() using this code :\_messages[0].toJson()[‘thumbnails’]

and getting : [{url: [https://file-ap-8.sendbird.com/0bf57ccd3e6d4e7daf3c232be67e5881.jpe](https://file-ap-8.sendbird.com/0bf57ccd3e6d4e7daf3c232be67e5881.jpe), plain\_url: null, height: 400.0, width: 400.0, real\_height: 225.0, real\_width: 400.0}]

Now , I have to implement onTap() on image and view in full screen.Pls help me out.

---

<div class="post-metadata">

**Author:** ![Tyler](https://sea2.discourse-cdn.com/flex020/user_avatar/community.sendbird.com/tyler/32/810_2.png) [@Tyler](https://community.sendbird.com/u/Tyler)\
**Post date:** [July 20, 2022, 5:56am UTC](https://community.sendbird.com/t/implement-thumbnails-for-image-and-video-in-flutter-sdk/5102/4 "2022-07-20T05:56:55Z")

</div>

Hi @Ashutosh_Kumar,

`onTap()` would be a UI specific inquiry and falls outside the scope of Sendbird. You would need to implement this on your own.

---

<div class="post-metadata">

**Author:** ![Dhaiyurkumar\_Makavana](https://sea2.discourse-cdn.com/flex020/user_avatar/community.sendbird.com/dhaiyurkumar_makavana/32/3183_2.png) [@Dhaiyurkumar\_Makavana](https://community.sendbird.com/u/Dhaiyurkumar_Makavana)\
**Post date:** [October 17, 2022, 12:11pm UTC](https://community.sendbird.com/t/implement-thumbnails-for-image-and-video-in-flutter-sdk/5102/5 "2022-10-17T12:11:02Z")

</div>

@Tyler i am not getting thumbnail in reply messages. check below screenshot for reference.

 ![Screen Shot 2022-10-17 at 5.37.55 PM](https://us1.discourse-cdn.com/flex020/uploads/sendbird/original/2X/f/fc198c2618228ca1053b93b888512da3ecddfd1a.png)

---

<div class="post-metadata">

**Author:** ![Maryam\_Zia](https://sea2.discourse-cdn.com/flex020/user_avatar/community.sendbird.com/maryam_zia/32/1938_2.png) [@Maryam\_Zia](https://community.sendbird.com/u/Maryam_Zia)\
**Post date:** [November 11, 2022, 7:32am UTC](https://community.sendbird.com/t/implement-thumbnails-for-image-and-video-in-flutter-sdk/5102/6 "2022-11-11T07:32:08Z")

</div>

Did you found any solution? i am getting same issue

---

<div class="post-metadata">

**Author:** ![Maryam\_Zia](https://sea2.discourse-cdn.com/flex020/user_avatar/community.sendbird.com/maryam_zia/32/1938_2.png) [@Maryam\_Zia](https://community.sendbird.com/u/Maryam_Zia)\
**Post date:** [November 11, 2022, 7:32am UTC](https://community.sendbird.com/t/implement-thumbnails-for-image-and-video-in-flutter-sdk/5102/7 "2022-11-11T07:32:54Z")

</div>

@Tyler kindly advice