cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
Highlighted
HallieG
Level: Powered On

Next & Back buttons to move through Gallery Records

Hi

I can't find a solution for this. I want a gallery that shows large pictures (1 at a time) and I would like the ability to add a Next button to move to the next gallery record (then this record is selected). Can anyone please explain how to do that?

 

Please let me know if you need more explanation. 

1 ACCEPTED SOLUTION

Accepted Solutions
Community Support Team
Community Support Team

Re: Next & Back buttons to move through Gallery Records

Hi @HallieG,

Could you please share a bit more about your large pictures data source?

I have made a test on my side, I think the Blank horizontal Gallery and a Image control (add a Image control within the Gallery control) could achieve your needs. Please take a try with the following workaround:
I have created a SP library on my side, which consists of many images files. The data structure as below:11.JPGApp's configuration:

8.JPG

 

9.JPG

 

10.JPG

Set the OnVisible property of the first screen of your app to following:

Set(StepIndex,1);ClearCollect(CurrentImage,First(MyLibrary1))

Set the Items property of the Gallery control to following:

CurrentImage

Set the Image property of the Image control within the Gallery to following:

ThisItem.'Link to item'

Set the OnSelect property of the "Prev" button to following:

Set(StepIndex,StepIndex-1);
ClearCollect(CurrentImage,Last(FirstN(MyLibrary1,StepIndex)))

Set the OnSelect property of the "Next" button to following:

Set(StepIndex,StepIndex+1);
ClearCollect(CurrentImage,Last(FirstN(MyLibrary1,StepIndex)))

The GIF screenshot as below:Test1.gif

 

 

Best regards,

Kris

Community Support Team _ Kris Dai
If this post helps, then please consider Accept it as the solution to help the other members find it more quickly.
4 REPLIES 4
OneThing
Level 8

Re: Next & Back buttons to move through Gallery Records

Hi @HallieG

 

The new Screen templates has a Tutorial Screen which contains most of the code you need to achieve this.Capture2.PNG

The long and the short of it is you need a variable to hold the index(number) of the current image. Arrow buttons which will increase or decrease the index, and the gallery using this index to decide which image to show.

 

If you need more help than this just let me know, but I think you learn more by playing around first.

 

Thanks,

Nicky

Super User
Super User

Re: Next & Back buttons to move through Gallery Records

Hi @HallieG,

To accomplish your goal you would use two built in gallery properties. Show Navigation and Navigation step.  Click on the gallery and in the dropdown on the left upper select the Show Navigation property and set it to true.  Then select the Navigation Step property and set it to 1.  ^ marks will appear on the top and bottom of the gallery. Clicking on them will advance the gallery by 1 step.  If this answers your question please mark the thread as solved.

 

*After reviewing @OneThing's suggestion, it is far better than this one.  
Capture.PNG

 

Community Support Team
Community Support Team

Re: Next & Back buttons to move through Gallery Records

Hi @HallieG,

Could you please share a bit more about your large pictures data source?

I have made a test on my side, I think the Blank horizontal Gallery and a Image control (add a Image control within the Gallery control) could achieve your needs. Please take a try with the following workaround:
I have created a SP library on my side, which consists of many images files. The data structure as below:11.JPGApp's configuration:

8.JPG

 

9.JPG

 

10.JPG

Set the OnVisible property of the first screen of your app to following:

Set(StepIndex,1);ClearCollect(CurrentImage,First(MyLibrary1))

Set the Items property of the Gallery control to following:

CurrentImage

Set the Image property of the Image control within the Gallery to following:

ThisItem.'Link to item'

Set the OnSelect property of the "Prev" button to following:

Set(StepIndex,StepIndex-1);
ClearCollect(CurrentImage,Last(FirstN(MyLibrary1,StepIndex)))

Set the OnSelect property of the "Next" button to following:

Set(StepIndex,StepIndex+1);
ClearCollect(CurrentImage,Last(FirstN(MyLibrary1,StepIndex)))

The GIF screenshot as below:Test1.gif

 

 

Best regards,

Kris

Community Support Team _ Kris Dai
If this post helps, then please consider Accept it as the solution to help the other members find it more quickly.
HallieG
Level: Powered On

Re: Next & Back buttons to move through Gallery Records

Thank you, that solution worked perfectly!! 

Helpful resources

Announcements
firstImage

Watch Sessions On Demand!

Continue your learning in our online communities.

SecondImage

PowerApps Monthly Community Call

Next Wednesday, August 21st at 8am PDT

Top Community Contributors for July 2019

Top Community Contributors for July 2019

Let's thank our top community contributors

Power Platform 2019 release wave 2 plan

Power Platform 2019 release wave 2 plan

Features releasing from October 2019 through March 2020

FirstImage

Power Platform World Tour

Coming to a city near you

thirdimage

PowerApps Community User Group Member Badge

Fill out a quick form to claim your user group badge now!

FourthImage

Join PowerApps User Group!!

Connect, share, and learn with your peers year-round

FifthImage

Dynamics 365 and Power Platform April 2019 Release notes

Features releasing from April 2019 through September 2019!

SixthImage

Power Summit Australia 2019

August 20-23rd 2019

Users Online
Currently online: 99 members 3,702 guests
Please welcome our newest community members: