Android ScrollView向上滑动控件顶部悬浮效果实现

本文参考了:《上滑停靠顶端的悬浮框》的代码,在此表示感谢。【上滑停靠顶端的悬浮框】里的实现方法是使用两个控件,滑动时,监听ScrollView的滚动Y值,从而通过对两个控件的显示隐藏来实现控件的顶部悬浮。但是实际应用场景中,有可能需要悬浮的控件里面的内容是比较多的,如果通过显示隐藏的方式来实现的话,操作控件里的内容时,需要重复定义两套变量,对控件里的内容进行修改时也是要操作再次,非常麻烦。

本文的方法是通过addView和removeView来实现的。

一、首先让ScrollView实现滚动监听:

package com.willen.topFloatDemo;

import android.content.Context;
import android.os.Handler;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.widget.ScrollView;

/*
 * ScrollView并没有实现滚动监听,所以我们必须自行实现对ScrollView的监听,
 * 我们很自然的想到在onTouchEvent()方法中实现对滚动Y轴进行监听
 * ScrollView的滚动Y值进行监听
 */
public class MyScrollView extends ScrollView {
	private OnScrollListener onScrollListener;
    /**
     * 主要是用在用户手指离开MyScrollView,MyScrollView还在继续滑动,我们用来保存Y的距离,然后做比较
     */
    private int lastScrollY;

	public MyScrollView(Context context) {
		super(context, null);
	}
	public MyScrollView(Context context, AttributeSet attrs) {
		super(context, attrs, 0);
	}
	public MyScrollView(Context context, AttributeSet attrs, int defStyle) {
		super(context, attrs, defStyle);
	}
	/**
     * 设置滚动接口
     * @param onScrollListener
     */
	public void setOnScrollListener(OnScrollListener onScrollListener){
		this.onScrollListener = onScrollListener;
	}
	/**
     * 用于用户手指离开MyScrollView的时候获取MyScrollView滚动的Y距离,然后回调给onScroll方法中
     */
    private Handler handler = new Handler() {  

        public void handleMessage(android.os.Message msg) {
            int scrollY = MyScrollView.this.getScrollY();  

            //此时的距离和记录下的距离不相等,在隔5毫秒给handler发送消息
            if(lastScrollY != scrollY){
                lastScrollY = scrollY;
                handler.sendMessageDelayed(handler.obtainMessage(), 5);
            }
            if(onScrollListener != null){
                onScrollListener.onScroll(scrollY);
            }  

        };  

    };
    /**
     * 重写onTouchEvent, 当用户的手在MyScrollView上面的时候,
     * 直接将MyScrollView滑动的Y方向距离回调给onScroll方法中,当用户抬起手的时候,
     * MyScrollView可能还在滑动,所以当用户抬起手我们隔5毫秒给handler发送消息,在handler处理
     * MyScrollView滑动的距离
     */
	@Override
	public boolean onTouchEvent(MotionEvent ev) {
		if(onScrollListener != null){
            onScrollListener.onScroll(lastScrollY = this.getScrollY());
        }
        switch(ev.getAction()){
        case MotionEvent.ACTION_UP:
             handler.sendMessageDelayed(handler.obtainMessage(), 20);
            break;
        }
		return super.onTouchEvent(ev);
	}

	/**
     * 滚动的回调接口
     */
    public interface OnScrollListener{
        /**
         * 回调方法, 返回MyScrollView滑动的Y方向距离
         */
        public void onScroll(int scrollY);
    }
}

二、定义简单布局

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <com.willen.topFloatDemo.MyScrollView
        android:id="@+id/myScrollView"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >

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

            <RelativeLayout
                android:id="@+id/rlayout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_horizontal" >

                <TextView
                    android:id="@+id/tv"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:gravity="center_vertical"
                    android:text="顶部信息\n顶部信息\n顶部信息\n顶部信息"
                    android:textSize="40dp" />
            </RelativeLayout>

            <LinearLayout
                android:id="@+id/search02"
                android:layout_width="match_parent"
                android:layout_height="40dip"
                android:orientation="vertical" >

                <EditText
                    android:id="@+id/search_edit"
                    android:layout_width="match_parent"
                    android:layout_height="40dip"
                    android:background="@drawable/bg_edittext"
                    android:hint="请输入..."
                    android:padding="5dip"
                    android:singleLine="true"
                    android:textColorHint="#AAAAAA"
                    android:textSize="15dip" />
            </LinearLayout>

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center_horizontal"
                android:text="测试内容\n测试内容\n测试内容\n测试内容\n测试内容\n测试内容\n测试内容\n测试内容\n测试内容\n测试内容\n测试内容\n测试内容\n测试内容\n测试内容\n测试内容\n测试内容\n测试内容\n测试内容\n测试内容\n测试内容\n测试内容\n测试内容\n测试内容\n测试内容\n测试内容\n测试内容\n测试内容"
                android:textSize="40dp" />
        </LinearLayout>
    </com.willen.topFloatDemo.MyScrollView>

    <LinearLayout
        android:id="@+id/search01"
        android:layout_width="match_parent"
        android:layout_height="40dip"
        android:orientation="vertical" >
    </LinearLayout>

</RelativeLayout>

三、MainActivity

package com.willen.topFloatDemo;

import android.app.Activity;
import android.os.Bundle;
import android.widget.EditText;
import android.widget.LinearLayout;
import android.widget.RelativeLayout;

import com.willen.topFloatDemo.MyScrollView.OnScrollListener;

public class MainActivity extends Activity implements OnScrollListener{
	private EditText search_edit;
	private MyScrollView myScrollView;
    private int searchLayoutTop;

    LinearLayout search01,search02;
    RelativeLayout rlayout;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		//初始化控件
		init();
	}

	private void init() {
		search_edit = (EditText)findViewById(R.id.search_edit);
		myScrollView = (MyScrollView)findViewById(R.id.myScrollView);
		search01 = (LinearLayout)findViewById(R.id.search01);
		search02 = (LinearLayout)findViewById(R.id.search02);
		rlayout = (RelativeLayout)findViewById(R.id.rlayout);
		myScrollView.setOnScrollListener(this);  

	}

	@Override
	public void onWindowFocusChanged(boolean hasFocus) {
		super.onWindowFocusChanged(hasFocus);
        if(hasFocus){
        	searchLayoutTop = rlayout.getBottom();//获取searchLayout的顶部位置
        }
	}

	//监听滚动Y值变化,通过addView和removeView来实现悬停效果
	@Override
	public void onScroll(int scrollY) {
		if(scrollY >= searchLayoutTop){
			if (search_edit.getParent()!=search01) {
				search02.removeView(search_edit);
				search01.addView(search_edit);
			}
        }else{
        	if (search_edit.getParent()!=search02) {
        		search01.removeView(search_edit);
        		search02.addView(search_edit);
			}
        }
	}
}

代码中均有注释,应该不用再多解释了。

本文源码下载:http://download.csdn.net/detail/viviwen123/7989349

时间: 2024-11-07 16:35:51

Android ScrollView向上滑动控件顶部悬浮效果实现的相关文章

Android开源堆叠滑动控件仿探探效果

堆叠滑动控件,类似于社交软件探探的效果,并增加以下扩展: 支持滑动方向控制 支持消失方向控制 支持嵌入到ViewPager等滑动控件 支持内嵌ListView,RecycleView等滑动控件 效果演示 如何使用 xml引入StackCardsView: <com.beyondsw.lib.widget.StackCardsView android:id="@+id/cards" android:layout_width="match_parent" andr

Android 使用自定义RecyclerView控件实现Gallery效果

上篇文章给大家介绍了Android 自定义 HorizontalScrollView 打造多图片OOM 的横向滑动效果.其实制作横向滚动的不得不说另一个控件,就是Google官方最近新增加的RecyclerView,据说是ListView的升级版本,本篇文章,首先介绍RecyclerView的用法,然后经行一定的分析:最后自定义一下RecyclerView实现我们需要的相册效果. 1.RecyclerView的基本用法 首先主Activity的布局文件: <RelativeLayout xmln

Android自定义View实现随手势滑动控件

本文控件为大家分享了Android随手势滑动控件的具体代码,供大家参考,具体内容如下 1.新建自定义控件类:MyView public class MyView extends Button{ //记录上次滑动后的坐标值 private int lastX; private int lastY; public MyView(Context context) { super(context); // TODO Auto-generated constructor stub } public MyV

Android ScrollView嵌套横向滑动控件时冲突问题

前言:今天在开发的时候遇到这样的问题,最外层是ScrollView,里面嵌套了一个横向滑动的日历控件,在滑动日历的时候很卡顿.看到这种问题,自然而然的就会想到scrollview和其他可滑动控件的冲突问题. 解决思路 用户的左右滑动操作被最外层的scrollView控件处理掉了,所以只要让scrollview对左右滑动事件不监听,让其子控件处理左右滑动事件 .重写scrollview的onInterceptTouchEvent方法,当上下滑动时不处理即可. 代码如下 public void se

Android仿微信列表滑动删除之可滑动控件(一)_Android

这次是列表滑动删除的第三波,仿微信的列表滑动删除.先上个效果图:   前面的文章里面说过开源框架SwipeListView的实现原理是每个列表item中包含上下两层view,普通状态下上层的view覆盖着下层的view,当用户滑开上层的view,下层的view就显示出来了.但是仔细观察微信列表的item,很明显并非这个实现方案,微信的item应该一个单层view,只不过这个item超出了所在的ListView的宽度,在用户滑动item的时候,item超出屏幕的view则会显示在屏幕之上,这种滑动

android里引入viewflow控件里放置listview控件,滑动过快时listview失去焦点

问题描述 android里引入viewflow控件里放置listview控件,滑动过快时listview失去焦点 我看91助手主UI做的就比较好,我模仿做一个,我在适配器里用来AsyncTask异步加载,加载成功时调用notifyDataSetChanged()更新UI,但效果出来了,就是listview不稳定,容易失去焦点,有没有对滑动标签viewflow比较熟悉的啊,该怎么解决啊? 解决方案 http://zhouzhenren163.blog.163.com/blog/static/654

Android实现IOS相机滑动控件_Android

IOS相比于Android,动画效果是一方面优势,IOS相机切换时滑动的动画很不错,看着是有一个3D的效果,而且变化感觉很自然.Android也可以通过Graphics下面的Camera可以实现3D效果,开始尝试着用这个做了一下,效果不理想,滑动之后各组文字之间的距离就变了,从立体空间来说这是合逻辑的,但是看着很别捏.IOS相机的滑动效果文字之间的间隔在滑动的时候是不变的. 后面通过调整TextView X方向的scale使文字看着紧凑一点,然后通过计算的距离的方式,在滑动的时候保持各组文字之间

Android自定义View示例(三)—滑动控件

MainActivity如下: package cc.testview4; import cc.testview4.SlideView.SwitchChangedListener; import android.app.Activity; import android.os.Bundle; /** * Demo描述: * 自定义滑动控件 * * 参考资料: * http://blog.csdn.net/lfdfhl/article/details/8195441 * * 备注说明: * 在Cop

android底部菜单滑到顶部悬浮效果

问题描述 android底部菜单滑到顶部悬浮效果 页面底部有个tab切换换栏切换栏滑动到顶部的时候悬浮在那里.有什么实现的方式.或者有什么第三控件可以实现图片说明 解决方案 http://blog.csdn.net/xiaanming/article/details/17374599 是这个效果不 解决方案二: 用window,什么需求都可以搞定.