• 巧用用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

  • 相关阅读:
    黄金连分数
    第39级台阶
    四、绘图可视化之Seaborn
    三、绘图和可视化之matplotlib
    二、pandas入门
    python_111_动态导入模块
    爬虫_python3_抓取猫眼电影top100
    爬虫_python3_urllib
    python_112_网络编程 Socket编程
    python_111_异常处理
  • 原文地址:https://www.cnblogs.com/tianzhijiexian/p/4505766.html
Copyright © 2020-2023  润新知