Skip to content

Empty State

The default page is very important for a user-friendly application.

BRV integrates a highly efficient default page library called StateLayout to implement default pages for lists.

StateLayout is already embedded in the BRV library, so there is no need to depend on StateLayout separately. If your list includes both pull-to-refresh and load-more functionality, I recommend using PageRefreshLayout instead of StateLayout.

Main Features:

  • Elegant function design
  • Partial default pages
  • Layout or code declaration
  • Global/singleton configuration
  • Listening to default page display
  • Custom animations
  • Multiple state default pages
  • Network request callbacks
  • Passing any object as a tag
  • Quick configuration for click-to-retry
  • Asynchronous threads
  • Immediate display of error default page when there is no network
  • Automatic display of list default page when used with lists
  • Automatic display of default page when used with network requests

StateLayout Demo

Usage

Step 1: Initialize the default page in your Application class.

StateConfig.apply {
    emptyLayout = R.layout.layout_empty
    errorLayout = R.layout.layout_error
    loadingLayout = R.layout.layout_loading
}

Step 2: Create the default page.

<com.drake.statelayout.StateLayout
android:id="@+id/state"
android:layout_width="match_parent"
android:layout_height="match_parent">

        <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/rv"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />
    </com.drake.statelayout.StateLayout>

It is recommended to create the StateLayout in XML layout to maintain code readability and avoid unnecessary issues for better performance. 

val state = stateCreate() // Create the default page function directly in the Activity/Fragment. `rv.stateCreate()` can also be used, but it is strongly discouraged.

For CoordinatorLayout+ViewPager, the root layout of the default page XML must be NestedScrollView in order to scroll correctly after displaying the default page.

Step 3: Create the list.

rv.linear().setup {
    addType<Model>(R.layout.item_simple)
    addType<DoubleItemModel>(R.layout.item_full_span)
}.models = getData()

Step 4: Show the default page.

state.showLoading()  // Show loading state
state.showContent() // Show content
state.showError() // Show error state
state.showEmpty() // Show empty state

StateLayout

StateLayout is a highly recommended default page library. BRV internally integrates it to provide default pages for lists to developers.

If you want to customize the default page animations and listen to the lifecycle of the default page, I recommend reading the following documentation:

Skeleton Animation

Skeleton animation refers to the animation or image corresponding to the layout.

BRV implements skeleton animation using StateLayout. You can refer to the [Skeleton Animation](https://liangjingkanji.github.io/

StateLayout/skeleton/) documentation for specific implementation code examples.

For code examples, you can refer to the sample in the BRV repository.