All Projects → 1993hzw → OverScroll

1993hzw / OverScroll

Licence: other
Use CoordinatorLayout+Behavior to achieve elastic scrolling and inertial scrolling for list. 利用CoordinatorLayout+Behavior实现弹性滚动和惯性滚动效果(类似微信首页).

Programming Languages

java
68154 projects - #9 most used programming language

Projects that are alternatives of or similar to OverScroll

Overscroll Decor
Android: iOS-like over-scrolling effect applicable over almost all scrollable Android views.
Stars: ✭ 2,671 (+7118.92%)
Mutual labels:  overscroll, fling
EasyScrollDots
Single page scroll JavaScript plugin that allows for vertical navigation of page sections
Stars: ✭ 38 (+2.7%)
Mutual labels:  scroll
simple-scrollspy
Simple scrollspy without jQuery, no dependencies
Stars: ✭ 53 (+43.24%)
Mutual labels:  scroll
really-smooth-scroll
A script that smoothen scrolling in the browser
Stars: ✭ 21 (-43.24%)
Mutual labels:  scroll
react-smart-scroll
Efficient rendering of long lists in React
Stars: ✭ 27 (-27.03%)
Mutual labels:  scroll
scrollpup.js
Minimal beautiful bar to show scroll progress. Pure Javascript Plugin.MIT
Stars: ✭ 83 (+124.32%)
Mutual labels:  scroll
anim-event
Event Manager for Animation
Stars: ✭ 25 (-32.43%)
Mutual labels:  scroll
use-gesture
👇Bread n butter utility for component-tied mouse/touch gestures in React and Vanilla Javascript.
Stars: ✭ 6,624 (+17802.7%)
Mutual labels:  scroll
angular2-infinite-scroll
Infinite Scroll Directive For Angular (version 2 up to 2.3.1)
Stars: ✭ 16 (-56.76%)
Mutual labels:  scroll
vue-scrollin
🎰 Scroll-in text component for Vue
Stars: ✭ 61 (+64.86%)
Mutual labels:  scroll
use-smooth-scroll
React hook which gives a smooth scrolling function.
Stars: ✭ 41 (+10.81%)
Mutual labels:  scroll
react-scrolling-color-background
background with color transitioning as you scroll, declarative and easy to setup
Stars: ✭ 53 (+43.24%)
Mutual labels:  scroll
scrollbounce
Add a subtle bounce effect on mobile when the user scrolls (WIP)
Stars: ✭ 17 (-54.05%)
Mutual labels:  scroll
vue-scroll-lock
一个 VUE 组件:子元素 scroll 父元素容器不跟随滚动(兼容PC、移动端)
Stars: ✭ 31 (-16.22%)
Mutual labels:  scroll
slider-manager
simple wrapper to create sliders focused on animations
Stars: ✭ 28 (-24.32%)
Mutual labels:  scroll
NoobScroll
A lightweight jQuery Plugin that add some cool function to make scrolling more fun [Archive]
Stars: ✭ 43 (+16.22%)
Mutual labels:  scroll
scrolltotop
Scroll To Top extension for Chrome, Firefox, Safari, Opera.
Stars: ✭ 60 (+62.16%)
Mutual labels:  scroll
Bouncy
RecyclerView and NestedScrollView with physics-based bouncy overscroll effect
Stars: ✭ 166 (+348.65%)
Mutual labels:  overscroll
use-scroll-direction
A simple, performant, and cross-browser hook for detecting scroll direction in your next react app.
Stars: ✭ 24 (-35.14%)
Mutual labels:  scroll
SSCycleScrollView
轮播终结者,用swift完成,易用集成
Stars: ✭ 39 (+5.41%)
Mutual labels:  scroll

OverScroll

Use CoordinatorLayout+Behavior to achieve elastic scrolling and inertial scrolling (similar to WeChat homepage).

利用CoordinatorLayout+Behavior实现弹性滚动和惯性滚动效果(类似微信首页).

vertical over-scroll horizontal over-scroll nested over-scroll

Usage 用法

Gradle

allprojects {
    repositories {
        ...
        maven { url 'https://jitpack.io' }
    }
}
 
dependencies {
    implementation 'com.github.1993hzw:OverScroll:1.1.1'
}

In your layout.xml:

在xml布局文件中添加类似代码:

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    ...

    <cn.forward.overscroll.view.OverScrollVerticalRecyclerView
        android:background="#0ff"
        android:id="@+id/overscroll_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    ...

</android.support.design.widget.CoordinatorLayout>

You can use OverScrollHorizontalRecyclerView, OverScrollVerticalRecyclerView or OverScrollScrollView inside CoordinatorLayout.

当然你可以在CoordinatorLayout中使用OverScrollHorizontalRecyclerView, OverScrollVerticalRecyclerViewOverScrollScrollView

Now, your layout achieve elastic scrolling and inertial scrolling!

现在你的布局就实现了弹性滚动和惯性滚动效果啦!

Extend 拓展

You can set IOverScrollCallback or add IOffsetChangeListener, if you want to achieve more complex interactions.

你还可以拓展该控件以实现更复杂的交互效果,设置 IOverScrollCallback 或者添加 IOffsetChangeListener.

IOverScrollView overScrollView = findViewById(R.id.overscroll_view);
overScrollView.setOverScrollCallback(new IOverScrollCallback() {
    @Override
    public boolean canScroll(IOverScroll overScroll, View child, int scrollDirection) {
       ...
    }

    @Override
    public int getMaxFlingOffset(IOverScroll overScroll, View child, int scrollDirection) {
        ...
    }

    @Override
    public float getDampingFactor(IOverScroll overScroll, View child, int scrollDirection) {
        ...
    }

    @Override
    public int getMinFlingVelocity(IOverScroll overScroll, View child, int scrollDirection) {
        ...
    }

    @Override
    public void onOffsetChanged(IOverScroll overScroll, View child, int offset) {
        ...
    }

    @Override
    public boolean onSpringBack(IOverScroll overScroll, View child) {
        ...
    }

    @Override
    public void onStopSpringingBack(IOverScroll overScroll, View child) {
        ...
    }
});

overScrollView.addOffsetChangeListener(new IOffsetChangeListener() {
    @Override
    public void onOffsetChanged(View child, int offset) {
        ...
    }
});

(The default IOverScrollCallback is SimpleOverScrollCallback)

(默认IOverScrollCallback接口的实现为SimpleOverScrollCallback)

Article 文章

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].