React-native-ui-kitten: Collapsible Accordion

Created on 21 Apr 2020  路  10Comments  路  Source: akveo/react-native-ui-kitten

馃殌 Feature Proposal

Customizable Component for collapse contents within an accordion.

Motivation & Example

I want to provide a list of exercises, the user can select. But I want to keep it all on the same page, to let the user browse faster the items. The items should then be expandable and collapsible (different defaults each item, customizable content or icon for header and body).

See bootstrap.

Please correct me, if this feature is already implemented somehow.

Proposal Components

All 10 comments

Can the grouped menu work for you?

Haven't tried yet, if this supports custom items instead of MenuItem.
Anyway I noticed that I need a custom Header, too, which is not the case in MenuGroup.
So it may be better to make my own component.

Can be closed or keep open, if want to implement such feature.
Thanks for the response :)

@Gustl22 yup, there are too many options on how it should look. Especially when looking at the one you shared. But let's keep it open to see the interest and prioritize some time.

I think a good approach would be to make a collapsible Card component (with animation), so that the header is always shown and the content is hided completely in collapsed state.

BTW: Used LayoutAnimation before _collapse_ state change and adapted heights of Card and Header.

Here a demo of my implementation:
Card-Accordion

I can't find group menu for version 4.4 (Don't want to upgrade to 5 since it's still alpha)

@yogevlahyani v4 docs is here. See the version switcher at the top of the page.

@artyorsh Yes I know, MenuGroup isn't in the docs or in v4 in general

@yogevlahyani Yup, because there was no special component for that. This was achieved in a different and less customizable (that's why it was completely reimplemented) way. For v4, see sub-menu example in the old docs

@artyorsh Thanks! :)

Trying to do something similar here. I have a large form that I want to break up into chunks with an accordion-style layout. I tried to accomplish this using MenuGroups, but I can't find a way to customize MenuItem. Is this possible, or have people found a better solution for accordions?

Was this page helpful?
0 / 5 - 0 ratings

Related issues

chamatt picture chamatt  路  3Comments

eyalyoli picture eyalyoli  路  3Comments

PORA69 picture PORA69  路  3Comments

sovannvin picture sovannvin  路  3Comments

jeloagnasin picture jeloagnasin  路  3Comments