zoukankan      html  css  js  c++  java
  • 用layer-list做一个卡片背景

    复制代码
    <?xml version="1.0" encoding="utf-8"?>
    <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
        <item>
            <shape
                android:shape="rectangle"
                android:dither="true">
    
                <corners android:radius="2dp"/>
                <stroke
                    android:width="2dp"
                    android:color="#ccc" />
    
            </shape>
        </item>
    
        <item
            android:top="0dp"
            android:bottom="2dp"
            >   
            <shape
                android:shape="rectangle"
                android:dither="true">
                <corners android:radius="2dp"/>
                <solid android:color="@android:color/white"/>
            </shape>
        </item>
        
        
    </layer-list>
    复制代码

    我们注意到上面的文件中有item和shape,shape就不多说了就是一个规则的图像。其中item用了bottom、top来指定上下的内边距,最终带来了如下的效果:

    我们来一步一步的理解这是怎么做出来的:

    1.首先画一个只有描边的shape:

    复制代码
    <?xml version="1.0" encoding="utf-8"?>
    <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
        <item>
            <shape
                android:shape="rectangle"
                android:dither="true">
    
                <corners android:radius="2dp"/>
                <stroke
                    android:width="2dp"
                    android:color="#ccc" />
    
            </shape>
        </item>
    
    </layer-list>
    复制代码

    2.接下来我们需要让底部显示出灰色的描边,其余的地方都应该是白色的,所以写一个白色的shape,并且底部内边界是2dp。这里的bottom就是底部的内边距。

    复制代码
      <item
            android:bottom="2dp"
            >   
            <shape
                android:shape="rectangle"
                android:dither="true">
                <corners android:radius="2dp"/>
                <solid android:color="@android:color/white"/>
            </shape>
        </item>
    复制代码

    3.最终组合起来,产生最终的效果:

    复制代码
    <?xml version="1.0" encoding="utf-8"?>
    <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
        <item>
            <shape
                android:shape="rectangle"
                android:dither="true">
    
                <corners android:radius="2dp"/>
                <stroke
                    android:width="2dp"
                    android:color="#ccc" />
            </shape>
        </item>
    
        <item
            android:bottom="2dp"
            >   
            <shape
                android:shape="rectangle"
                android:dither="true">
                <corners android:radius="2dp"/>
                <solid android:color="@android:color/white"/>
            </shape>
        </item>
        
    </layer-list>
    复制代码

    参考自:

    http://my.oschina.net/u/937713/blog/168673

  • 相关阅读:
    原创:搜索算法之两个数组取交集的算法
    原创:中文分词的逆向最大匹配算法
    搜索推荐系统根据用户搜索频率(热搜)排序
    原创:Solr Wiki 中关于Suggester(搜索推荐)的简单解读
    从海量文本中统计出前k个频率最高的词语
    原创:从海量数据中查找出前k个最小或最大值的算法(java)
    NOIWC2019 懵逼记
    BZOJ 4568: [Scoi2016]幸运数字(倍增+线性基)
    BZOJ 3207: 花神的嘲讽计划Ⅰ(莫队+哈希)
    BZOJ 3653: 谈笑风生(主席树)
  • 原文地址:https://www.cnblogs.com/linghu-java/p/6682060.html
Copyright © 2011-2022 走看看