StickyScrollViewItems

A small android library for tagging views inside a ScrollView as "sticky" making them stick to the top of the scroll container until a new sticky view comes and takes it's place

1,032

262

1,032

View on GitHub

Top Related Projects

SwipeRevealLayout

1,570

Easy, flexible and powerful Swipe Layout for Android

AndroidSlidingUpPanel

9,494

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.

Android-ObservableScrollView

9,651

Android library to observe scroll events on scrollable views.

FlowingDrawer

2,567

swipe display drawer with flowing & bouncing effects.

Side-Menu.Android

5,235

Side menu with some categories to choose.

Quick Overview

StickyScrollViewItems is an Android library that allows developers to create sticky headers within ScrollViews. It provides a simple way to make specific views stick to the top of the screen while scrolling, enhancing the user experience in list-like layouts.

Pros

Easy to implement with minimal code changes
Supports both vertical and horizontal scrolling
Customizable with various attributes for fine-tuning behavior
Lightweight and efficient, with minimal impact on performance

Cons

Limited to ScrollView and HorizontalScrollView, not compatible with RecyclerView
May require additional work for complex layouts or nested scrolling scenarios
Not actively maintained (last update was several years ago)
Lacks some advanced features found in newer sticky header libraries

Code Examples

Basic implementation in XML layout:

<com.emilsjolander.components.StickyScrollViewItems
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Sticky Header"
            android:tag="sticky" />

        <!-- Other content -->

    </LinearLayout>

</com.emilsjolander.components.StickyScrollViewItems>

Customizing sticky behavior in Java:

StickyScrollViewItems stickyScroll = findViewById(R.id.sticky_scroll);
stickyScroll.setStickyViewTopOffset(20);
stickyScroll.setStickingType(StickyScrollViewItems.STICKING_TOP);

Listening for sticky events:

stickyScroll.setOnStickyViewListener(new StickyScrollViewItems.OnStickyViewListener() {
    @Override
    public void onStickyViewStateChanged(boolean isSticky) {
        Log.d("StickyView", "Sticky state changed: " + isSticky);
    }
});

Getting Started

Add the dependency to your build.gradle file:

dependencies {
    implementation 'com.emilsjolander:StickyScrollViewItems:1.1.0'
}

Use StickyScrollViewItems in your layout XML:

<com.emilsjolander.components.StickyScrollViewItems
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <!-- Your content here -->
</com.emilsjolander.components.StickyScrollViewItems>

Add the android:tag="sticky" attribute to views you want to stick:

<TextView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="Sticky Header"
    android:tag="sticky" />

Customize behavior in your Activity or Fragment if needed:

StickyScrollViewItems stickyScroll = findViewById(R.id.sticky_scroll);
stickyScroll.setStickyViewTopOffset(20);

Competitor Comparisons

SwipeRevealLayout

1,570

Easy, flexible and powerful Swipe Layout for Android

Pros of SwipeRevealLayout

Provides swipe-to-reveal functionality for list items, allowing for hidden actions
Supports both left and right swiping directions
Offers customizable animation and layout options

Cons of SwipeRevealLayout

Limited to swipe gestures, while StickyScrollViewItems focuses on sticky headers
May require more complex implementation for non-list views
Less suitable for scenarios where sticky elements are needed

Code Comparison

SwipeRevealLayout:

<com.chauthai.swipereveallayout.SwipeRevealLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent">
        <!-- Menu items -->
    </LinearLayout>
    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <!-- Main content -->
    </FrameLayout>
</com.chauthai.swipereveallayout.SwipeRevealLayout>

StickyScrollViewItems:

<se.emilsjolander.stickylistheaders.StickyListHeadersListView
    android:id="@+id/list"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

The code comparison shows that SwipeRevealLayout requires more XML configuration to set up the swipe-to-reveal functionality, while StickyScrollViewItems uses a custom ListView that handles sticky headers with minimal setup. SwipeRevealLayout offers more flexibility in terms of layout structure, but StickyScrollViewItems provides a simpler implementation for sticky header functionality.

AndroidSwipeLayout

12,369

The Most Powerful Swipe Layout!

Pros of AndroidSwipeLayout

More versatile, allowing for custom swipe layouts and multiple swipe directions
Actively maintained with recent updates and bug fixes
Larger community with more stars, forks, and contributors

Cons of AndroidSwipeLayout

More complex implementation due to its flexibility
Potentially higher memory usage for complex swipe layouts
Steeper learning curve for developers new to the library

Code Comparison

StickyScrollViewItems:

WrapperView wrapperView = (WrapperView) inflater.inflate(R.layout.list_item, null);
wrapperView.wrapChild(childView);
mContentView.addView(wrapperView);

AndroidSwipeLayout:

SwipeLayout swipeLayout = (SwipeLayout)findViewById(R.id.swipe);
swipeLayout.addDrag(SwipeLayout.DragEdge.Left, findViewById(R.id.bottom_wrapper));
swipeLayout.addSwipeListener(new SwipeLayout.SwipeListener() {
    @Override
    public void onOpen(SwipeLayout layout) {}
    // ... other listener methods
});

The code comparison shows that AndroidSwipeLayout requires more setup and configuration, but offers greater customization options. StickyScrollViewItems has a simpler implementation focused on its specific use case of sticky scroll views.

AndroidSlidingUpPanel

9,494

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.

Pros of AndroidSlidingUpPanel

Provides a draggable sliding up panel, offering more interactive UI possibilities
Supports both overlay and inline panel modes, giving flexibility in layout design
Includes built-in touch handling and smooth animations

Cons of AndroidSlidingUpPanel

More complex implementation compared to StickyScrollViewItems
May require more customization for specific use cases
Potential performance impact due to additional view layers

Code Comparison

StickyScrollViewItems:

StickyScrollView scrollView = (StickyScrollView) findViewById(R.id.scroll);
scrollView.addStickiedHeader(findViewById(R.id.header1));
scrollView.addStickiedHeader(findViewById(R.id.header2));

AndroidSlidingUpPanel:

SlidingUpPanelLayout layout = (SlidingUpPanelLayout) findViewById(R.id.sliding_layout);
layout.setPanelState(SlidingUpPanelLayout.PanelState.COLLAPSED);
layout.addPanelSlideListener(new PanelSlideListener() {
    @Override
    public void onPanelSlide(View panel, float slideOffset) {}
});

StickyScrollViewItems focuses on creating sticky headers within a ScrollView, while AndroidSlidingUpPanel provides a more complex sliding panel functionality. The choice between the two depends on the specific UI requirements of the project.

Android-ObservableScrollView

9,651

Android library to observe scroll events on scrollable views.

Pros of Android-ObservableScrollView

More comprehensive and flexible, supporting various scroll effects and animations
Actively maintained with regular updates and improvements
Extensive documentation and sample implementations

Cons of Android-ObservableScrollView

Steeper learning curve due to its complexity and extensive features
Potentially higher overhead for simple sticky header implementations
May require more setup and configuration for basic use cases

Code Comparison

StickyScrollViewItems:

mStickyView = (TextView) findViewById(R.id.sticky);
StickyScrollView scrollView = (StickyScrollView) findViewById(R.id.scroll_view);
scrollView.setStickyView(mStickyView);

Android-ObservableScrollView:

ObservableScrollView scrollView = (ObservableScrollView) findViewById(R.id.scroll);
scrollView.setScrollViewCallbacks(this);

@Override
public void onScrollChanged(int scrollY, boolean firstScroll, boolean dragging) {
    // Implement scroll behavior
}

Android-ObservableScrollView offers more control over scroll behavior and supports various scroll effects, while StickyScrollViewItems focuses specifically on implementing sticky headers with a simpler API. Android-ObservableScrollView requires implementing callback methods to handle scroll events, allowing for more customization but potentially increasing complexity. StickyScrollViewItems provides a more straightforward approach for adding sticky headers to scroll views, making it easier to use for basic sticky header implementations.

FlowingDrawer

2,567

swipe display drawer with flowing & bouncing effects.

Pros of FlowingDrawer

Provides a unique and visually appealing drawer animation effect
Offers customizable menu options and layouts
Supports both left and right-side drawer configurations

Cons of FlowingDrawer

More complex implementation compared to StickyScrollViewItems
Limited to drawer functionality, while StickyScrollViewItems is more versatile for scroll views
May require more resources due to animation effects

Code Comparison

FlowingDrawer:

mLeftDrawer = (FlowingDrawer) findViewById(R.id.drawerlayout);
mLeftDrawer.setMenuSize(300);
mLeftDrawer.setTouchMode(ElasticDrawer.TOUCH_MODE_BEZEL);
mLeftDrawer.setOnDrawerStateChangeListener(new ElasticDrawer.OnDrawerStateChangeListener() {
    @Override
    public void onDrawerStateChange(int oldState, int newState) {
        // Handle state changes
    }
});

StickyScrollViewItems:

ObservableScrollView scrollView = (ObservableScrollView) findViewById(R.id.scroll_view);
View stickyView = findViewById(R.id.sticky);
scrollView.setScrollViewListener(new ScrollViewListener() {
    @Override
    public void onScrollChanged(ObservableScrollView scrollView, int x, int y, int oldx, int oldy) {
        // Handle scroll changes
    }
});

Both libraries offer unique functionality for Android UI development. FlowingDrawer focuses on creating an animated drawer menu with a flowing effect, while StickyScrollViewItems provides a solution for sticky headers in scroll views. The choice between them depends on the specific UI requirements of your project.

Side-Menu.Android

5,235

Side menu with some categories to choose.

Pros of Side-Menu.Android

Offers a visually appealing and customizable side menu animation
Provides a modern, material design-inspired UI component
Includes detailed documentation and a sample app for easy implementation

Cons of Side-Menu.Android

Limited to side menu functionality, less versatile than StickyScrollViewItems
May require more setup and customization for specific use cases
Potentially higher performance overhead due to complex animations

Code Comparison

StickyScrollViewItems:

StickyScrollView scrollView = (StickyScrollView) findViewById(R.id.scroll_view);
scrollView.addStickiedHeader(findViewById(R.id.sticky_header));

Side-Menu.Android:

ResideMenu resideMenu = new ResideMenu(this);
resideMenu.setBackground(R.drawable.menu_background);
resideMenu.attachToActivity(this);
resideMenu.addMenuItem(menuItem, ResideMenu.DIRECTION_LEFT);

While StickyScrollViewItems focuses on creating sticky headers within scroll views, Side-Menu.Android specializes in creating an animated side menu. StickyScrollViewItems offers a simpler API for adding sticky elements, while Side-Menu.Android requires more setup but provides a more visually striking menu component.

Both libraries serve different purposes, with StickyScrollViewItems being more versatile for various scrolling scenarios and Side-Menu.Android offering a polished solution specifically for side menus in Android applications.

Convert designs to code with AI

Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.

Try Visual Copilot

README

StickyScrollViewItems

StickyScrollViewItems is a ScrollView subclass that allowed you to mark items inside the ScrollView as sticky. The items marked as sticky will stick to the top of the ScrollView until another sticky items comes by and pushes it out of the way.

Installing

Add the following gradle dependency exchanging x.x.x for the latest release.

dependencies {
    compile 'se.emilsjolander:StickyScrollViewItems:x.x.x'
}

Usage

First of all replace any instance of ScrollView with StickyScrollView. So you go from this:

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
	android:layout_height="match_parent" android:layout_width="match_parent">
	<!-- scroll view child goes here -->
</ScrollView>

to this:

<StickyScrollView xmlns:android="http://schemas.android.com/apk/res/android"
	android:layout_height="match_parent" android:layout_width="match_parent"
	android:id="@+id/sticky_scroll">
	<!-- scroll view child goes here -->
</StickyScrollView>

As with a regular ScrollView you are only allowed one child. But that child can contain any number of children. It is these children or any of their children that can be tagged as a sticky view. If you want t view to stick to the top when you scroll passed it add a sticky tag with the android:tag attribute to it like this:

<StickyScrollView xmlns:android="http://schemas.android.com/apk/res/android"
	android:id="@+id/sticky_scroll"
	android:layout_height="match_parent" android:layout_width="match_parent">

	<LinearLayout 
		android:layout_height="match_parent" android:layout_width="match_parent" 
		android:orientation="horizontal">

		<!-- other children -->

		<View 
			android:layout_height="300dp" 
			android:layout_width="match_parent"
			android:tag="sticky"/>

		<!-- other children -->

	</LinearLayout>

</StickyScrollView>

There are also two additional flags that can be set on views that were added to optimize performance for the most usual cases. If the view you want to stick either has transparency or does not have a constant representation than you must supply one or both of the following flags. -hastransparancy for views that have transparancy and -nonconstant for views that will change appearance during there sticky time (examples are buttons with pressed states as well as progress spinners).

So this ends up with 4 different ways to tag a view as sticky resulting is slightly different behaviour android:tag="sticky" android:tag="sticky-hastransparancy" android:tag="sticky-nonconstant" and android:tag="sticky-hastransparancy-nonconstant".

If you want to add a shadow drawable below the stuck items, you must declare a namespace to find the shadow attributes xmlns:whatever="http://schemas.android.com/apk/res-auto". Usually you do this in the root layout element in you layout.xml file. You can then specify the shadow drawable with whatever:stuckShadowDrawable="" and the shadow height with whatever:stuckShadowHeight="" in xml. Note that when left unspecified, the default shadow height is 10dip.

<StickyScrollView xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:whatever="http://schemas.android.com/apk/res-auto"
  android:layout_height="match_parent" android:layout_width="match_parent"
  android:id="@+id/sticky_scroll"
  whatever:stuckShadowDrawable="@drawable/sticky_shadow_default"
  whatever:stuckShadowHeight="50dip" >
  <!-- scroll view child goes here -->
</StickyScrollView>

These shadow height and drawable can also be set programatically. Note that, unlike the xml attribute, setShadowHeight(pixels) only takes the values in pixels.

StickyScrollView stickyScroll = (StickyScrollView) findViewById(R.id.sticky_scroll);
stickyScroll.setShadowDrawable(getResources().getDrawable(
        R.drawable.shadow_drawable));
stickyScroll.setShadowHeight(50); // in pixels

Top Related Projects

Convert designs to code with AI

Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.

Try Visual Copilot