How to make a button select the next item in a gallery list

[mkeller]

I built a very simple app connected to a sharepoint list. There is a gallery that shows each item in the list and form. You can manually select whatever item you want by tapping on the gallery. I want a button that channges the selection to the next item in the list. 

Is this possible? 

[CarlosFigueira]

Today this is not possible; the only way to change the selection of the gallery "programatically" is by using its Default property, but you cannot find the current selected index of the data source to choose the "next" or "previous" one.

Please consider creating a new feature request in the PowerApps Ideas board for this.

[Anonymous]

Hi CarlosFigueira

I am interested in a similar functionality, whereby you can select a gallery item using a button (instead of clicking on the item within the gallery). That is because I want to arrange the buttons in a way that is difficult to replicate via galleries. 

Any way to work with variables, e.g. button OnSelect sets a variable, and gallery selection can be triggered using this variable?

[jvanrossum]

If the prev and next button are on a different (details) page then you could something like this.

[Anonymous]

Did you ever figure this out? This is exactly what I want to do too.

[clove511]

If anyone is still stuck on this, galleries don't hold an index/selected index number, but you can add one to your dataset as an integer column whose purpose is the row number (row_num).

In your Power App, have a Set(RowNumber,1) or UpdateContext({RowNumber:1}) that sets a variable called "RowNumber" to 1.
Wherever you're displaying data, use a Lookup('[Dataset]',row_num=RowNumber).[FieldName] to get your detail from the dataset directly, rather than [Gallery].Selected, where the lookup key is the row number you added.

Then your navigation buttons just increment/decrement the RowNumber variable. Selecting an item from the gallery just sets the variable to Parent.row_num.

[emilj]

Hi there!

I tried the following, simplified solution, and it works like a charm. Do you see any risks in using this formula?

Gallery-OnSelect: 
UpdateContext({varValdBF: ThisItem});;
ClearCollect(
MyProductGalleryBF; Gallerikomponent.AllItems
)

Form- Item : varValdBF

Next Button (on Form)- OnSelect: 
UpdateContext({varValdBF:
First(
Filter(
MyProductGalleryBF;Date> varValdBF.Date))})
;;If (
IsBlank(varValdBF);
UpdateContext(
{
varValdBF:
First(
Filter(
MyProductGalleryBF;Date > varValdBF.Date
))}))

I have sorted the gallery by date column(descending). 

[Jean-Philippevb]

Hi mkeller,

I had a similar issue, but i had the advantage that i already added the row number of my Items (gallery Items property)

these row numbers would update if you would add filters/sort options to the "MyDataSource".

With(

{records: MyDataSource},

ForAll(

Sequence(

CountRows(records)

),
Patch(

Last(

FirstN(records, Value)

),

{RowNumber:Value}

)

)

)

After this i added a button control where I added below function for the OnSelect property:

Select(Gallery, Gallery.Selected.RowNumber + 1)

This does seem to do the trick to me. Reason it seems to work is:

an advantage of having the row number calculated on your gallery is that you can alternate the colors of the rows

by adding below formula on the TemplateFill option of your Gallery

If(

ThisItem.IsSelected,

RGBA(0,38,100,0.2),

If(

Mod(ThisItem.RowNumber,2)=0,

RGBA(219,220,221,0.5),

RGBA(0, 0, 0, 0)

)

)

[JChouinard2016]

I've found another way to do this that seems like a simple solution compared to adding row numbers to your gallery.

Note: (This specific method will only work if you have a list sorted by an ID column. The numbers can be spontaneous, meaning you could have a list like:  [1, 10, 35, 102] and it would still select the next and previous numbers)

If you set the ID of your gallery item in a variable upon selecting the item, this method works. For your edit/display form selected item, you would just use:

LookUp(DataSource, ID = varSelectedID)

In the OnSelect portion of your Gallery:

Set(varSelectedID, ThisItem.ID);

Or

UpdateContext({varSelectedID: ThisItem.ID});

Then, in your next button's OnSelect property: (This selects the next lowest number, the max of all IDs less than the currently selected ID)

Set(varSelectedID, Max(Filter(Gallery.AllItems, ID < varSelectedID), ID));

Or

UpdateContext({varSelectedID: Max(Filter(Gallery.AllItems, ID < varSelectedID), ID)});

And in the previous button's OnSelect property: (This selects the next highest number, the min of all IDs greater than the currently selected ID)

Set(varSelectedID, Min(Filter(Gallery.AllItems, ID > varSelectedID), ID));

Or

UpdateContext({varSelectedID: Min(Filter(Gallery.AllItems, ID > varSelectedID), ID)});

[JCM222]

Hi @Jean-Philippevb ,

I would like to do what you have done here, but I am a relative Newb to PowerApps, and I could not completely follow your example.  I was able to create a collection with the row numbers in it, however my DataSource for the Gallery was a straight sort/filter from a Dataverse Table.   I am in a canvas app and I patch the DB ...and then the gallery reflects the changes.  Can you explain somehow to me how you configured the datasource, how when you filtered it or sorted it that the code updated the gallery ...I see your code here, but I don't know how to implement it.  Any help you can provide would be greatly appreciated.  Do I need the collection?  Or can I work directly witht he gallery?