Unanswered

Expand/Collapse Gallery from right to left

(0) Share

Report

Posted on by akbarmahfuzalam

709

I have a gallery (GalUpdates) and want to expand and collapse with a click of a button. And it should be expand in the Right to Left direction and Collapse left to right when button clicked.

How would I achieve that, help is appreciated

Categories:

Building Power Apps

I have the same question (0)

All responses (4)

Answers (0)

Sort by

MVP-Phipps 3,521 Super User 2024 Season 1 on at

Like (1)

Report
Copy link

Link copied!

Hi @akbarmahfuzalam , you will find an example in the PowerApps Creator Kit:

Essentially make the rest of the page transparent and act like you have a pane window is what you are trying to achieve? Like the above picture? If so please have a look at the Creator Kit.

Please Accept as Solution if it solves your question. Or just give it a Thumbs Up if it is helpful as can help others.
LinkedIn: https://www.linkedin.com/in/charlie-phipps-%F0%9F%91%A8%E2%80%8D%F0%9F%92%BB-91338715b/
YouTube: https://www.youtube.com/channel/UChmFBGU1YKIU91sNMQ7buGg
Twitter: https://twitter.com/phipps0218

Was this reply helpful? Yes No
akbarmahfuzalam 709 on at

Like (1)

Report
Copy link

Link copied!

@phipps0218
Thanks for your prompt reply, but unfortunately this is not what I wanted.
I want to click a button, And then the Galley need to start expanding from Right to Left and again when button click, it need to collapse from left to right.

Was this reply helpful? Yes No
v-jefferni Microsoft Employee on at

Like (1)

Report
Copy link

Link copied!
Hi @akbarmahfuzalam ,

Nice thought, and I managed to create a demo for your reference:

Is above what you need?

If so, steps are as follows:

1. Add a Vertical Container, cut your Gallery and paste into the Container.

2. Add one Button, 2 Timer controls.

3. OnVisible of the Screen:

UpdateContext({'E/C':true,TimerStart1:false, TimerStart2:false})

4. Duration of the two Timers set to 1000 or how long/quick will you like the Gallery being expanded/collapsed.

5. OnTimerStart of Timer1 to as below and vise versa.

Reset(Timer2)

6. Start of Timer1 to TimerStart1, Timer2 to TimerStart2

7. Width of Container:

If(!TimerStart1 && !TimerStart2, 650, If('E/C', 650*(Timer3.Value/Timer3.Duration), 650*((1000-Timer1.Value)/Timer1.Duration) ))

650 is the default width of the Container, change to what you want.

8. OnSelect of Button:

UpdateContext({'E/C':!'E/C', TimerStart1: If('E/C', true, false), TimerStart2: If('E/C', false, true)})

9. After everything tested fine, set Visible of the two Timers to false to hide them.

Best regards,

Was this reply helpful? Yes No
akbarmahfuzalam 709 on at

Like (0)

Report
Copy link

Link copied!

@v-jefferni
Will definitely give a try as per your solution.
Thanks a ton

Was this reply helpful? Yes No