Skip to main content
Syeds
Syeds
Inspiring
September 22, 2021
Answered

Accordion help needed.

  • September 22, 2021
  • 2 replies
  • 4297 views

I have been following tutorials posted here but I cannot get it to work. For some reason I cannot get pas a single click. My ultimate goal is to get the accordions to work as mentioned here: https://assets.adobe.com/public/8f1ba6b5-a1fb-4147-6152-2dfdccd8916f and prototypes herehttps://xd.adobe.com/view/eb0cc70f-4b5b-4f18-463d-07dd68d3d70c-9d3d/?fullscreen

I tried to follow the tutorial but just is too fast and does not explain the steps. Sorry.

 

I have attached screensshots that can provide a bit of context.

1. All accordion open and closed intances are grouped.

2. These individual groups have a parent accordion component

3. I added states to the parent component of each open instance: For example, 8 open states for 8 accordions

4. My prototyping is is not making proper conections.

 

Please help.

    This topic has been closed for replies.
    Correct answer Rafael30902263yca8

    @Rafael30902263yca8 

     

    It seems you either do not have the content from the closed tab positioned below your content for the open tab or the text there but hidden. I would copy the text box content when the tab is closed and paste it into the tab in its open state. The make sure to position it under the text content so it is visible when the tab is in its open state. Make sure the text is positioned/visible and present in the open state. 


    Thank you for your answer, @Syeds 

    2 replies

    Syeds
    SyedsAuthor
    Inspiring
    November 4, 2021

    Another member posted a solution:
    https://youtu.be/Pf1a-bp3XmA

    Spas K.
    Community Expert
    Spas K.Community Expert
    Community Expert
    November 4, 2021

    That's still with only 1 open at a time though. If you want to have multiple open at a time, the amount of states will increase x4 🙂

    Chris W. Griffith
    Community Expert
    Chris W. GriffithCommunity Expert
    Community Expert
    September 22, 2021

    Are you drilling down to the element you want to act as the trigger? Your last screenshot seems to show the triggers on incorrect layers. 

    Syeds
    SyedsAuthor
    Inspiring
    September 22, 2021

    Yes. It is a simple interface. Select to expand. I do not want them to close the non-clicked ones. I would like the ability to open and close each individual accordion seperately.

    Chris W. Griffith
    Community Expert
    Chris W. GriffithCommunity Expert
    Community Expert
    September 22, 2021

    That is going to be almost impossible to prototype. In the samples you showed, the accordian has 5 states: all closed, 1 open, 2 open, 3 open, and 4 open. That is not too bad to wire together. With each accordian being indivually controlled, this jumps to 15(?) different states that you now have to account for and attempt to wire. 

     

    Take a step back and try building just a component with two accordians and get that working, then move up from there. But it is still going to be a big effort.

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices