Collection Item Bind To It's Index

I think it’d be really nice to be able to expose the index number to a collection item for binding.

What will this allow you to do? Here’s a few examples

  • ALTERNATING COLORS OF ROWS: Bind the visibility or opacity of a rectangle in the collection item to it’s own index. Use a customer converter that makes a change based on whether the index is even or odd. And poof! You have alternating colors for your rows.

  • SHOW THE INDEX NUMBER to the user. Ex: Question number, photo number, record number, etc.

  • SHOW ICONS/TAGS BASEDON INDEX NUMBER: You can customize items to show based on their record index. For example, bind an icon to the index, and have it only shown at the 3rd item. Or as users add items to a shopping list, it shows different icons for each item they add.

Now, you may ask - why not just create an index field in your data? Well there’s a huge problem with that, primarily if your data changes. Most databases will not re-number your index if the user decides to add or remove records on the data. Therefore, for dynamic databases, an index field isn’t that useful. For example, if you have a directory of 10 people, and a staff member is removed at record #2 and a new one is added at the end. Then all of a sudden the record number will show 1,3,4,5…11 Any of your bindings in relation to record 2 will be broken, nothing will happen for record 11…even though there’s still only 10 records total.

So binding to the index number can be a really helpful thing. It’s already there…Intuiface shows it, but it’s not exposed to binding dynamically.

You know how there’s a property called “index in focus”? Let’s add one called “Index of Item”!

Let me know if you agree:

  • Nah, don’t need it.

0 voters

By the way, just to give a little context to alternating rows, you’d just make a regular colored rectangled in your collection item.

You’d bind the visibility of that rectangle to the ‘index of item’ of the collection, and use the following custom converter to check whether the index number is odd or even:
if(INPUT % 2 == 0)

This will make every OTHER rectangle show, thereby giving you alternating colored rows.

With this, it would be good to have the length of the collection as well. I have wanted to alter a view based on the amount of data.

1 Like

Hi @steve,
This is already possible, and I do it all the time. You can bind to the Total Records of any data feed, whether it’s from Excel or an API.

I often use that binding to make dynamic adjustments to the interaction based on number of records. For example, if I know that only 5 records fit in the visible space, when the number of records is greater than 5, I’ll have touch gestures appear to signify there’s more content to be viewed.


Thanks for responding. I would love to know where that property is, as I have not found anything like that that I can bind to. I know the API Explorer knows how long the record set is, since it lists X of Y at the top of the results window, but I have not found where I can tap into it.

Any help is appreciated. Thanks!

Hi @steve,
When you click the X-ray icon in your IA panel on the left side, you should see the total records property to bind to. See screenshot:


That is interesting, because I do not have that property in the X-Ray window for anything from Airtable. It just has the records property. If I look at an Excel-based data set, I do get “Number of Rows” property.

My assumption is that the screen grab you provided was not using Airtable for the data.

I have asked Seb about this before and here is his response: “Unfortunately, Airtable response feed doesn’t include a field with the number of items in the collection, as we have the Number of rows available on an Interface Asset for example.”

My work-around has been to create a formula in Airtable that counts the correct amount of results based on certain fields in the data and then pull that number in to Intuiface.

Oh, interesting. I don’t use Airtable, so I didn’t realize that. I find it odd that the number of records doesn’t come through their API. Good to hear you have a work-around for it, sorry my info wasn’t that helpful in this case.

@AlexB, I confirm Airable doesn’t have that field in the results feed they provide with their APIs.
Using filters to compute is a workaround, adding a very lightweight looping collection (carousel), calling “previous” action on it and looking at its index in focus is another one.

1 Like