美文网首页Android 拾遗
安卓中设置(shape)圆角背景和边框(stroke)相关的问题

安卓中设置(shape)圆角背景和边框(stroke)相关的问题

作者: 谁把我的昵称都占用了 | 来源:发表于2018-12-01 10:46 被阅读93次

    最近开发的项目中使用的圆角背景和边框比较多,基本都是使用shape文件和.9图片实现的。但在实现的过程中也是会出现一些小问题,这篇随笔会总结下来其中遇到的问题。

    一,圆角大小不一致

    1,四周圆角都为10dp 的shape设置

    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="rectangle">
        <solid android:color="@color/color_ffffff" />
        <corners
            android:bottomLeftRadius="@dimen/s_10dp"
            android:bottomRightRadius="@dimen/s_10dp"
            android:topLeftRadius="@dimen/s_10dp"
            android:topRightRadius="@dimen/s_10dp" />
    </shape>
    
    四周圆角一样的效果.png

    2,四周圆角左右下方为10dp,左上方为30dp,右上方为20dp 的shape设置

    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="rectangle">
        <solid android:color="@color/color_ffffff" />
        <corners
            android:bottomLeftRadius="@dimen/s_10dp"
            android:bottomRightRadius="@dimen/s_10dp"
            android:topLeftRadius="@dimen/s_30dp"
            android:topRightRadius="@dimen/s_20dp" />
    </shape>
    
    四周圆角不一样的效果.png

    二,外层父布局和内层子布局同时设置圆角

    1,比如最外层布局设置四周圆角都为10dp ,而右下角的(TextView是)设置为30dp ,填充颜色为#4db8ff
    外层和内层shape分别如下:

    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="rectangle">
        <solid android:color="@color/color_ffffff" />
        <corners
            android:bottomLeftRadius="@dimen/s_10dp"
            android:bottomRightRadius="@dimen/s_10dp"
            android:topLeftRadius="@dimen/s_10dp"
            android:topRightRadius="@dimen/s_10dp" />
    </shape>
    
    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="rectangle">
        <solid android:color="@color/color_4db8ff" />
        <corners
            android:bottomRightRadius="@dimen/s_30dp" />
    </shape>
    
    外层和内层同时设置圆角但背景颜色不同.png

    切记如果外层已经设置了圆角,内层match_parent后,如果背景仅仅设置一个背景颜色的话,会把外层的圆角覆盖掉,效果如下

    外层设置圆角后,内层单独设置背景颜色.png
    这时候需要给右下角的TexeView单独设置一个bottomRightRadius和外层的圆角保持一致

    三,圆角和边框同时存在

    项目中如果有多个有相同边框的view拼接在一块,会有重复的边框,造成中间边框变粗,从而影响效果。
    可以通过以下代码处理,给右边view的左边框设置为-1dp(绝对值和边框一致),则右边view的左边框不再显示。或者给左边view的右边框设置为-1dp(绝对值和边框一致)亦可。

    <?xml version="1.0" encoding="utf-8"?>
    <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
        <!-- item 的top left right bottom 相当于margin 设置不需要的边为负值 -->
        <item
            android:left="-1dp">
            <shape>
                <!-- 背景颜色 -->
                <solid android:color="#ffffff" />
                <!-- 边框颜色 -->
                <stroke
                    android:width="1dp"
                    android:color="#ff0000" />
                <corners
                    android:topRightRadius="10dp"
                    android:bottomRightRadius="10dp" />
            </shape>
        </item>
    </layer-list>
    
    两个有边框的view拼接到一块的中间边框未处理,变粗.png 两个有边框的view拼接到一块的中间边框.png

    相关文章

      网友评论

        本文标题:安卓中设置(shape)圆角背景和边框(stroke)相关的问题

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