美文网首页Android开发探索Android DemoAndroid开发
Android比较常见的滚动视图吸顶效果

Android比较常见的滚动视图吸顶效果

作者: 代码打志bin | 来源:发表于2018-04-04 18:14 被阅读714次

    如题,直接上效果图,就是这么粗暴


    吸顶效果

    原理

    这个吸顶效果的原理很简单,就是一个视觉效果



    如图,其实页面上有两个相同布局的标题,吸顶标题默认隐藏,然后监听ScrollView滚动的高度Y,当滚动的高度Y大于内容1的高度,吸顶标题显示,反之,隐藏吸顶标题。这样从视觉效果上看,标题具有吸顶效果。是不是很easy

    代码

    public class MainActivity extends AppCompatActivity
    {
    
        private ScrollView scrollView;
        private TextView tv_content;//内容1
        private TextView tv_title_top;//吸顶标题
    
        @RequiresApi(api = Build.VERSION_CODES.M)
        @Override
        protected void onCreate(Bundle savedInstanceState)
        {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
            scrollView = (ScrollView) findViewById(R.id.scrollView);
            tv_content = (TextView) findViewById(R.id.tv_content);
            tv_title_top = (TextView) findViewById(R.id.tv_title_top);
    
            //scrollview滚动监听
            scrollView.setOnScrollChangeListener(new View.OnScrollChangeListener()
            {
                @Override
                public void onScrollChange(View v, int scrollX, int scrollY, int oldScrollX, int oldScrollY)
                {
                    //scrolly:scrollview滚动的高度
                    //tv_content.getHeight()内容1的高度
                    if (scrollY > tv_content.getHeight())
                    {
                        tv_title_top.setVisibility(View.VISIBLE);
                    } else
                    {
                        tv_title_top.setVisibility(View.GONE);
                    }
                }
            });
        }
    }
    

    这里有个问题,scrollview的setOnScrollChangeListener滚动监听,要求6.0(API23)之后才能用。
    解决方法:在6.0以下有onScrollChanged方法,也能监听scrollview滑动,但是这个方法不能直接调用,所以要自定义一个继承scrollview的view,提供一个方法,把onScrollChanged暴露出来。

    import android.content.Context;
    import android.util.AttributeSet;
    import android.widget.ScrollView;
    
    public class MyScrollView extends ScrollView
    {
        private ScrollViewListener scrollViewListener = null;
    
        public interface ScrollViewListener
        {
            void onScrollChanged(MyScrollView scrollView, int l, int t, int oldl, int oldt);
        }
    
        public void setScrollViewListener(ScrollViewListener scrollViewListener)
        {
            this.scrollViewListener = scrollViewListener;
        }
    
        public MyScrollView(Context context, AttributeSet attrs)
        {
            super(context, attrs);
        }
    
        //此方法受保护的
        @Override
        protected void onScrollChanged(int l, int t, int oldl, int oldt)
        {
            super.onScrollChanged(l, t, oldl, oldt);
            if (scrollViewListener != null) 
            {  
                scrollViewListener.onScrollChanged(this, l, t, oldl, oldt);  
            }  
        }
    }
    

    然后用MyScrollview替换掉原来的scrollview,调用滚动监听方法

            scrollView.setScrollViewListener(new MyScrollView.ScrollViewListener()
            {
                @Override
                public void onScrollChanged(MyScrollView scrollView, int l, int t, int oldl, int oldt)
                {
                    //t:scrollview滚动的高度
                    //tv_content.getHeight()内容1的高度
                    if (t > tv_content.getHeight())
                    {
                        tv_title_top.setVisibility(View.VISIBLE);
                    } else
                    {
                        tv_title_top.setVisibility(View.GONE);
                    }
                }
            });
    

    相关文章

      网友评论

      • nemuni:6.0以下的解决方法看的不是很明白,请问最后是怎么调用到自定义listener中的onscrollchsnged方法的?
        nemuni:@代码打志bin 恩恩这样就通了,谢谢~
        代码打志bin:不好意思,这边少贴了一段代码,需要在受保护的onScrollChanged()中调用接口里的方法
        if (scrollViewListener != null)
        {
        scrollViewListener.onScrollChanged(this, l, t, oldl, oldt);
        }
      • HarveyLegend:哈哈,这个思路超简单
        代码打志bin:嗯啊。这个相对简单,也可以用NestedScrollView来实现
      • 旧巷听风雨染尘:直接用nestedwscrollview可以直接添加滑动监听
        代码打志bin:3Q,等下试试这个控件,还没用过:smile:

      本文标题:Android比较常见的滚动视图吸顶效果

      本文链接:https://www.haomeiwen.com/subject/usohhftx.html