最近看了滚动视差的例子,写了个小demo,不能调节参数,但能够随着ScrollView的滑动而滑动。在这里要强调一下滚动视差的意思,就是背景层的滑动速度没有ScrollView的滑动速度快。通过这个小例子,我对ScrollView的理解更深了。不多说,上代码。
首先是自己定义的ScrollView:
package com.example.parallxscrollview;
import android.content.Context;
import android.util.AttributeSet;
import android.widget.ScrollView;
public class MyScrollView extends ScrollView{
private ScrollChangeListener scrollChangeListener;
public MyScrollView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
public MyScrollView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public MyScrollView(Context context) {
super(context);
}
public void setScrollChangeListener(ScrollChangeListener scrollChangeListener) {
this.scrollChangeListener = scrollChangeListener;
}
@Override
protected void onScrollChanged(int l, int t, int oldl, int oldt) {
super.onScrollChanged(l, t, oldl, oldt);
if (null != scrollChangeListener) {
scrollChangeListener.scollChange(getScrollY());
}
}
}
在这里要把ScrollView滑动的距离即getScrollY()传给背景。
接着就是大头了
package com.example.parallxscrollview;
import android.content.Context;
import android.util.AttributeSet;
import android.view.View.MeasureSpec;
import android.widget.FrameLayout;
import android.widget.ImageView;
public class MyFrameLayout extends FrameLayout implements ScrollChangeListener{
private ImageView skinImageView;
private MyScrollView myScrollView;
private int contentHeight;
private int minusContentHeight;
private float diff = 0.2f;
public MyFrameLayout(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
// TODO Auto-generated constructor stub
}
public MyFrameLayout(Context context, AttributeSet attrs) {
super(context, attrs);
// TODO Auto-generated constructor stub
}
public MyFrameLayout(Context context) {
super(context);
// TODO Auto-generated constructor stub
}
public void setSkin(ImageView skinImageView) {
this.skinImageView = skinImageView;
}
public void setScrollView(MyScrollView myScrollView) {
this.myScrollView = myScrollView;
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
//取得肉容的宽度
contentHeight = myScrollView.getChildAt(0).getMeasuredHeight();
minusContentHeight = (int) (myScrollView.getMeasuredHeight() + (contentHeight - myScrollView.getMeasuredHeight()) *diff);
measureChild(skinImageView, MeasureSpec.makeMeasureSpec(
skinImageView.getMeasuredWidth(), MeasureSpec.EXACTLY),
MeasureSpec.makeMeasureSpec(minusContentHeight, MeasureSpec.EXACTLY));
}
@Override
public void scollChange(int scrollY) {
// TODO Auto-generated method stub
skinImageView.layout(getLeft(), (int)(-scrollY * diff), getRight(), (int)(-scrollY * diff) + minusContentHeight);
}
}
interface ScrollChangeListener {
public void scollChange(int scrollY);
}
在这里重点是measureChild()函数,按照我的理解,它是再一次测量child的宽、高,再layout。
接着是Activity:
package com.example.parallxscrollview;
import android.app.Activity;
import android.os.Bundle;
import android.widget.ImageView;
public class MainActivity extends Activity {
private ImageView skinImageView;
private MyFrameLayout myFrameLayout;
private MyScrollView myScrollView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
skinImageView = (ImageView) findViewById(R.id.skin);
myFrameLayout = (MyFrameLayout) findViewById(R.id.myFrameLayout);
myScrollView = (MyScrollView) findViewById(R.id.myScrollView);
myFrameLayout.setSkin(skinImageView);
myScrollView.setScrollChangeListener(myFrameLayout);
myFrameLayout.setScrollView(myScrollView);
}
@Override
protected void onResume() {
super.onResume();
}
}
再来布局:
<com.example.parallxscrollview.MyFrameLayout 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"
android:id="@+id/myFrameLayout">
<ImageView
android:id="@+id/skin"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/bg_sky" />
<com.example.parallxscrollview.MyScrollView
android:id="@+id/myScrollView"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/content"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/content"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/content"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/content"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/content"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/content"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/content"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/content"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/content"/>
</LinearLayout>
</com.example.parallxscrollview.MyScrollView>
</com.example.parallxscrollview.MyFrameLayout>
再来上传我的图片: