`

解决ViewFlipper与ScrollView滑动响应事件拦截的问题

阅读更多
最近在做一个简单的展示界面时,遇到了一个比较棘手的问题。由于要展示多项内容,所以使用ViewFlipper作为水平滑动容器;而每项内容中由于许多文本较长,因此需要使用ScrollView作为垂直滑动容器。基本的界面布局大致如下:

外部文件common_list_view.xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/geyan_query_view_layout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="@drawable/mid_bg">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginTop="43dip"
android:orientation="vertical"
android:gravity="top"
android:layout_gravity="top">
<Gallery
android:id="@+id/gallery_data"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="top"
android:layout_gravity="top"
android:spacing="60dip"
android:paddingLeft="6dip"
android:paddingRight="6dip"
>
</Gallery>
</LinearLayout>
<ImageView
android:id="@+id/main_background"
android:layout_width="fill_parent"
android:layout_height="fill_parent"/>
<include layout="@layout/common_title_view"
android:id="@+id/title"/>
</RelativeLayout>


内部文件common_info_view.xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:id="@+id/linear">
<TextView
android:id="@+id/text_title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="5dip"
android:layout_marginTop="5dip"
android:gravity="center"
android:textSize="20sp"
android:textStyle="bold"
android:textColor="#181712"
/>
<ScrollView
android:id="@+id/scroll"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginBottom="5dip"
android:fadeScrollbars="true"
>
<TextView
android:id="@+id/text_detail"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:lineSpacingMultiplier="1.3"
android:textSize="18sp"
android:textColor="#181712"
android:singleLine="false"
/>
</ScrollView>
</LinearLayout>


由于ViewFlipper在外,ScrollView在内,因此一般的做法是定义一个手势响应类来处理响应事件,并将响应事件的处理交给内层的ScrollView。大致代码如下:
import android.app.Activity;
import android.os.Bundle;
import android.util.Log;
import android.view.GestureDetector;
import android.view.GestureDetector.SimpleOnGestureListener;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.MotionEvent;
import android.view.View;
import android.view.Window;
import android.widget.TextView;
import android.widget.Toast;
import android.widget.ViewFlipper;
 
public class Test1 extends Activity {
 
	private ViewFlipper viewFlipper;
 
	private String[] descriptionsArray;
	private String[] titleArray;
 
	private int selectedPosition;
 
	private TextView textViewTitle;
	private TextView textViewContent;
	private FriendlyScrollView scroll;
 
	private LayoutInflater mInflater;
 
	private GestureDetector gestureDetector;
 
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		// TODO Auto-generated method stub
 
		requestWindowFeature(Window.FEATURE_NO_TITLE);
		setContentView(R.layout.common_info_list_view);
 
		InitUI();
 
		super.onCreate(savedInstanceState);
 
		Toast.makeText(this, R.string.hello, Toast.LENGTH_SHORT).show();
	}
 
	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		// TODO Auto-generated method stub
        super.onCreateOptionsMenu(menu);
        return false;
	}
 
	@Override
	public void onBackPressed() {
		// TODO Auto-generated method stub
		finish();
	}
 
	private void InitUI(){
 
		viewFlipper = (ViewFlipper) findViewById(R.id.viewflipper_data);
 
		mInflater = LayoutInflater.from(this);
 
		fillDate();
 
		viewFlipper.addView(getContentView());
	}
 
	private void fillDate(){
		selectedPosition = 0;
 
		titleArray = getResources().getStringArray(R.array.title_array);
		descriptionsArray = getResources().getStringArray(R.array.description_array);
 
		gestureDetector = new GestureDetector(new CommonGestureListener());
	}
 
	private View getContentView() {
		View contentView = new View(this);
		contentView = mInflater.inflate(R.layout.common_info_item_view, null);
 
		textViewTitle = (TextView) contentView.findViewById(R.id.text_title);
		textViewContent = (TextView) contentView.findViewById(R.id.text_detail);
 
		textViewTitle.setText(titleArray[selectedPosition]);
		textViewTitle.setPadding(10, 0, 10, 0);
		textViewContent.setText(descriptionsArray[selectedPosition]);
		textViewContent.setPadding(10, 5, 10, 5);
 
		scroll = (FriendlyScrollView) contentView.findViewById(R.id.scroll);
		scroll.setOnTouchListener(onTouchListener);
		scroll.setGestureDetector(gestureDetector);
 
		return contentView;
	}
 
	private View.OnTouchListener onTouchListener = new View.OnTouchListener() {
 
		public boolean onTouch(View v, MotionEvent event) {
			// TODO Auto-generated method stub
			return gestureDetector.onTouchEvent(event);
		}
	};
 
	public class CommonGestureListener extends SimpleOnGestureListener {
 
		@Override
		public boolean onDown(MotionEvent e) {
			// TODO Auto-generated method stub
			Log.d("QueryViewFlipper", "====> Jieqi: do onDown...");
			return false;
		}
 
		@Override
		public void onShowPress(MotionEvent e) {
			// TODO Auto-generated method stub
			Log.d("QueryViewFlipper", "====> Jieqi: do onShowPress...");
			super.onShowPress(e);
		}
 
		@Override
	    public void onLongPress(MotionEvent e) {
	        // TODO Auto-generated method stub
			Log.d("QueryViewFlipper", "----> Jieqi: do onLongPress...");
	    }
 
		@Override
		public boolean onSingleTapConfirmed(MotionEvent e) {
			// TODO Auto-generated method stub
			Log.d("QueryViewFlipper", "====> Jieqi: do onSingleTapConfirmed...");
			return false;
		}
 
		@Override
		public boolean onSingleTapUp(MotionEvent e) {
			// TODO Auto-generated method stub
			Log.d("QueryViewFlipper", "====> Jieqi: do onSingleTapUp...");
			return false;
		}
 
		@Override
		public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,
				float velocityY){
			// TODO Auto-generated method stub
			Log.d("QueryViewFlipper", "====> Jieqi: do onFling...");
			if (e1.getX() - e2.getX() > 100 &amp;&amp; Math.abs(velocityX) > 50) {
				//向左
				selectedPosition = selectedPosition + 1 < titleArray.length ? (selectedPosition + 1) : 0;
				viewFlipper.addView(getContentView());
				viewFlipper.setInAnimation(AnimationControl.inFromRightAnimation());
                viewFlipper.setOutAnimation(AnimationControl.outToLeftAnimation());
                viewFlipper.showNext();
                viewFlipper.removeViewAt(0);
			} else if (e2.getX() - e1.getX() > 100 &amp;&amp; Math.abs(velocityX) > 50) {
				//向右
				selectedPosition = selectedPosition > 0 ? (selectedPosition - 1) : (titleArray.length - 1);
				viewFlipper.addView(getContentView());
				viewFlipper.setInAnimation(AnimationControl.inFromLeftAnimation());
                viewFlipper.setOutAnimation(AnimationControl.outToRightAnimation());
				viewFlipper.showNext();
				viewFlipper.removeViewAt(0);
			}
			return true;
		}
 
		@Override
		public boolean onScroll(MotionEvent e1, MotionEvent e2,
				float distanceX, float distanceY) {
			// TODO Auto-generated method stub
			Log.d("QueryViewFlipper", "====> Jieqi: do onScroll...");
			return super.onScroll(e1, e2, distanceX, distanceY);
		}
 
    }
}


这个时候问题出现了,通过Log显示,当ScrollView中内容太短的时候,ScrollView不会触发OnScroll和OnFling事件,导致ViewFlipper左右滑动不响应。(当然后来的另一个测试表明这个问题在ListView上不存在)

为了解决这一个问题,我重新自定义了一个FriendlyScrollView类,来重写ScrollView的onTouchEvent和dispatchTouchEvent方法,具体如下:
import android.content.Context;
import android.util.AttributeSet;
import android.view.GestureDetector;
import android.view.MotionEvent;
import android.widget.ScrollView;
 
public class FriendlyScrollView extends ScrollView {
 
	GestureDetector gestureDetector;
 
    public FriendlyScrollView(Context context) {
		super(context);
		// TODO Auto-generated constructor stub
	}
 
	public FriendlyScrollView(Context context, AttributeSet attrs) {
		super(context, attrs);
		// TODO Auto-generated constructor stub
	}
 
	public FriendlyScrollView(Context context, AttributeSet attrs, int defStyle) {
		super(context, attrs, defStyle);
		// TODO Auto-generated constructor stub
	}
 
	public void setGestureDetector(GestureDetector gestureDetector) {
		this.gestureDetector = gestureDetector;
	}
 
	@Override
	public boolean onTouchEvent(MotionEvent event) {
	    super.onTouchEvent(event);
	    return gestureDetector.onTouchEvent(event);
	}
 
	@Override
	public boolean dispatchTouchEvent(MotionEvent ev){
	    gestureDetector.onTouchEvent(ev);
	    super.dispatchTouchEvent(ev);
	    return true;
	} 
 
}

然后将common_info_view.xml和程序中的ScrollView改成FriendlyScrollView,终于解决了这个问题。

http://disanji.net/2011/02/19/solve-viewflipper-scrollview-flip-problem/
分享到:
评论
1 楼 416849838 2012-06-01  
有源码没

相关推荐

    最简单的ViewFlipper实现图片跟随手势滑动

    在这个“最简单的ViewFlipper实现图片跟随手势滑动”的教程中,我们将深入探讨如何通过源码和工具来创建一个用户可以通过手势左右滑动来切换图片的应用。 首先,我们要了解ViewFlipper的基本用法。ViewFlipper继承...

    Android常见的4种引导页splash、viewpage,viewflipper,scrollview

    本文将详细介绍Android应用中四种常见的引导页实现方式:Splash、ViewPager、ViewFlipper以及ScrollView,并探讨它们的优缺点。 1. **Splash Screen(水波纹启动页)** Splash Screen是最传统的引导页形式,它通常...

    Android使用ViewFlipper实现左右滑动效果面

    这样,当用户在ViewFlipper上滑动时,GestureDetector就能捕获到滑动事件。 4. **处理ViewFlipper的切换**: 在GestureDetector的onFling()方法中,根据滑动的速率和方向,调用ViewFlipper的showNext()或...

    ViewFlipper解决事件冲突

    总的来说,解决ViewFlipper中的事件冲突关键在于理解和控制事件分发,以及适当地使用GestureDetector来识别和处理滑动事件。通过对滑动和点击事件的精确控制,我们可以创建出更符合用户预期的交互体验。

    Android使用ViewFlipper做页面切换,与手势滑动切换的使用

    5. onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY):滑动手势事件; 6. onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY):在屏幕上拖动事件。 主要判断...

    ViewFlipper实现界面滑动切换

    ViewFlipper是Android SDK提供的一款用于在多个视图之间进行滑动切换的控件,它非常适合于创建动态的用户界面,比如图片轮播、广告横幅等场景。在这个主题中,我们将深入探讨如何使用ViewFlipper来实现界面的滑动...

    ViewFlipper水平滑动.zip

    3. **监听用户手势**:你可以使用GestureDetector或SwipeRefreshLayout来监听用户的滑动事件,根据手势切换ViewFlipper中的视图。 4. **触发视图切换**:可以使用ViewFlipper的`showNext()`或`showPrevious()`方法...

    android 利用ViewFlipper来实现滑动切换Activity

    利用viwflipper来将多个activity封装在一个view中,通过实现OnGestureListener接口的onTouchEvent()方法和onFling() 方法,即可通过手持滑动切换activity。

    ViewFlipperAndroid:ScrollView 内的 ViewFlipper

    5. **事件处理**:当`ScrollView`和`ViewFlipper`都需要响应触摸事件时,需正确处理事件分发,避免相互之间的影响。可以使用`onInterceptTouchEvent`和`onTouchEvent`方法来控制事件的传递。 在实际项目中,`...

    ViewFlipper简单实现横屏滑动

    然后,对ScrollView设置滑动监听,根据滑动方向触发ViewFlipper的切换: ```java scrollView.setOnTouchListener(new View.OnTouchListener() { @Override public boolean onTouch(View v, MotionEvent event) { ...

    android 利用ViewFlipper来实现滑动切换

    在Android开发中,ViewFlipper是一个非常有用的布局组件,它允许开发者轻松地实现在多个视图之间进行滑动切换的效果。这种效果常见于各种应用程序,如轮播图、页面导航等。下面我们将深入探讨如何利用ViewFlipper...

    ViewFlipper实现滑动轮播

    这可以通过监听ViewFlipper的滑动事件并调用`showNext()`或`showPrevious()`方法来实现。 总的来说,ViewFlipper是Android中实现滑动轮播的一种高效且灵活的方式。通过合理配置动画和定时器,我们可以轻松创建出...

    TabHost + ViewFlipper实现滑动翻页

    在代码中,我们可以通过监听`TabHost`的`OnTabChangeListener`事件来控制`ViewFlipper`的切换。同时,我们可以设置`ViewFlipper`的滑动监听器,实现平滑的滑动效果。 在`TabHost`中实现背景图片自动切换的功能,...

    android viewflipper 图片滑动demo

    在Android开发中,ViewFlipper是一个非常有用的布局组件,它允许开发者轻松地在多个视图之间切换,常用于实现滑动浏览效果,如教程、引导页或者轮播图等。本示例“android viewflipper 图片滑动demo”正是这样一个...

    Android ViewFlipper图片水平滑动

    说到android的左右滑动效果我们可以说是在每个应用上面都可以看到这样的效果,不管是微博,还是QQ等。实现左右滑动的方式很多,有ViewPaer(不过这个和需要android-support-v4.jar的支持),自定义实现Viewgroup,...

    使用ViewFlipper实现图片左右滑动效果

    ViewFlipper,不妨把它看做一个容器吧,你可以把许多的View放在这个容器中,让它展示给用户,虽然它每次只展示一个view,我感觉它的用途更好是作为广告展示,比如类似购物网站那样的广告滚动展示。这个demo是一个...

    cod.rar_android

    总的来说,解决ViewFlipper与ScrollView滑动事件冲突的关键在于正确地拦截和处理滑动事件,确保每个组件只处理与其功能相符的事件。通过自定义控件、设置OnTouchListener或使用GestureDetector,我们可以实现这一...

    安卓Android源码——ViewFlipper水平滑动.rar

    通过对源代码的阅读和分析,我们可以学习到如何在Android应用中创建和控制ViewFlipper,如何设置动画,以及如何响应用户的触摸事件来实现平滑的视图切换。这将有助于开发者提升在Android UI设计和动画处理方面的专业...

    ViewPager和ViewFlipper实现图片左右滑动

    在Android开发中,为了提供优秀的用户体验,经常需要实现图片的左右滑动切换功能,这通常是通过ViewPager或ViewFlipper组件来完成的。这两个组件都属于Android SDK中的布局管理器,可以方便地展示多个视图并支持用户...

Global site tag (gtag.js) - Google Analytics