DOCSEARCHbyAlgolia
Submit Docs

Expandable Layout

repository·master·Indexed 23 days ago

https://github.com/aakira/expandablelayout

An Android library providing ExpandableRelativeLayout, ExpandableLinearLayout, and ExpandableWeightLayout for expanding and collapsing content with customizable animations. Includes support for RecyclerView integration, custom interpolators, and state listeners via ExpandableLayoutListener.

Tokens
1.7K
Snippets
5
Records
7
Agent score
32%

What's inside expandablelayout

  1. Install Expandable Layout via Gradle

    master

    To use this library in your Android project, add the dependency to your build.gradle file. Note that it requires jcenter() in your repositories block.

    buildscript {
	repositories {
		jcenter()
	}
}

dependencies {
	compile 'com.github.aakira:expandable-layout:1.6.0@aar'
}

  2. Implement ExpandableLayoutListener

    master

    You can listen to animation and state changes using setListener.

    If you only need a subset of methods, use ExpandableLayoutListenerAdapter to avoid implementing every method in the ExpandableLayoutListener interface.

    expandableLayout.setListener(new ExpandableLayoutListener() {
    @Override
    public void onAnimationStart() {
    }

    @Override
    public void onAnimationEnd() {
    }

    // You can get notification that your expandable layout is going to open or close.
    // So, you can set the animation synchronized with expanding animation.
    @Override
    public void onPreOpen() {
    }

    @Override
    public void onPreClose() {
    }

    @Override
    public void onOpened() {
    }

    @Override
    public void onClosed() {
    }
});

  3. Use ExpandableLinearLayout

    master

    Use ExpandableLinearLayout if your child views change size (e.g., when loading content from a server). This is the recommended layout to use inside a RecyclerView.

    RecyclerView Integration

    When using inside a RecyclerView, you must disable view recycling for the holder and notify the layout that it is in a recycler view context:

    1. Call holder.setIsRecyclable(false).
    2. Call expandableLayout.setInRecyclerView(true).

    Recalculating Size

    If child content changes (like setting text from a server), call initLayout() to recalculate the size of the children.

    // resize expandable layout
ExpandableLinearLayout expandableLayout = (ExpandableLinearLayout) findViewById(R.id.expandableLayout);

child.setText("Sets text from a server");
expandableLayout.initLayout(); // Recalculate size of children

// recycler view
// you must set a ViewHolder#setIsRecyclable(false) and ExpandableLinearLayout#setInRecyclerView(true) 

@Override
public void onBindViewHolder(final ViewHolder holder, final int position) {
    holder.setIsRecyclable(false);
    holder.expandableLinearLayout.setInRecyclerView(true);
}

  4. Use ExpandableWeightLayout

    master

    Use ExpandableWeightLayout if you need to use layout_weight attributes within your expandable layout structure.

    ExpandableWeightLayout expandableLayout = (ExpandableWeightLayout) findViewById(R.id.expandableLayout);

// toggle expand, collapse
expandableLayout.toggle();
// expand
expandableLayout.expand();
// collapse
expandableLayout.collapse();

  5. Use ExpandableRelativeLayout

    master

    Use ExpandableRelativeLayout for standard expandable layouts. Note that this implementation does not work correctly if child views change their size dynamically. Use ExpandableLinearLayout for such cases.

    API Methods

    • toggle(): Toggles between expanded and collapsed states.
    • expand(): Expands the layout.
    • collapse(): Collapses the layout.
    • moveChild(int index): Moves the position of a specific child view.
    • move(int position): Moves to an optional position.
    • setClosePosition(int position): Sets the base position used when the layout is closed.
    ExpandableRelativeLayout expandableLayout = (ExpandableRelativeLayout) findViewById(R.id.expandableLayout);

// toggle expand, collapse
expandableLayout.toggle();
// expand
expandableLayout.expand();
// collapse
expandableLayout.collapse();

// move position of child view
expandableLayout.moveChild(0);
// move optional position
expandableLayout.move(500);

// set base position which is close position
expandableLayout.setClosePosition(500);

  6. Configure Expandable Layout XML Attributes

    master

    Use the following app: attributes in your XML layout files to configure the animation and initial state. Ensure you have xmlns:app="http://schemas.android.com/apk/res-auto" defined in your root view.

    AttributeDescription
    ael_durationThe length of the expand or collapse animation
    ael_expandedThe layout is expanded if set to true
    ael_defaultChildIndexThe layout is expanded at the index of child view (Only ExpandableRelativeLayout)
    ael_defaultPositionThe layout is expanded at the position (Only ExpandableRelativeLayout)
    ael_orientationThe orientation of animation (horizontal or vertical)
    ael_interpolatorSets the interpolator

  7. Configure Interpolator Values

    master

    The ael_interpolator attribute accepts string values corresponding to Android's Interpolator classes.

    Note: Some interpolators that cause the layout to extend outside its bounds (like AnticipateInterpolator, AnticipateOvershootInterpolator, or OvershootInterpolator) may not work as expected. It is recommended to use these for child views instead of the layout itself.

    Not supported: CycleInterpolator, PathInterpolator.