Components

Bottom Sheet

The bottom sheet is a slides from the bottom of the screen

Bottomsheets are bottom-anchored overlays that that allow the user to easily return to the previous screen. They are meant for temporary focused tasks. Sheets are the mobile equivalent of the modal or overlay on web. Bottomsheet also known as Drawer , Panel, Tray.

Usage

To implement bottomsheet, you can follow the steps in example section.

Themes

There are 4 themes available on the bottom sheet Legion :

Legion Default
Agree Culture
Agree Livestock
Agree Fisheries

Properties

Properties	Description	Value
Orientation	To custom your content orientation of the bottom sheet horizontal or vertical.	horizontal / vertical	`nil`
Header	To set header of the bottom sheet.	String
title	To set bottom sheet title under header properties.	String
description	To set bottom sheet description under header properties.	String
showClose	To show close button on the bottomsheet.	true / false

Example

Here example usage of bottomsheet Legion.

Create fragment layout for the page.

fragment_bottom_sheet.xml

    <androidx.core.widget.NestedScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="telkom.legion.sample.menu.extension.bottomsheet.BottomSheetFragment">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"

Create item menu for the bottomsheet

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingBottom="@dimen/dimen_16dp"
    android:orientation="horizontal">

Implement method on kotlin file

...
...
override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)
        with(binding) {
            btnBasic.setOnClickListener {
                LgnBottomSheet.setup(requireContext()) {
                    orientation = LgnBottomSheet.Orientation.HORIZONTAL
                    header = LgnBottomSheet.HeaderView.DefaultWithHandler(

Here are the result

Do you have feedback?

Please let us know to make it better

Send Feedback