search

taltstidl / AndroidSlidingUpPanel

This library provides a simple way to add a draggable sliding up panel (popularized by Google Music and Google Maps) to your Android application. Brought to you by Umano.
http://umano.me
Apache License 2.0
13 stars 6 forks source link

readme

[JitPack]()

Android Sliding Up Panel - Material Design

This is a fork of Umano Sliding Up Panel that aims to bring some Material Design features:

Floating Action Button

Added the ability to attach a Floating Action Button to the Sliding Up Panel (as seen in the Google Maps Material Design version). To include the Floating Action Button to your layout change it to this:

<com.sothree.slidinguppanel.FloatingActionButtonLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:sothree="http://schemas.android.com/apk/res-auto"
    xmlns:fab="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    sothree:umanoFabMode=["leave_behind" | "circular_reveal" | "fade"]
    tools:context=".DemoActivity">

    <!-- SLIDING UP PANEL -->
    <com.sothree.slidinguppanel.SlidingUpPanelLayout
        android:id="@+id/sliding_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="bottom"
        sothree:umanoDragView="@+id/dragView"
        sothree:umanoPanelHeight="68dp"
        sothree:umanoParalaxOffset="100dp"
        sothree:umanoShadowHeight="4dp">
        <!-- The normal content of the Sliding Up Panel (see Original Readme)-->
    </com.sothree.slidinguppanel.SlidingUpPanelLayout>

    <!-- FLOATING ACTION BUTTON -->
    <com.melnykov.fab.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|right"
        android:layout_marginRight="16dp"
        android:layout_marginBottom="16dp"
        android:src="https://github.com/taltstidl/AndroidSlidingUpPanel/raw/master/@android:drawable/ic_input_add"
        fab:fab_colorNormal="@color/primary"
        fab:fab_colorPressed="@color/primary_pressed"
        fab:fab_colorRipple="@color/ripple" />
</com.sothree.slidinguppanel.FloatingActionButtonLayout>

(The Floating Action Button used here and in the demo is Oleksandr Melnykov's Floating Action Button)

You can choose the kind of animation you want for the Floating Action Button when dragging the panel by using the umanoFabMode attribute:

There also are some new methods related to the Floating Action Button:

New Listeners

Added new listeners. Here's a list of the new ones along with a explanation:

Importing the library

As this fork of the library currently is not available on Maven Central, you'll for now have to do some extra steps to include this to your project. I hope to eventually get these changes back into the main library though.

Download as Zip File
  1. Download the repository as a .zip file
  2. Unzip the .zip file you just downloaded
  3. Copy the library folder into your project folder (you can also rename it if you have to because of conflicts)
  4. Add include ':library' or include ':theChangedLibraryName' if you changed the folder name to your settings.gradle of your project folder
  5. Add compile project(':library') or compile project(':theChangedLibraryName') if you changed the folder name to your dependencies of the build.gradle file of your app module
  6. Now you should be able to work with this library
Gradle dependency

You can now use the library as a gradle dependency thanks to JitPack. Just add the following to the build.gradle of your app module:

repositories { 
    maven { url "https://jitpack.io" }
}
dependencies {
    compile 'com.github.TR4Android:AndroidSlidingUpPanel:3.2.1'
}

Android Sliding Up Panel - Orginal Readme

This library provides a simple way to add a draggable sliding up panel (popularized by Google Music, Google Maps and Rdio) to your Android application. Umano Team <3 Open Source.

As seen in Umano Android app:

SlidingUpPanelLayout

Importing the library

Eclipse

Download the latest release and include the library project as a dependency in Eclipse.

Android Studio

Simply add the following dependency to your build.gradle file to use the latest version:

dependencies {
    repositories {
        mavenCentral()
    }
    compile 'com.sothree.slidinguppanel:library:3.2.1'
}

Usage

For more information, please refer to the sample code.

<com.sothree.slidinguppanel.SlidingUpPanelLayout
    xmlns:sothree="http://schemas.android.com/apk/res-auto"
    android:id="@+id/sliding_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="bottom"
    sothree:umanoPanelHeight="68dp"
    sothree:umanoShadowHeight="4dp">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:text="Main Content"
        android:textSize="16sp" />

    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center|top"
        android:text="The Awesome Sliding Up Panel"
        android:textSize="16sp" />
</com.sothree.slidinguppanel.SlidingUpPanelLayout>

For smooth interaction with the ActionBar, make sure that windowActionBarOverlay is set to true in your styles:

<style name="AppTheme">
    <item name="android:windowActionBarOverlay">true</item>
</style>

However, in this case you would likely want to add a top margin to your main layout of ?android:attr/actionBarSize or ?attr/actionBarSize to support older API versions.

Caveats, Additional Features and Customization

Scrollable Sliding Views

If you have a scrollable view inside of the sliding panel, make sure to set umanoScrollableView attribute on the panel to supported nested scrolling. The panel supports ListView, ScrollView and RecyclerView out of the box, but you can add support for any type of a scrollable view by setting a custom ScrollableViewHelper. Here is an example for NestedScrollView

public class NestedScrollableViewHelper extends ScrollableViewHelper {
  public int getScrollableViewScrollPosition(View scrollableView, boolean isSlidingUp) {
    if (mScrollableView instanceof NestedScrollView) {
      if(isSlidingUp){
        return mScrollableView.getScrollY();
      } else {
        NestedScrollView nsv = ((NestedScrollView) mScrollableView);
        View child = nsv.getChildAt(0);
        return (child.getBottom() - (nsv.getHeight() + nsv.getScrollY()));
      }
    } else {
      return 0;
    }
  }
}

Once you define your helper, you can set it using setScrollableViewHelper on the sliding panel.

Implementation

This library was initially based on the opened-sourced SlidingPaneLayout component from the r13 of the Android Support Library. Thanks Android team!

Requirements

Tested on Android 2.2+

Other Contributors

If you have an awesome pull request, send it over!

Changelog

Known Users

If you are using the library and you would like to have your app listed, simply send us a pull request.

Licence

Licensed under the Apache License, Version 2.0 (the "License"); you may not use this work except in compliance with the License. You may obtain a copy of the License in the LICENSE file, or at:

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.