Android史上最强分割线全攻略

借鉴自

https://blog.csdn.net/megatronkings/article/details/52156312

说实话，分割线这个东西，真的太难太难了！！！

难在何处？难在用最对的方式去实现它！

1.view——管理代码不便，绘制开销大。非常非常不好

2.图片——修改不便，增加apk体积。非常非常不好

3.Java代码——使用不便，增加代码量。非常非常不好

4.layer-list通过覆盖实现——过度绘制，修改不便。非常非常不好

5.shape——设置成background会自动填充，无法实现！

6.自定义控件——做模块化的时候，需要移植这个库。不太好

7.不充满的底部分割线的这种情况，实现起来更难——又一限制条件

所以他难

本人在探索了2个小时后，终于得出了结论

1.LinearLayout——虽然background这个属性会自动填充，不能用，但是他有divider属性！

2.其他布局——自定义控件

3.RecyclerView——ItemDecoration

下面我将给出这些情况的代码，你可以直接拷去用。

代码原理就不解释了，太简单了。有问题留言。

LinearLayout充满的底部分割线（其他方向的分割线也一样）

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">

    <size android:height="1dp"/>
    <solid android:color="@color/colorAccent"/>

</shape>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:divider="@drawable/line_bottom"
    android:showDividers="end"android:orientation="vertical"
    xmlns:tools="http://schemas.android.com/tools">

效果

LinearLayout不充满的底部分割线

<?xml version="1.0" encoding="utf-8"?>
<inset xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@drawable/line_bottom"
    android:insetLeft="15dp">
</inset>

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">

    <size android:height="1dp"/>
    <solid android:color="@color/colorAccent"/>

</shape>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:divider="@drawable/line_bottom_not_full"android:showDividers="end"
    android:orientation="vertical"
    xmlns:tools="http://schemas.android.com/tools">

效果

其他布局：网上开源库很多，不过我不太喜欢用别人的库，所以自己实现了一个（实现了主流的RelativeLayout和FrameLayout）

attrs

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="BorderRelativeLayout">
        <attr name="margin_start" format="dimension"/>线到起始端的margin
        <attr name="margin_end" format="dimension"/>线到末端的margin
        <attr name="width" format="dimension"/>线的宽度
        <attr name="color" format="color"/>线的颜色
        <attr name="position" format="string"/>线的位置：left、top、right、bottom
    </declare-styleable>
</resources>

border relative layout

package com.example.filemanager;

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.util.Log;
import android.widget.RelativeLayout;

// TODO: 2018/5/3 如果你想多弄几条线 或者位置有特殊需求 自己改写呗！

public class BorderRelativeLayout extends RelativeLayout {private static final String TAG = "xbh";

    public BorderRelativeLayout(Context context, AttributeSet attrs) {super(context, attrs);

        //params

        TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.BorderRelativeLayout);

        startMargin = ta.getDimension(R.styleable.BorderRelativeLayout_margin_start, 0);
        endMargin = ta.getDimension(R.styleable.BorderRelativeLayout_margin_end, 0);
        width = ta.getDimension(R.styleable.BorderRelativeLayout_width, 0);
        int color = ta.getColor(R.styleable.BorderRelativeLayout_color, Color.GRAY);
        position = ta.getString(R.styleable.BorderRelativeLayout_position);

        ta.recycle();

        //init paint

        paint.setColor(color);
    }//拿到绘制坐标:position、margin、width

    private static final String LEFT = "left";
    private static final String TOP = "top";
    private static final String RIGHT = "right";
    private static final String BOTTOM = "bottom";

    private float startMargin;
    private float endMargin;
    private float width;
    private final String position;

    private float left;
    private float top;
    private float right;
    private float bottom;

    @Override
    protected void onLayout(boolean changed, int l, int t, int r, int b) {super.onLayout(changed, l, t, r, b);

        int w = getWidth();
        int h = getHeight();

        if (LEFT.equals(position)) {left = 0;
            top = startMargin;
            right = width;
            bottom = h - endMargin;
        } else if (TOP.equals(position)) {left = startMargin;
            top = 0;
            right = w - endMargin;
            bottom = width;
        } else if (RIGHT.equals(position)) {left = w - width;
            top = startMargin;
            right = w;
            bottom = h - endMargin;
        } else if (BOTTOM.equals(position)) {left = startMargin;
            top = h - width;
            right = w - endMargin;
            bottom = h;
        }}//

    private final Paint paint = new Paint();

    @Override
    protected void dispatchDraw(Canvas canvas) {super.dispatchDraw(canvas);

        canvas.drawRect(left, top, right, bottom, paint);
    }
}

使用

<com.example.filemanager.BorderRelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:showDividers="end"
    android:divider="@drawable/line_bottom_not_full"
    android:orientation="vertical"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    app:margin_start="0dp"
    app:margin_end="0dp"
    app:width="1dp"
    app:position="left"
    app:color="#000">

测试了下非常好用。

frame layout你只需要改个名，继承自frame layout即可。

RecyclerView

列表的情况上面就不适用了，因为最后一个item我们不期望有线。

rv.addItemDecoration(new DividerItemDecoration(activity, DividerItemDecoration.VERTICAL));

这行代码就会为我们处理的很好。

效果如下

如果我们对他默认的样式不满意呢？

我们可以通过setDrawable的方式去设置我们drawable文件夹下自己定义的线。但是这导致的后果是我们最后一个item也有了线。所以我们需要自定义ItemDecoration。

（解决方案学习自：https://www.jianshu.com/p/26b33e1181e3 自己重写了一个DividerItemDecoration）

static class DividerItemDecoration extends RecyclerView.ItemDecoration {public static final int HORIZONTAL = LinearLayout.HORIZONTAL;
    public static final int VERTICAL = LinearLayout.VERTICAL;
    private static final String TAG = "DividerItem";
    private static final int[] ATTRS = new int[]{android.R.attr.listDivider};
    private Drawable mDivider;
    private boolean mIsShowBottomDivider;
    /**
     * Current orientation. Either {@link #HORIZONTAL} or {@link #VERTICAL}.
     */
    private int mOrientation;
    private final Rect mBounds = new Rect();

    public DividerItemDecoration(Context context, int orientation) {mIsShowBottomDivider = false;
        final TypedArray a = context.obtainStyledAttributes(ATTRS);
        mDivider = a.getDrawable(0);
        if (mDivider == null) {Log.w(TAG, "@android:attr/listDivider was not set in the theme used for this "
                    + "DividerItemDecoration. Please set that attribute all call setDrawable()");
        }a.recycle();
        setOrientation(orientation);
    }/**
     * Sets the orientation for this divider. This should be called if
     * {@link RecyclerView.LayoutManager} changes orientation.
     *
     * @param orientation {@link #HORIZONTAL} or {@link #VERTICAL}
     */
    public void setOrientation(int orientation) {if (orientation != HORIZONTAL && orientation != VERTICAL) {throw new IllegalArgumentException("Invalid orientation. It should be either HORIZONTAL or VERTICAL");
        }mOrientation = orientation;
    }/**
     * Sets the {@link Drawable} for this divider.
     *
     * @param drawable Drawable that should be used as a divider.
     */
    public void setDrawable(@NonNull Drawable drawable) {if (drawable == null) {throw new IllegalArgumentException("Drawable cannot be null.");
        }mDivider = drawable;
    }@Override
    public void onDraw(Canvas c, RecyclerView parent, RecyclerView.State state) {if (parent.getLayoutManager() == null || mDivider == null) {return;
        }if (mOrientation == VERTICAL) {drawVertical(c, parent, state);
        } else {drawHorizontal(c, parent, state);
        }}private void drawVertical(Canvas canvas, RecyclerView parent, RecyclerView.State state) {canvas.save();
        final int left;
        final int right;
        //noinspection AndroidLintNewApi - NewApi lint fails to handle overrides.
        if (parent.getClipToPadding()) {left = parent.getPaddingLeft();
            right = parent.getWidth() - parent.getPaddingRight();
            canvas.clipRect(left, parent.getPaddingTop(), right,
                    parent.getHeight() - parent.getPaddingBottom());
        } else {left = 0;
            right = parent.getWidth();
        }final int childCount = parent.getChildCount();
        final int lastPosition = state.getItemCount() - 1;
        for (int i = 0; i < childCount; i++) {final View child = parent.getChildAt(i);
            final int childRealPosition = parent.getChildAdapterPosition(child);
            //mIsShowBottomDivider false的时候不绘制最后一个view的divider
            if (mIsShowBottomDivider || childRealPosition < lastPosition) {parent.getDecoratedBoundsWithMargins(child, mBounds);
                final int bottom = mBounds.bottom + Math.round(child.getTranslationY());
                final int top = bottom - mDivider.getIntrinsicHeight();
                mDivider.setBounds(left, top, right, bottom);
                mDivider.draw(canvas);
            }}canvas.restore();
    }private void drawHorizontal(Canvas canvas, RecyclerView parent, RecyclerView.State state) {canvas.save();
        final int top;
        final int bottom;
        //noinspection AndroidLintNewApi - NewApi lint fails to handle overrides.
        if (parent.getClipToPadding()) {top = parent.getPaddingTop();
            bottom = parent.getHeight() - parent.getPaddingBottom();
            canvas.clipRect(parent.getPaddingLeft(), top,
                    parent.getWidth() - parent.getPaddingRight(), bottom);
        } else {top = 0;
            bottom = parent.getHeight();
        }final int childCount = parent.getChildCount();
        final int lastPosition = state.getItemCount() - 1;
        for (int i = 0; i < childCount; i++) {final View child = parent.getChildAt(i);
            final int childRealPosition = parent.getChildAdapterPosition(child);
            //mIsShowBottomDivider false的时候不绘制最后一个view的divider
            if (mIsShowBottomDivider || childRealPosition < lastPosition) {parent.getLayoutManager().getDecoratedBoundsWithMargins(child, mBounds);
                final int right = mBounds.right + Math.round(child.getTranslationX());
                final int left = right - mDivider.getIntrinsicWidth();
                mDivider.setBounds(left, top, right, bottom);
                mDivider.draw(canvas);
            }}canvas.restore();
    }@Override
    public void getItemOffsets(Rect outRect, View view, RecyclerView parent,
                               RecyclerView.State state) {if (mDivider == null) {outRect.set(0, 0, 0, 0);
            return;
        }if (mOrientation == VERTICAL) {//parent.getChildCount() 不能拿到item的总数
            //https://stackoverflow.com/questions/29666598/android-recyclerview-finding-out-first
            // -and-last-view-on-itemdecoration
            int lastPosition = state.getItemCount() - 1;
            int position = parent.getChildAdapterPosition(view);
            if (mIsShowBottomDivider || position < lastPosition) {outRect.set(0, 0, 0, mDivider.getIntrinsicHeight());
            } else {outRect.set(0, 0, 0, 0);
            }} else {int lastPosition = state.getItemCount() - 1;
            int position = parent.getChildAdapterPosition(view);
            if (mIsShowBottomDivider || position < lastPosition) {outRect.set(0, 0, mDivider.getIntrinsicWidth(), 0);
            } else {outRect.set(0, 0, 0, 0);
            }}}
}

自定义的样式

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">

    <size android:height="1dp"/>
    <solid android:color="@color/colorAccent"/>

</shape>

使用自定义的样式

//rv

RecyclerView rv = (RecyclerView) fvb(R.id.rv);
rv.setAdapter(new Adapter());
rv.setLayoutManager(new LinearLayoutManager(activity));

DividerItemDecoration decoration = new DividerItemDecoration(activity, DividerItemDecoration.VERTICAL);
decoration.setDrawable(activity.getResources().getDrawable(R.drawable.border_bottom_not_full));
rv.addItemDecoration(decoration);

大功告成。分割线的不同情形的最佳实现思路一直是让人头疼的地方，甚至在难以满足需求的时候忍不住直接用view。看了本文后，您可以开开心心地搞定分割线啦！

Android史上最强分割线全攻略相关推荐

SQL初学、精通者必看：10个学生成绩查询史上最强技巧全攻略
SQL初学.精通者必看:10个学生成绩查询史上最强技巧全攻略本文提供了一个含有学生.成绩.课程和教师信息的完整数据库,并为读者提供了 SQL 查询练习题,还包含了练习的答案以及解析.这些题目旨在帮助 ...
酷开系统和鸿蒙,酷开电视史上最强刷机攻略
原标题:酷开电视史上最强刷机攻略史上最全的酷开智能电视刷机功率,酷粉们千万别错过!什么是"刷机"?就是重新安装智能电视内置操作系统,今天小编就为广大的酷开智能电视粉丝们汇总了一批 ...
linux开热点软件,在Ubuntu系统的电脑上开启无线热点全攻略，
在Ubuntu系统的电脑上开启无线热点全攻略, 利用系统自带的网络功能创建热点请注意:你必须要有一个可以用来创建AP热点的无线网卡.如果你不知道如何确认它的话,在终端(Terminal)里输入iw ...
刀口舔血，步步惊心！——Android中小开发者/团队广告盈利全攻略
http://blog.sina.com.cn/s/blog_8627ac3c0100zje9.html 刀口舔血,步步惊心! Android中小开发者/团队广告盈利全攻略及"Gemini ...
黑莓9900java游戏_流畅度秒杀Android 史上最强黑莓9900评测
昨天ZOL评测中心对黑莓9788进行了翔实的评测,但BBer心中想必对Blackberry 7.0系统更多些期待,今天,史上最强黑莓Bold Touch 9900携王者之气回归,虽然列位看官无法亲手操 ...
最早walkman android,史上最强Walkman登场索尼发布双核旗舰Walkman Z
稍微了解一下就知道,Walkman的最顶级并非A系列,现在X系列没有续作,难道A系列就会这样变成新旗舰么?当然不会啦. 前段时间就有新Walkman会搭载Android系统,推出一个"超给力 ...
史上最简单笔记本选购攻略（给对笔记本配置完全不懂的小白，建议收藏）
引言:这是我偶然间找到的一篇文章,面向对配置参数完全不懂的小白,高手请自动忽略哈参考链接:http://www.360doc.com/content/19/0122/12/60764982_8105 ...
大鹏半岛海边团建烧烤野炊上岛赶海一日游全攻略
炎炎夏日与海边最为搭配了,深圳海边团建怎么安排,小编给大家整理了一份海边团建攻略,喜欢的可以收藏起来哦较场尾海边烧烤+上岛赶海一日游东冲真人CS野战+趣味游戏+烧烤/野炊+沙滩嘻戏一日游大澳湾海 ...
一文搞懂考研数列极限问题(概念/计算/证明)史上最强/最全总结
不管本科高数还是考研数学,数列极限问题,看这一篇文章管够,看完还不会做你来找我! 数列极限,是数列和极限两个充满不确定性的概念相混合,容易让人产生摸不着头脑,看到题目就害怕的感觉,本篇文章就按以下目录 ...

Android史上最强分割线全攻略

Android史上最强分割线全攻略相关推荐

最新文章

热门文章