https://github.com/Telenav/ExpandablePager

ViewPager that slides vertically.
https://github.com/Telenav/ExpandablePager

Last synced: 3 months ago
JSON representation

ViewPager that slides vertically.

• Host: GitHub
• URL: https://github.com/Telenav/ExpandablePager
• Owner: Telenav
• License: other
• Archived: true
• Created: 2016-03-01T14:26:30.000Z (almost 9 years ago)
• Default Branch: master
• Last Pushed: 2016-03-22T10:53:29.000Z (almost 9 years ago)
• Last Synced: 2024-08-03T01:24:27.015Z (7 months ago)
• Language: Java
• Homepage:
• Size: 12.7 MB
• Stars: 714
• Watchers: 30
• Forks: 92
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE.md

Awesome Lists containing this project

• awesome-github-android-ui - ExpandablePager - 两个状态（展开和滑动）间的垂直滑动切换 (ViewPager)
• awesome-android-ui - https://github.com/Telenav/ExpandablePager

README

        
[ ![Download](https://api.bintray.com/packages/dimatim/maven/ExpandablePager/images/download.svg) ](https://bintray.com/dimatim/maven/ExpandablePager/_latestVersion)

[![Android Arsenal](https://img.shields.io/badge/Android%20Arsenal-ExpandablePager-blue.svg?style=flat)](http://android-arsenal.com/details/1/3278)

# ExpandablePager

Layout that contains a ViewPager and can slide vertically between 2 states (expanded and collapsed).

![alt tag](https://github.com/Telenav/ExpandablePager/blob/master/gif/expandablepager.gif?token=AMYIVqqzN85dOdOY4DOfk2wC-i8R7RxNks5W1HArwA%3D%3D "Demo")

#Requirements

Android 4.0+ (Ice Cream Sandwich and later)

#Setup

###Step 1

Add the following line to the ```dependencies``` section of your ```build.gradle``` file

```gradle

compile 'com.telenav.expandablepager:expandablepager:0.2.1'

```

###Step 2

Extend desired adapter:

- ExpandablePagerAdapter (don't forget to override `instantiateItem`)

```java

public class MyAdapter extends ExpandablePagerAdapter {

    

    ...

    @Override

    public Object instantiateItem(ViewGroup container, int position) {

        final ViewGroup rootView = (ViewGroup) LayoutInflater.from(container.getContext()).inflate(R.layout.page, container, false); //inflate view

        ...

        return attach(container, rootView, position); //don't forget to return the result of attach()

    }

}

```

- ExpandableFragmentPagerAdapter

- ExpandableFragmentStatePagerAdapter

###Step 3

Add ExpandablePager to a layout

```xml

RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

    xmlns:app="http://schemas.android.com/apk/res-auto"

    android:layout_width="match_parent"

    android:layout_height="match_parent">

     //pin the pager to the bootom of the screen using layout_gravity or layout_alignParentBottom

```

###Step 4

Create and pass your adapter to the ExpandablePager

```java 

    MyAdapter adapter = new MyAdapter(myData);

    ExpandablePager pager = (ExpandablePager) findViewById(R.id.container);

    pager.setAdapter(adapter);

```

###Step 5 (optional)

* Set collapsed height & animation duration via xml

```xml 

    app:animation_duration="200"

    app:collapsed_height="@dimen/header_height"

```

or programmatically

```java 

    pager.setAnimationDuration(duration);

    pager.setCollapsedHeight((int) getResources().getDimension(R.dimen.header_height));

```

* Set display mode (MODE_REGULAR or MODE_FIXED)

```java 

    pager.setMode(ExpandablePager.MODE_REGULAR);

```

#Extras

Change pager state (supported states are STATE_COLLAPSED, STATE_EXPANDED, and STATE_HIDDEN) 

```java  

    pager.setState(ExpandablePager.STATE_COLLAPSED)

```

Animate pager state change

```java  

    pager.animateToState(ExpandablePager.STATE_COLLAPSED)

```

Set current item

```java  

    pager.setCurrentItem(index, false);

```

Set listeners

```java

    pager.setOnSliderStateChangeListener(new OnSliderStateChangeListener() {

        @Override

        public void onStateChanged(View page, int index, int state) {

            ...

        }

        @Override

        public void onPageChanged(View page, int index, int state) {

            ...

        }

    });

    

    pager.setOnItemSelectedListener(new OnItemSelectedListener() {

        @Override

        public void onItemSelected(List> items, int index) {

            ...

        }

    });

```

#Sample

For a more detailed example check the [demoapp](https://github.com/Telenav/ExpandablePager/tree/master/demoapp) module.

#License

[Apache License, Version 2.0](https://github.com/Telenav/ExpandablePager/blob/master/LICENSE.md)