DoubleLift

Additional

Language
Kotlin
Version
1.0.0 (Oct 25, 2019)
Created
Oct 25, 2019
Updated
Oct 27, 2019
Owner
Jaewoong Eum (skydoves)
Contributor
Jaewoong Eum (skydoves)
1
Activity
Badge
Generate
Download
Source code
APK file

Blurb

DoubleLift

🦋 Expands and collapses a layout's horizontal and vertical sequentially. Inspired by "Viewing Labels" from the Trello.

Including in your project

Gradle

Add below codes to your root build.gradle file (not your module build.gradle file).

allprojects {
    repositories {
        jcenter()
    }
}

And add a dependency code to your module's build.gradle file.

dependencies {
    implementation "com.github.skydoves:doublelift:1.0.0"
}

Usage

Add following XML namespace inside your XML layout file.

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

DoubleLiftLayout

Here is a basic example of implementing DoubleLiftLayout.

<com.skydoves.doublelift.DoubleLiftLayout
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  app:doubleLift_foldedWidth="50dp" // sets the width size when collapsed.
  app:doubleLift_foldedHeight="10dp" // sets the height size when collapsed.
  app:doubleLift_horizontalDuration="400" // sets the duration of horizontal lifting.
  app:doubleLift_verticalDuration="300" // sets the duration of vertical lifting.
  app:doubleLift_cornerRadius="4dp" // sets the corner radius.
  app:doubleLift_autoExpand="false" // expand initially or not.
  app:doubleLift_startOrientation="horizontal">

  <TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:text="Feature"
    android:textColor="@color/white_87"
    android:textStyle="bold" />
    
  // something complicated views or layouts
  
</com.skydoves.doublelift.DoubleLiftLayout>

Create using builder class

We can create an instance of DoubleLiftLayout using the DoubleLiftLayout.Builder class.

val myDoubleLiftLayout = DoubleLiftLayout.Builder(context)
  .setFoldedWidth(200)
  .setFoldedHeight(100)
  .setCornerRadius(6)
  .setLiftHorizontalDuration(400)
  .setLiftVerticalDuration(200)
  .setOnExpandListener { toast("expanded: $it") }
  .build()

Or we can create using the kotlin-dsl.

val myDoubleLiftLayout = doubleLiftLayout(this) {
  setFoldedWidth(200)
  setFoldedHeight(100)
  setCornerRadius(6)
  setLiftHorizontalDuration(400)
  setLiftVerticalDuration(200)
  setOnExpandListener { toast("expanded: $it") }
}

Expand and Collapse

We can expand and collapse using the below methods.

doubleLiftLayout.expand() // expand the width and height size sequentially.
doubleLiftLayout.collapse() // collapse the width and height size sequentially.

or we can do something after expanded using lambda.

doubleLiftLayout.expand { toast("expanded") }
doubleLiftLayout.collapse { toast("collapsed") }

OnExpandListener

We can listen to the DoubleLiftLayout is expanded or collapsed.

doubleLiftLayout.onExpandListener = object : OnExpandListener {
  override fun onExpand(isExpanded: Boolean) {
    toast("Expanded : $it")
  }
}

// or we can listen using a lambda expression.
doubleLiftLayout.setOnExpandListener {
  if (it) {
    toast("expanded")
  } else {
    toast("collapse")
  }

DoubleLiftLayout Attributes

Attributes Type Default Description
foldedWidth Dimension 0 sets the width size when collapsed.
foldedHeight Dimension 0 ets the height size when collapsed.
horizontalDuration Long 500L sets the duration of horizontal lifting.
verticalDuration Long 300L sets the duration of vertical lifting.
cornerRadius Dimension 4dp sets the corner radius.
autoExpand Boolean false invkoe expand() method initially or not.
startOrientation LiftStartOrientation LiftStartOrientation.HORIZONTAL sets the starting orientation of the lifting.

Find this library useful? ❤️

Support it by joining stargazers for this repository. ⭐️ And follow me for my next creations! ????

License

Copyright 2019 skydoves (Jaewoong Eum)

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License 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.