其他分享
首页 > 其他分享> > Android NoteX Q10:色值上的各个位代表什么?

Android NoteX Q10:色值上的各个位代表什么?

作者:互联网

一 前言

自定义阴影时需要加上透明度才能更好实现平滑的效果,所以需要了解相关方面的知识。当然也不仅限于阴影实现效果,还有其他的UI设计也涉及到透明度了。

二 色值代表

ARGB这是对应的色值符号,A代表alpha透明度。

    <!--100% —FF-->  
    <!--95% — F2-->  
    <!--90% — E6-->  
    <!--85% — D9-->  
    <!--80% — CC-->  
    <!--75% — BF-->  
    <!--70% — B3-->  
    <!--65% — A6-->  
    <!--60% — 99-->  
    <!--55% — 8C-->  
    <!--50% — 80-->  
    <!--45% — 73-->  
    <!--40% — 66-->  
    <!--35% — 59-->  
    <!--30% — 4D-->  
    <!--25% — 40-->  
    <!--20% — 33-->  
    <!--15% — 26-->  
    <!--10% — 1A-->  
    <!--5% — 0D-->  
    <!--0% — 00-->  

100% - FF表示完全不透明。
做自定义引用时,最好加上A对应的值。ARGB由8位符号表示例如:#FFFFFFFF
每一位符号是十六进制字符,也就是0-F的取值。

案例-自定义阴影效果

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_focused="true">
        <layer-list>
            <item>
                <shape android:shape="rectangle">
                    <padding android:bottom="1px" android:left="1px" android:right="1px" android:top="1px" />
                    <stroke android:width="1px" android:color="#0D90A1F5"/>
                    <corners android:radius="@dimen/dp_32" />
                </shape>
            </item>
            <item>
                <shape android:shape="rectangle">
                    <padding android:bottom="1px" android:left="1px" android:right="1px" android:top="1px" />
                    <stroke android:width="1px" android:color="#1A90A1F5"/>
                    <corners android:radius="@dimen/dp_32" />
                </shape>
            </item>
            <item>
                <shape android:shape="rectangle">
                    <padding android:bottom="1px" android:left="1px" android:right="1px" android:top="1px" />
                    <stroke android:width="1px" android:color="#2690A1F5"/>
                    <corners android:radius="@dimen/dp_32" />
                </shape>
            </item>
            <item>
                <shape android:shape="rectangle">
                    <padding android:bottom="1px" android:left="1px" android:right="1px" android:top="1px" />
                    <stroke android:width="1px" android:color="#3390A1F5"/>
                    <corners android:radius="@dimen/dp_32" />
                </shape>
            </item>
            <item>
                <shape android:shape="rectangle">
                    <padding android:bottom="1px" android:left="1px" android:right="1px" android:top="1px" />
                    <stroke android:width="1px" android:color="#4D90A1F5"/>
                    <corners android:radius="@dimen/dp_32" />
                </shape>
            </item>
            <item>
                <shape android:shape="rectangle">
                    <padding android:bottom="1px" android:left="1px" android:right="1px" android:top="1px" />
                    <stroke android:width="1px" android:color="#6690A1F5"/>
                    <corners android:radius="@dimen/dp_32" />
                </shape>
            </item>
            <item>
                <shape android:shape="rectangle">
                    <padding android:bottom="1px" android:left="1px" android:right="1px" android:top="1px" />
                    <stroke android:width="1px" android:color="#9990A1F5"/>
                    <corners android:radius="@dimen/dp_32" />
                </shape>
            </item>

        </layer-list>
    </item>
    <item android:state_focused="false">
        <layer-list>
            <item>
                <shape android:shape="rectangle">
                    <padding android:bottom="1px" android:left="1px" android:right="1px" android:top="1px" />
                    <stroke android:width="1px" android:color="@color/transparent"/>
                    <corners android:radius="@dimen/dp_32" />
                </shape>
            </item>
            <item>
                <shape android:shape="rectangle">
                    <padding android:bottom="1px" android:left="1px" android:right="1px" android:top="1px" />
                    <stroke android:width="1px" android:color="@color/transparent"/>
                    <corners android:radius="@dimen/dp_32" />
                </shape>
            </item>
            <item>
                <shape android:shape="rectangle">
                    <padding android:bottom="1px" android:left="1px" android:right="1px" android:top="1px" />
                    <stroke android:width="1px" android:color="@color/transparent"/>
                    <corners android:radius="@dimen/dp_32" />
                </shape>
            </item>
            <item>
                <shape android:shape="rectangle">
                    <padding android:bottom="1px" android:left="1px" android:right="1px" android:top="1px" />
                    <stroke android:width="1px" android:color="@color/transparent"/>
                    <corners android:radius="@dimen/dp_32" />
                </shape>
            </item>
            <item>
                <shape android:shape="rectangle">
                    <padding android:bottom="1px" android:left="1px" android:right="1px" android:top="1px" />
                    <stroke android:width="1px" android:color="@color/transparent"/>
                    <corners android:radius="@dimen/dp_32" />
                </shape>
            </item>
            <item>
                <shape android:shape="rectangle">
                    <padding android:bottom="1px" android:left="1px" android:right="1px" android:top="1px" />
                    <stroke android:width="1px" android:color="@color/transparent"/>
                    <corners android:radius="@dimen/dp_32" />
                </shape>
            </item>
            <item>
                <shape android:shape="rectangle">
                    <padding android:bottom="1px" android:left="1px" android:right="1px" android:top="1px" />
                    <stroke android:width="1px" android:color="@color/transparent"/>
                    <corners android:radius="@dimen/dp_32" />
                </shape>
            </item>

        </layer-list>
    </item>

</selector>

简单的阴影效果只需要<layer-list><item…/></layer-list>如此包裹即可。若加上了selector则有了选择效果。当然,item越多且stroke或者padding越小,阴影效果的层叠会细致而不容易看出层次感。

抛出个问题
item中的stroke中的width=1px,padding=2px,那么整个item的高度是多大呢?
4px? 或者2px?

标签:NoteX,效果,自定义,色值,透明度,阴影,item,Q10
来源: https://blog.csdn.net/ganshenml/article/details/117935260