cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
Highlighted
Helper I
Helper I

adding forward backward image navigation

Hi,

 

Appreciate a quick help on setting up the forward/backward button on the popup images from the Gallery so that users can keep on navigating the zoomed images by click the forward/back button instead of clicking each and every images in the gallery to view them in zoom mode

6 REPLIES 6
Highlighted
Community Champion
Community Champion

Re: adding forward backward image navigation

Hi @shoebwk ,

 

May I know more about requirements because this you can achieve with Gallery webpart in SPO.


I hope this resolved your issue if you see any challenge/need further help please let me know I am always happy to do it for my community.

Regards,
Krishna
If this post helps you give a 👍 and if it solved your issue consider Accept it as the solution to help the other members find it more.

Highlighted
Helper I
Helper I

Re: adding forward backward image navigation

Hi Krishna,

 

I have a gallery with multiple images, clicking any of the images bring up a zoom version (Thumbnail.large). then to zoom another image i have to close the zoom window, click the image in the gallery and second images popsup. Just to make the navigation of this images smoother for users, I want to give user option to click on the forward/backward button in the zoom window to browse all the images from gallery.

I hope i was clear in my requirements.

please check this website to understand what I want to achieve

https://www.audi-mediacenter.com/en/audi-a4-24

 

Highlighted
Community Champion
Community Champion

Re: adding forward backward image navigation

Hi @shoebwk ,

 

See this below article that should help you:
https://microsoft-bitools.blogspot.com/2020/03/power-apps-get-next-item-from-gallery.html

 
 

PowerAppsNext05.gif
I hope this resolved your issue if you see any challenge/need further help please let me know I am always happy to do it for my community.

Regards,
Krishna
If this post helps you give a 👍 and if it solved your issue consider Accept it as the solution to help the other members find it more.

 

Highlighted
Helper III
Helper III

Re: adding forward backward image navigation

@shoebwk probably you can try Horizontal Gallery with Images instead of Vertical Navigation 

Highlighted
Community Champion
Community Champion

Re: adding forward backward image navigation

Hi @shoebwk ,

 

You can do this:

Add the images into your media if you want them as part of the App. Browse and add each one and note its name.

Create an Image control.

Add navigation arrows and/or navigation bubbles.

Use the actions of the navigation controls to "rotate" (choose the next or previous) the image in the control.

You could set an easy collection with the images and then keep a pointer to current.

 

Here is what I have done:

 

Someplace...OnVisible or other place:

  Collect(imgList,
             {img:imgName1, order:1},
             {img:imgName2, order:2},

             {img:imgName3, order:3});
  UpdateContext{currentImg:1})

 

 

In your image control Image property:

  Lookup(imgList, order=currentImg).Img

 

In your right arrow navigation:

  UpdateContext({currentImg:If(currentImg=Max(imgList, order), 1, currentImg+1)})

 

In your left arror navigation:

  UpdateContext({currentImg:If(currentImg=1, Max(imgs, order), currentImg-1)})

See the below original thread which shows this code:
https://powerusers.microsoft.com/t5/Building-Power-Apps/How-to-add-an-image-carousel/td-p/236172


I hope this resolved your issue if you see any challenge/need further help please let me know I am always happy to do it for my community.

Regards,
Krishna
If this post helps you give a 👍 and if it solved your issue consider Accept it as the solution to help the other members find it more.

Highlighted
Community Champion
Community Champion

Re: adding forward backward image navigation

Hi @shoebwk,

 

I just want to follow up with you on this issue to see is it resolved or still you see any challenges.

If you see any challenge/need further help let me know I am always happy to help.

Regards,
Krishna
If this post helps give a 👍 and if it solved your issue consider Accept it as the solution to help the other members find it more

Helpful resources

Announcements
August 2020 Community Challenge: Can You Solve These?

August 2020 Community Challenge: Can You Solve These?

We're excited to announce our first cross-community 'Can You Solve These?' challenge!

secondImage

Return to Workplace

Reopen responsibly, monitor intelligently, and protect continuously with solutions for a safer work environment.

secondImage

Super Users Coming in August

We are excited for the next Super User season.

secondImage

Community User Group Member Badges

FIll out a quick form to claim your community user group member badge today!

secondImage

Power Platform 2020 release wave 2 plan

Features releasing from October 2020 through March 2021

Top Solution Authors
Top Kudoed Authors
Users online (8,046)