【Android】ScrollView——空间杀手

简介：大三学生党一枚！主攻Android开发，对于Web和后端均有了解。
个人语录：取乎其上，得乎其中，取乎其中，得乎其下，以顶级态度写好一篇的博客。

在我看来移动端和Web端相比，Web端同一个页面能够展现的内容更多，而移动端限于屏幕尺寸，展现的内容是有限的。今天介绍一个大软件中常用的控件ScrollView——空间杀手。
我们先展示几个ScrollView在软件中的使用。

腾讯视频

这种导航栏可以使用ViewPager+Fragment来实现，我们今天尝试用ScrollView来实现这种效果。

一.ScrollView的基本用法

1.1 ScrollView的相关属性

ScrollView控件是继承自FrameLayout的，在他内部只能放一个控件，常用方法是使用其他布局包裹我们想要的控件，并将布局放在ScrollView中。如果想要使用水平的ScrollView，系统为我们提供了HorizontalScrollView。下面的例子以HorizontalScrollView介绍
android:scrollbars：设置滚动条的显示方式，none表示不显示滚动条，其他两个表示水平和纵向显示滚动条。
android:fillViewport: 定义滚动视图是否应拉伸其内容以填充视口。

android:scrollbarSize:设置滚动条的宽度

android:scrollbarStyle:设置滚动条的位置和风格

android:scrollbarThumbHorizontal:设置水平滚动条的颜色

android:scrollbarThumbVertical：设置垂直滚动条的drawable.

android:scrollbarTrackHorizontal：设置水平滚动条背景颜色

android:scrollbarDefaultDelayBeforeFade：设置滚动条停止滚动后多久淡化至消失，以ms为单位。

android:fadeScrollbars：设置是否隐藏滚动条。

1.2 ScrollView的相关方法

addView：动态的向ScrollView中添加子View，他有几个重载的方法如下：

arrowScroll：传入View中表示方向的INT类型的值，作用是响应点击左右箭头时对滚动条的处理。

smoothScrollTo：缓慢柔顺的滚动到指定的位置

//这些方法都是在xml中定义的属性，可以在代码中进行设置
        scrollView.setScrollBarDefaultDelayBeforeFade();
        scrollView.setScrollBarFadeDuration();
        scrollView.setScrollbarFadingEnabled();
        scrollView.setScrollBarSize();
        scrollView.setScrollBarStyle();
        scrollView.setHorizontalScrollbarThumbDrawable();

感觉ScrollView非常生硬！其实就是套了个滑动列表，在使用方面完全没什么技巧。

1.3 ScrollView的简单用法

<HorizontalScrollView
        android:id="@+id/horizontal_scroll"
        android:layout_width="match_parent"
        android:scrollIndicators="top"
        android:fillViewport="false"
        android:scrollbarThumbHorizontal="@color/colorAccent"
        android:scrollbars="horizontal"
        android:scrollbarTrackHorizontal="@color/colorPrimary"
        android:scrollbarDefaultDelayBeforeFade="10"
        android:fadeScrollbars="true"
        android:scrollbarSize="2dp"
        android:layout_height="60dp">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="60dp"
        android:orientation="horizontal"/>
       
  </HorizontalScrollView>

如果想要监听内部的点击事件，直接给控件添加相应的响应就可以咯！

二.ScrollView实战腾讯导航栏

布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".utils.view.ScrollViewActivity">
    <HorizontalScrollView
        android:id="@+id/horizontal_scroll"
        android:layout_width="match_parent"
        android:scrollIndicators="top"
        android:fillViewport="false"
        android:scrollbarThumbHorizontal="@color/colorAccent"
        android:scrollbars="horizontal"
        android:scrollbarTrackHorizontal="@color/colorPrimary"
        android:scrollbarDefaultDelayBeforeFade="10"
        android:fadeScrollbars="true"
        android:scrollbarSize="2dp"
        android:layout_height="80dp">
    <LinearLayout
        android:id="@+id/scroll_linearlayout"
        android:layout_width="match_parent"
        android:layout_height="60dp"
        android:background="@color/deep"
        android:orientation="horizontal">
    </LinearLayout>
   </HorizontalScrollView>
</LinearLayout>

scroll_item.xml布局，就是每个TextView的布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TextView
        android:textColor="#FFFFFF"
        android:textSize="20sp"
        android:gravity="center"
        android:id="@+id/scroll_text"
        android:layout_width="60dp"
        android:layout_height="match_parent">
    </TextView>
</LinearLayout>

代码控制

@ContentView(R.layout.activity_scroll_view)
public class ScrollViewActivity extends Activity {
    @ViewInject(R.id.horizontal_scroll)
    private HorizontalScrollView scrollView;
    @ViewInject(R.id.scroll_linearlayout)
    private LinearLayout linearLayout;

    @RequiresApi(api = Build.VERSION_CODES.Q)
    @Override
    public void initWidget() {
        scrollView.arrowScroll(View.FOCUS_RIGHT);
        //填充数据
        String[] title = new String[]{"推荐","爱看","体育","电视剧","电影","少儿","动漫","历史","直播","美食","游戏",
                "推荐","爱看","体育","电视剧","电影","少儿","动漫","历史","直播","美食","游戏"};
        for(int i=0;i<title.length;i++){
            View view = LayoutInflater.from(getApplicationContext()).inflate(R.layout.scroll_item, null);
            TextView textView = view.findViewById(R.id.scroll_text);
            textView.setText(title[i]);
            linearLayout.addView(view);
        }

    }

效果图

这个控件就是有点死板，没有太多可以拓展的地方。但是大部分情况下我们使用无需要那么复杂。

三.总结

感谢阅读，今天选错题了，没想到ScrollView并没有什么拓展点，导致整篇文章平平淡淡。

先别走，我有一个资源学习群要推荐给你，它是白嫖党的乐园，小白的天堂！

别再犹豫，一起来学习！