Push and Pull not working in Repeaters

Axure RP 8
1

Hi,

I am working on building a component and pattern library for my project, and working on accordion components.

My user flow:

  • I have two examples of accordions opening single panel at a time and multiple panel at a time.
  • I have used repeaters for the accordions.
  • When I click on the 1st accordion (single panel) - I want the entire Base accordion with multiple panels to shift down the page as well.
  • However I am not able to make this work.

View file: https://ob195o.axshare.com

I am attaching reference rp file.
AccordionExpand&Collapse.rp (710.2 KB)

What is the trick to make this work?

Also, is there an easier way to have the right and down arrow to work within the accordion.

2

Hi,

Here an ugly way to do it with Move interaction.
AccordionExpand&Collapse_V2.rp (711.5 KB)

I couldn’t make it work with this messy push/pull feature of Axure.

It would be so good that Axure implement layout on dynamic panel so items align themself (left-top, center, …).
It would make prototyping Fluidity behaviours so easy

Hope it will be a bit useful and that somebody else knows the trick to do that with push/pull

3

Hi Pierre,

Thank you for the quick solution, however the issue it is not working dynamically. With every click on the single according panel the content for the multiple accordion is getting pushed further and further down - it should dynamically move up as well - now content is moving only down :).

It’s been a struggle to get this to work :slight_smile:

4

Ah yeah,
sorry, I didn’t try it with multiple opening

Here:
AccordionExpand&Collapse_V3.rp (713.9 KB)

5

You can use the Push/Pull feature but in a very round-a-bout way.

Think of the things inside the repeater as being on a different “layer” than the repeater itself and the dynamic panel below it. So, in order to affect the dynamic panel, you have to use an object that’s on the same “layer”. Calling an event that forces the whole repeater “container” widget to re-render will allow it to push/pull the panel below it. I hope these examples can demonstrate the idea better than I can explain it:

One method is to hide the whole repeater, expand the accordion section, and then show the whole repeater really fast (a few ms).

The other is to put the whole repeater into a dynamic panel and quickly switch it to an empty state and then back again.

AccordionExpand&Collapse_PushPull.rp (758.0 KB)

As for the arrow, you can set it to rotate clockwise/counter-clockwise on selected/unselected.

6

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.