android 自定义阴影 ShadowView

作者: android源码探索 | 来源:发表于2019-11-30 22:42 被阅读0次

    欢迎大家下载我个人开发的app安琪花园

    写这个控件的目的


    有一次, 在我的工作当中遇到了这样的一个需求,要实现阴影的效果,需求图如下:


    1575124907172.jpg

    其实粗略一看,要实现这个阴影 用cardView, 但是当我用了cardView 实现后 满足不了产品的要求,cardView实现 的阴影太黑,不够温柔,网上找的也满足不了自己的需求。于是自己花了点时间实现了一下。

    使用方式


    在根目录的build.gradle 引入maven

    maven { url 'https://dl.bintray.com/richzjc/maven' }
    

    在module的 dependencies下面添加

    implementation 'com.richzjc:ShadowLib:1.0.15'
    

    注意: 当前控件包裹的子控件只能有一个

    示例

    <com.richzjc.shadowlib.MyShadowLayout
                android:layout_width="wrap_content"
                android:layout_height="200dp"
                android:background="#000"
                android:paddingLeft="10dp"
                app:hl_shadowRadius="30dp"
                app:hl_cardCornerRadius="10dp"
                app:hl_shadowSolidColor="#123456"
                app:hl_bottomShow="true"
                app:hl_topShow="true"
                app:hl_rightShow="true"
                >
                <TextView
                    android:layout_width="100dp"
                    android:layout_height="100dp"
                    android:background="#f00" />
            </com.richzjc.shadowlib.MyShadowLayout>
    

    控件属性介绍


    <declare-styleable name="ShadowLayout">
            <attr name="hl_topShow" format="boolean" />
            <attr name="hl_bottomShow" format="boolean" />
            <attr name="hl_leftShow" format="boolean" />
            <attr name="hl_rightShow" format="boolean" />
            <attr name="hl_shadowRadius" format="dimension"/>
            <attr name="hl_cardCornerRadius" format="dimension"/>
            <attr name="hl_shadowColor" format="color|reference"/>
            <attr name="hl_shadowSolidColor" format="color|reference"/>
        </declare-styleable>
    

    hl_topShow: 是否显示上阴影
    hl_bottomShow: 是否显示下阴影
    hl_leftShow: 是否显示左阴影
    hl_rightShow: 是否显示右阴影
    hl_shadowRadius: 阴影的宽度
    hl_cardCornorRadius: 圆角
    hl_shadowColor: 阴影的颜色值
    hl_shadowSolidColor: 基本上用不到

    效果图


    貌似 上传上来的效果图 阴影看着不是很明显, 可以下载github的项目 在真机上面查看

    WechatIMG262.png WechatIMG261.png

    其它情况的效果图请下载项目自己修改属性运行后查看

    github地址

    原理


    该控件是属于一个组合控件, MyShadowLayout是对外暴露的一个控件,用于在布局里面使用。
    但是在源码里面还包括了MyCardView, ShadowView两个控件。
    而这两个 控件是直接添加在了MyShadowLayout里面。
    其作用:
    MyCardView
    主要控件圆角

    ShadowView
    主要实现的是阴影的效果

    MyShadowLayout
    类似于一个管家的作用, 重写了OnMeasure方法, onLayout方法
    虽然在布局里面MyShadowLayout作为父控件,包裹了子控件。
    但真正实现的逻辑是包裹的子控件最终是添加在了MyCardView上面的

    其它文章:
    kotlin DSL开发
    android 面试题
    android 夜间模式的切换
    快速获取Bundle里面参数
    android EventBus源码阅读
    AOP之动态代理原理
    Handler源码理解
    IOC框架之Dagger详解

    关注公众号有一些经典的面试题:

    qrcode_for_gh_c78cd816dc53_344.jpg

    相关文章

      网友评论

        本文标题:android 自定义阴影 ShadowView

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