ParallaxScrollView有视差的ScrollView

Usage
Look at the demo layout for implimentation.

The basics are, that you need two views added to the ParallaxScrollView and it will do the rest.

The first View added is the Background
The second View added is the Foreground.
Layout and measuring is based roughly around a FrameLayout.

The foreground view gets wrapped with a ObservableScrollView regardless with what you put in there, so if you want full control of layout impliment like below.

Attributes

app:parallexOffset="0.3" - this number needs to be between 0.1 and 1.0. otherwise it defaults to 0.3.
ParallexScrollView.setParallexOffset(float) - this is the programatic version of the offset value.

Background The background will at the very minimum be the exact size as the parent (matches the ParallexScrollView size). If the ScrollView content is larger than the parent then background calculates a factor based on the scroll capacity, i.e. a parallexFactor of 0.5 will approximatly move the background at half the rate of the foreground scroll.

Foreground Make sure you fill the parent, I haven't overridden this but I may in the future if people have issues with it, as the background will scroll based on the size of foreground content.

Example Layout

<couk.jenxsol.parallaxscrollview.views.ParallaxScrollView xmlns:tools="http://schemas.android.com/tools"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:parallexOffset="0.25" >

    <!-- Background -->

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:scaleType="fitXY"
        android:src="@drawable/bg_sky" />

    <!-- Foreground -->
    <!-- You can place any of the items below as the foreground, but for most control, add the scroll view yourself. -->

    <couk.jenxsol.parallaxscrollview.views.ObservableScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent" >

        <LinearLayout
            android:layout_width="260dp"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:paddingBottom="@dimen/spacing"
            android:paddingTop="@dimen/spacing" >

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@android:color/white"
                android:padding="@dimen/spacing"
                android:text="@string/hello_world" />

        </LinearLayout>
    </couk.jenxsol.parallaxscrollview.views.ObservableScrollView>

</couk.jenxsol.parallaxscrollview.views.ParallaxScrollView>

评论

1 楼 plmmmmlq 2015-01-10  

demo看了不知道这个控件是做什么用的，也没有看出有什么好。