https://github.com/HeyAlex/CornerSheet

Behavior to expand view from corner
https://github.com/HeyAlex/CornerSheet

android-ui animation bottom-sheets bottom-sheets-slide bottomsheet bottomsheet-android corner-sheet

Last synced: about 2 months ago
JSON representation

Behavior to expand view from corner

• Host: GitHub
• URL: https://github.com/HeyAlex/CornerSheet
• Owner: HeyAlex
• License: mit
• Created: 2020-01-04T21:13:57.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2024-06-06T13:38:20.000Z (4 months ago)
• Last Synced: 2024-07-10T15:14:41.436Z (2 months ago)
• Topics: android-ui, animation, bottom-sheets, bottom-sheets-slide, bottomsheet, bottomsheet-android, corner-sheet
• Language: Kotlin
• Homepage: https://m2.material.io/components/sheets-bottom#expanding-bottom-sheet
• Size: 5.53 MB
• Stars: 299
• Watchers: 6
• Forks: 14
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE.txt

Awesome Lists containing this project

README

        
Corner Sheet

Behavior to make a view expands from corner



## Usage

The usage is similar to [BottomSheetBehavior](https://developer.android.com/reference/com/google/android/material/bottomsheet/BottomSheetBehavior)

Corner Sheet - behavior that allow you expand a view from corner.

![](https://github.com/HeyAlex/CornerSheet/blob/master/raw/corner_sample_pic.png)

A simple view with behavior in xml will be look like:

```xml

        

            

        

```

You can use the following attributes on view with CornerSheetBehavior.

| Properties                                 | Type                  | Default |

| -------------------------------------------| --------------------- | ------- |

| `behavior_horizontalExpandingRatio`        | float                 | 0.2f    |

| `behavior_expanded_width`                  | dimension             | 0dp     |

| `behavior_horizontal_peekHeight`           | dimension             | 0dp     |

Customize corner shape with `shapeAppearanceOverlay` attribute:

```xml

 

        <item name="cornerSizeTopLeft">30dp</item>

        <item name="cornerFamily">rounded</item>

 

```

There are 3 state of CornerSheetBehavior:

| State                                 | Description                                                      |

| --------------------------------------| -------------------------------------------------------------------- |

| `CornerSheetBehavior.STATE_EXPANDED`  | expanded horizontally on `behavior_expanded_width` value         |

| `CornerSheetBehavior.STATE_COLLAPSED` | expanded horizontally on `behavior_horizontal_peekHeight` value  |

| `CornerSheetBehavior.STATE_HIDDEN`    | hide horizontally                                                |

![](/raw/behavior_states_sample.png)

There are following api that can be used on `CornerSheetBehavior`:

```kotlin

behavior.expandingRatio = 0.5f

behavior.horizontalState = CornerSheetBehavior.STATE_EXPANDED

behavior.expandedWidth = 170.dp()

behavior.setHorizontalPeekHeight(60.dp(), animate = true) //will be animated if horizontal state is CornerSheetBehavior.STATE_COLLAPSED

```

Just check app module with "Behavior Sample":

![](/raw/corner_behavior_sample.gif)

There is also an option to use a view that can contain a header and content:

```xml

    

```

With CornerDrawer you don't need to set `behavior_peekHeight` and `behavior_expanded_width`, they will be assigned automatically when `header_view` will be inflated.

You can use an attributes on behavior that described below and a following attributes on CornerDrawer

| Properties          | Type         | Default |

| ------------------- | ------------ | ------- |

| `header_view`       | reference    | -1      |

| `header_color`      | reference    | #FFF    |

| `content_view`      | reference    | -1      |

| `content_color`     | reference    | #FFF    |

The main preview is done with `CornerDrawer`, just check app module with "Support Sample"

## Integration

This library is available on **mavenCentral**, so you need to add this repository to your root build.gradle:

```groovy

allprojects {

    repositories {

        ...

        mavenCentral()

    }

}

```

Add one of the following dependency:

```groovy

dependencies {

    //only CornerSheetBehavior

    implementation 'com.github.heyalex.cornersheet:core:v1.0.1'

    //CornerSheetBehavior and CornerDrawer

    implementation 'com.github.heyalex.cornersheet:drawer:v1.0.1'

}

```

## Samples

You can find sample in app module, to understand functionality of library or just get an APK [here](https://github.com/HeyAlex/CornerSheet/raw/master/raw/app-debug.apk)