[FREE] Custom List View - An Extension for making Image and text list view with a lot of customization

I haven’t published the extension on AI2 yet. I think it would require some libs work then it should work on AI2. I will publish the extension soon. You should wait for it.

4 Likes

ListView changed a lot in MIT App Inventor and we are awaiting next releases to fix bugs

Read updated documentation for the ListView

2 Likes

Fortunately this is possible with upcoming release.

3 Likes

Great :fire::fire::fire:

Blow Your Mind Wow GIF by Product Hunt

4 Likes

Awesome work once again. Thanks. Are you planning to add search in listview to the extension?

Version 2

What’s New

  • Image will be loaded own in the extension with Universal Image loader library. But still you can use older method for loading images with extension and Image utility component

  • Divider Color property has been added now

  • Divider Height is also added.

  • You can set background color of specific item with position.

  • You can set margin and paddings of specific item with position.

  • You can customise the divider for specific position.

Bug Fixes

  • Divider was not seeing on items that is now fixed.

Changes

  • Extension has renamed to CustomListView from ListView as it was causing error while dragging the list view component. It may break your whole blocks. So kindly make a backup of the older project please. It was necesary to change the extension name.

  • Extension has increased from 40kb to 130kb due to extra features and own image loading libary.

  • LoadImage event would only occurred when LoadImage property is not enabed.

Blocks Added

component_method (6)

Set the background color of the specific item with position.

component_method (7)

Set the divider properties of the specific item with position.leftMargin and rightMargin are deprecated currently. It would not work in all cases.

component_method (8)

Set the margin of the item for specific item with position. margins parameter accepts a string that contains four values joined by commas. For ex, 2,4,7,5 .

component_method (9)

Set the padding of the item for specific item with position. paddings parameter accepts a string that contains four values joined by commas. For ex, 2,4,7,5 .

Properties Added

image

Updated Extension

Download AIX

Kindly update the extension in order to get latest features. But make sure to read above changes closely please.

Thanks @clellisroccs for their suggestions.
Thanks @Henry for your donation :smiley:

Thank you all for using my extension. Download link got 60 clicks in only 2 days of publication. Very happy to see this. I hope you’re enjoying the extension 🥲

Thank you
Sumit​:wink:

9 Likes

No. I think you should go with custom search bar as you can modify and make it according to your needs.
Many guides are available for making search bar. You should search on community.
One is here

4 Likes

Keep up your very good work, dear Sumit1334 !
Very nice extension,
Thanks a lot for the update !

2 Likes

This is wonderful, thanks Sumit!

2 Likes

Thank you my friend, excelent job.

2 Likes

I Saw This Topic Late But This Extension Is Nice

1 Like

Another good extension from Sumit. Really thank you for your contribution to Kodular. At every stage we are all getting benefit of you and making work simpler… :+1: :+1: :+1: :heart:

(Is there anyway to shffle the list items upon clicking a button with this extension?)

1 Like

Sumit? :sweat_smile:

There is no direct way to shuffle items. However, There are blocks to move and update item. You can easily shuffle the items with the help of them.


I am confused why people still downloading older version when new version is better. :neutral_face:

6 Likes

Hi everyone
I was using Colin Tree list view extension before this, but in my application I have to show many users and my phone hangs when I load a lot of data in Colin tree, But when I get to know that @Sumit1334 has made a fantastic extension then I tired to use it. I found a lot of advantages in this

  1. Loading Image in couple of seconds

  2. Working very smoothly in low to low end device

  3. Cropping image to circle

And to be frank I tired to make a list of 3000 users to check this extension’s working. And I was shocked to see that in a second all 3000 users were loaded
I really thanx @Sumit1334 for making this kind of great extension.

4 Likes

Hi
I can’t get it to display my images in the list. Can you show me how?

Here’s my blocks and sample aia…

testListViewExt01.aia (277.3 KB)

blocks

If you have a list with images, where you had put folder.jpg you have put the list of images. Try it.

Sorry I don’t quite understand. So under image it should be a list?

To display the images from assets or storage you must use image utility component on LoadImage event. Uncheck the LoadImage property and then use LoadImage event as example posted above with image utility component. Give the file name(if present in assets) or file path(if in storage) to image utility component.

2 Likes

Hi
Okay, thank you I will try it out.

Sumit your extension is awesome:star_struck:

I would like to suggest you a feature: with your extension we can swipe the items left or right and this is great, but how can we know if users know that they can do it? I mean, you can implement an animation that swipe an item a little and then it returns in normal position, so users realize it.

Ask me any questions if I haven’t explain well…:sweat_smile: