[PAID] Custom Listview Extension

This extension allows you to add the native ListView of android, also allows you to design items as you can imagine. It is developed to recycle all items, so it will not present problems with lag. Above preview is just an example of what you can do, there are no limitations for design.

VIDEO DEMOSTRATION
VIDEO DEMOSTRATION

Features v1.0

  • Images are loaded with glide so you won’t face problems to load any image into Views.

  • Events as Click and LongClick are perfectly handled.

  • Click event for widgets are handled too.

  • allows the use of custom fonts.

  • Allows the use of custom assets images.

  • Images loading are handled in background processes to keep the ui performance as better as it could be.

  • Allows the edition of items as they are coming visible on screen. So you can make conditions like (if view is in …position… make any action.)

  • Allows you to specify on wich list data you want to work with.

  • Android’s CardView support.

OnBindView

This event is called when an listview’s item is coming visible to screen.

Variables

position: is the view’s position in list

viewPosition: gives the position to find view’s widgets as Buttons, Labels, ImageViews

data: Returns the list data that is linked to the listview, so we can work with them more easily

OnItemClicked

This event is called when an listview’s item is clicked.

Variables

position: is the position of the item in list.

OnItemLongClicked

This event is called when an listview’s item is long clicked.

Variables

position: is the position of the item in list that is being longclicked.

OnRatingBarChanged

This event is called when an RatingBar in a row changes its rating status. (From user)
5

Variables

position: is the view’s position in list
id: is the RatingBar’s id;
rating: specifies the rating change (from 0 to max).

OnItemWidgetClicked

This event is called when a widget inside a list item, (ex: Btutton, Label…) is clicked.

Variables

position: is the position of the item’s widget in list.

id: is the id of the widget that has been clicked.

Add Widgets

These functions adds widgets that will be in each list item.

Common Properties

id: Sets the widget’s id that will be usefull for when we try to edit or make any reference to it.

width: is the width of the widget.

height: Is the height of the widget.

weight: Is the weight that the widget will have inside it’s parent. More Information

orientation: Used in Arrangements, it sets the orientation where arrangements’ items(or widgets) will be ordered. Dedicated blocks: OrientationHorizontal, OrientationVertical, see the properties blocks.

gravity: Used in Arrangements, it sets the location(center, top, bottom) where arrangements’ items(or widgets) will be placed. Dedicated blocks: GravityCenter, GravityLeft, GravityRight

parent: It means where(inside of what::parent) the widget will be. Dedicated blocks: MainParent(see properties blocks) The parent(that is another widget, recomended arrangement or cardview) have to be added before the children.

backgroundColor: As it’s name says it is the color that will be in the background.Dedicated blocks:: DefaultBackgroundColor (see properties blocks.)

margins: It is the space between the widget bounds and any widget next to it(newxt to specified side).

paddings: Used in arrangements, it is the space between arrangement and it’s children. See the usage.

fontTypeface: Used in buttons and Labels, determines the text font that the widget will use.Blocks for this: DefaultTypeface

textColor: Used in Buttons and Labels, determines the color of the text. Dedicated blocks: DefaultTextColor.

textSize: Used in buttons and labels, determinesthe text size.

radius: Used in cardview, determines the radius of cardview’s corners.

elevation: Used in cardviews, determines the elevation of the cardviews, more recommended when you want to show shadows back of cardviews.

image: Used in ImageViews, determines the imageview’s image(located in assets).

maxLines: used in labels, determines the maximum of lines that the label can display.
[NEW]
max(RatingBar): sets the max stars in the ratingbar.
starsColor : sets the stars’ color from the ratingbar.

16

CreateListView

This block is the last that we have to add, it adds a ListView inside an specified container.

Properties

component(Arrangement): is the container where ListView will be placed.

backgroundColor(color): is the background color of the ListView

dividerHeight: is the height of the space(a line) between each listview’s item.

dividerColor: is the color of the divider(explained above).

Edit Widgets

This set of blocks, work just with the “OnBindView” event, this blocks allows edit the widgets in each specified listview item.


15

Common properties

id: is the id of the widget, that was specified in the AddWidgets blocks.

viewPosition: is the position where the widget is placed, in all the ListView, we must get this value just from the OnBindView’s variable, viewPosition.

text: Is the text that will be set in each label and button.

imageSource: is the image url that will be placed in the specified Image.
rating: sets the rating stars in the specified RatingBar.

InitializeItemProperties

Sets the ListView item’s Root Layout(the main layout where widgets will be added) properties. We will refer this main layout as Main Parent. Take care, it wont set the ListView’s properties, for that we have the CreateListView block.

Properties

orientation: sets the orientation to where widgets inside Main Parent will be distributed.

width: is the width of the MainParent.

height: it sets the height of the MainParent.

paddings: it sets the distance between the Main Parent borders and the widgets. This distance could be different for each side we have specified.

gravity: it sets where Main Parent’s widgets(childrens) will be placed. Dedicated blocks: GravityCenter, GravityLeft, GravityRight.

NotifyDataSetChanged

This block updates the ListView, used when list data has been changed and we need to update it.

SetData

Sets the data with wich ListView will be loaded.

SetPlaceHolder

While ImageViews in each ListView’s item are being loaded, an image(placeholder) will be showed in it, when the image specified in EditImage block is ready, the placeholder with be replaced by this.

The image value is the name of the image in assets that we want to set as placeholder.

An example is “alien.png”

SetVisibility

Changes the visibility of the ListView in screen.It requires a boolean(true or false), true for set visible and false to set gone.

ChildCount

Returns the total of visible items in screen.

DefaultBackground

Returns the value to keep widget’s background as default given by android.

DefaultTextColor

Returns the value to keep widget’s text color as default by android.

DefaultTypeface

Returns the value to keep the widget’s font typeface as default.

FillAutomatic

Returns the value to set widget’s params(width and height) to fill its own size.

FillParent

Returns the value to set widget’s params(width and height) to fill its parent(where is placed).

GravityBlocks

This set of blocks returns the value to set the place where arrangement’s widgets will be. Used just in arrangements.

MainParent

Returns the value to reference the Main Parent. It means that if in an AddBlock, in parent we put this property, the widget will be added directly to the MainParent.

OrientationBlocks

Returns the value to set where widget’s in arrangement are directed toward.

[NEW VERSION] 2.0

NEWS

  • Now you can set pictures from assets.
  • Pictures can be cropped circle.
  • Fixed params error.
  • Fixed gravity bug in arrangements.
  • Fixed NotifyDataSetChanged bug.

BLOCKS

Edit image

component_method

  • centerCrop : (true or false) If true, the picture will be centered in the Image.
  • rounded: (true or false) If true, the picture will be a circle.
    Note: You can use them both.

CREATION BLOCKS

  • Added gravity params (Horizontal and vertical), property blocks were created for this params.
  • New Gravity Blocks.

USAGE

  1. Initialize item properties.

  2. Set the Data.

  3. Set Placeholder(optional).

  4. Add widgets.

  5. Create the ListView.

Demo apk
CLICK HERE!

USAGE EXAMPLE


DOWNLOAD

Buy now this extension.
Price: 2$

Extension will be send by email after pay.
Download

12 Likes

Your extention was so good.but need more guidance. How can we added cardview in list.& how can we added label image in cardview

2 Likes

If you want the cardview as a container for every widget, you should add as the same way as to add Arrangement, you can set its parent as “MainParent” then it ll be in the root. And then, when you add a label or ilage specify on parent the cardview id, or better, in cardview add an arrangement (if you wanna set the orientation to horizontal or vertical) and add them to this linear.
You can add widgets directly to the cardview.

Can you show block plz.that will be helpful for everyone

I want to buy this extension with paytm can it possible?? Please reply.

For questions related the purchase of the extension is better to PM the developer.

2 Likes

[UPDATE]

  • Now you can add RatingBars in ListView items.
  • Event added to handle ratingBar’s rating changes.
1 Like

[NEW VERSION] 2.0

NEWS

  • Now you can set pictures from assets.
  • Pictures can be cropped circle.
  • Fixed params error.
  • Fixed gravity bug in arrangements.
  • Fixed NotifyDataSetChanged bug.

BLOCKS

Edit image

component_method

  • centerCrop : (true or false) If true, the picture will be centered in the Image.
  • rounded: (true or false) If true, the picture will be a circle.
    Note: You can use them both.

CREATION BLOCKS

  • Added gravity params (Horizontal and vertical), property blocks were created for this params.
  • New Gravity Blocks.
1 Like

It works with card radius like if we put image in card view then radius will be same or 0?

In deep host extension after putting image in card view card radius automatically changed to 0?

IMG_20200325_232339
IMG_20200325_232222

1 Like

Yes, card radius will affect the image so it will have the same radius as cardview parent. But if you want circle picture, you can use the new edit image block.

1 Like

And image will fit to card size or image stay in own size

Like if take 200x100 size image and we set card 300x150 and put mage inside card so image also expand or stay in original size?

I already tried with dynamic cards and images,images showing original size and it’ll create problems.

1 Like

If you set same size, both card and image, and enable centerCrop in image then it will fit the entire cardview but keeping aspect ratio

1 Like

thanks, I paid for this extension now when I’ll get this?

i tried but not working can you provide blocks for this.
every time when i try to add card view just white screen