Android渐变界面设计

核心代码

android:fadingEdgeLength=“100dp”
android:requiresFadingEdge=“vertical”

知识要点

fadingEdgeLength：设置边框渐变的长度
requiresFadingEdge：表示阴影的方向
cacheColorHint：改变渐变的颜色。和在主题中修改colorBackgroundCacheHint属性一样，都能改变渐变的颜色。

代码实现

（1）TextView

    <com.tcl.uicompat.TCLTextViewScroll
        android:id="@+id/main_list"
        style="@style/TextBody2"
        android:layout_width="1200px"
        android:layout_height="800px"
        android:fadingEdgeLength="100dp"
        android:requiresFadingEdge="vertical"
        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你要藏好软弱，世界大雨滂沱。万物苟且而活，无人为你背负更多。\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目之所及，皆是回忆，心之所想，皆是过往，眼之所看，皆是遗憾。\n“眉眼间的故事，不是喜欢就是辜负”\n"
        tools:ignore="HardcodedText,PxUsage" />

注：TCLTextViewScroll继承于TextView，不同的是，在构造函数中添加了如下语句：setMovementMethod(ScrollingMovementMethod.getInstance());

（2）ListView

    <ListView
        android:id="@+id/lv"
        android:layout_width="1200px"
        android:layout_height="match_parent"
        android:cacheColorHint="#FF008000"
        android:fadingEdgeLength="100dp"
        android:requiresFadingEdge="vertical"
        tools:ignore="PxUsage" />

（3）RecyclerView

<?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"
    android:background="?attr/element_background_picture"
    android:clipChildren="false"
    android:gravity="center">

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/rv_gradient"
        android:layout_width="1020dp"
        android:layout_height="match_parent"
        android:fadingEdgeLength="100dp"
        android:requiresFadingEdge="vertical" />

</LinearLayout>

/**
 * Created by Agg on 2020/03/11.
 */
public class GradientDemoActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_demo_gradient);
        RecyclerView rvGradient = findViewById(R.id.rv_gradient);
        rvGradient.setLayoutManager(new GridLayoutManager(this, 3, LinearLayoutManager.VERTICAL, false));
        rvGradient.addItemDecoration(new GradientItemDecoration());

        Map<String, Integer> dataList = new HashMap<>();
        for (int i = 0; i < 40; i++) {
            dataList.put("title" + i, R.drawable.ic_launcher);
        }
        GradientAdapter gradientAdapter = new GradientAdapter(dataList);
        rvGradient.setAdapter(gradientAdapter);

    }

    private class GradientAdapter extends RecyclerView.Adapter<GradientHolder> {

        private Map<String, Integer> dataList;

        GradientAdapter(Map<String, Integer> dataList) {
            this.dataList = dataList;
        }

        @NonNull
        @Override
        public GradientHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
            return new GradientHolder(new TCLItemSmall(parent.getContext()));
        }

        @RequiresApi(api = Build.VERSION_CODES.JELLY_BEAN)
        @Override
        public void onBindViewHolder(@NonNull GradientHolder holder, int position) {
            for (String title : dataList.keySet()) {
                holder.initData(title, dataList.get(title));//调试使用，就取一个值演示就可。
                return;
            }
        }

        @Override
        public int getItemCount() {
            return dataList.size();
        }
    }

    private class GradientHolder extends RecyclerView.ViewHolder {

        TCLItemSmall tclItemSmall;

        GradientHolder(@NonNull View itemView) {
            super(itemView);
            tclItemSmall = (TCLItemSmall) itemView;
        }

        @SuppressLint("NewApi")
        @RequiresApi(api = Build.VERSION_CODES.JELLY_BEAN)
        void initData(String title, int rightDrawableRes) {
            tclItemSmall.getTitle().setText(title);
            tclItemSmall.getRightIcon().setBackground(getDrawable(rightDrawableRes));
        }
    }

    private class GradientItemDecoration extends RecyclerView.ItemDecoration {
        @Override
        public void getItemOffsets(@NonNull Rect outRect, @NonNull View view, @NonNull RecyclerView parent, @NonNull RecyclerView.State state) {
            super.getItemOffsets(outRect, view, parent, state);
            outRect.left = 20;
            outRect.right = 20;
            outRect.bottom = 20;
            outRect.top = 20;
        }
    }

}

效果展示

bug解决

在某些Android机器上，使用RecyclerVIew的上下渐隐时可能会遇到bug，使用方式如下：

现象如下：

右边上下有很细的一段黑线，目前没找到具体原因，有如下两种方式规避黑线的出现：

1. 调整布局，我是android:layout_width="match_parent"和android:layout_marginEnd="83px"时出现了黑线，将android:layout_marginEnd改为67没有黑线，经测试68又有黑线。
2. 不使用android:layout_width=“match_parent”，而采用android:layout_width=“wrap_content”，可以规避黑线。
3. 或者上线两种方式都试一下，通过微调布局，总可以规避黑线的。

以后待进一步探究根本，为啥有些Android机器会出现黑线（需要开发者去规避），有些Android机器不会出现黑线。