【UI篇】BXXXLayout-圆角/多边阴影/描边

一、功能介绍

目前支持:BConstraintLayout、BLinearLayout、BFrameLayout、BRelativeLayout(拓展中...)
有急需使用的还未支持的组件,请评论区留言
为了能够更直观的让大家知道BXXXLayout都能做什么,下面我列了一个功能列表,做一下简单描述;如下:

功能 描述
圆角 可以统一设置圆角角度,也可以四个角单独设置
描边 可以设置描边大小、颜色,可以隐藏任意边
阴影 可以设置阴影大小、颜色、偏移、距离、单边多边显示等

下面详细说说各个功能的使用方法:

◆ 圆角

阴影演示.gif
XML设置 代码设置 描述
app:bsv_roundRadius="10dp" setRoundradius(int radius) 设置四个角圆角值,优先级最高
app:bsv_topLeftRadius="10dp" setTopLeftRoundRadius(int radius) 左上角圆角值
app:bsv_topRightRadius="10dp" setTopRightRoundRadius(int radius) 右上角圆角值
app:bsv_bottomLeftRadius="10dp" setBottomLeftRoundRadius(int radius) 左下角圆角值
app:bsv_bottomRightRadius="10dp" setBottomRightRoundRadius(int radius) 左下角圆角值

如果设置了roundRadius的值默认会重置四个角度的值,以roundRadius为准

//替换BConstraintLayout、BLinearLayout、BFrameLayout、BRelativeLayout.......

  <!--四个圆角都为10dp-->
  <com.bary.ui.layout.BLinearLayout
        ...
        app:bsv_roundRadius="10dp"
  >
  </com.bary.ui.layout.BLinearLayout>
  <!--左上、右上、坐下圆角为10dp-->
  <com.bary.ui.layout.BLinearLayout
        ...
        app:bsv_topLeftRadius="10dp"
        app:bsv_topRightRadius="10dp"
        app:bsv_bottomLeftRadius="10dp"
  >
  </com.bary.ui.layout.BLinearLayout>


◆ 描边

描边演示.gif
XML设置 代码设置 描述
app:bsv_borderSize="3dp" setBorderSize(float size) 设置描边尺寸
app:bsv_borderColor="#ff8585" setBorderColor(int color) 设置描边颜色
app:bsv_borderHideEdges="left|top" hideBorderEdges(int... edges) 设置需要隐藏的边,值为:
left、top、right、bottom;
可以同时设置多个用|分隔
即可(代码设置的话,
hideBorderEdges方法为
不定参,传多个参数即可;
BorderBuilder.LEFT、
BorderBuilder.TOP、
BorderBuilder.RIGHT、
BorderBuilder.BOTTOM)

想要显示描边borderShow必须为true

//替换BConstraintLayout、BLinearLayout、BFrameLayout、BRelativeLayout.......
  <com.bary.ui.layout.BLinearLayout
        ...
        app:bsv_borderSize="3dp"
        app:bsv_borderColor="#ff8585"
        app:bsv_borderHideEdges="left|top"
  >
  </com.bary.ui.layout.BLinearLayout>


◆ 阴影

阴影演示.gif
XML设置 代码设置 描述
app:bsv_shadowShow="true" setShadowShow(boolean show) 设置是否展示阴影
app:bsv_shadowSize="3dp" setShadowSize(float size) 设置阴影尺寸,优先级最高
app:bsv_shadowXSize="3dp" setShadowXSize(float size) 可以单独设置横向阴影尺寸
app:bsv_shadowYSize="3dp" setShadowYSize(float size) 可以单独设置纵向阴影尺寸
app:bsv_shadowDx="1dp" setShadowDx(float dx) 设置横向的偏移值,默认0
视图在中心,左右阴影尺寸
相同
app:bsv_shadowDy="1dp" setShadowDy(float dy) 设置纵向的偏移值,默认0
视图在中心,上下阴影尺寸
相同
app:bsv_shadowColor="#ff8585" setShadowColor(int color) 设置阴影颜色
app:bsv_shadowAlpha="0.8" setShadowAlpha(float alpha) 设置阴影透明度
app:bsv_shadowHideEdges="left|top" hideShadowEdges(int... edges) 设置需要隐藏的边,值为:
left、top、right、bottom;
可以同时设置多个用|分隔
即可(代码设置的话,
hideShadowEdges方法为
不定参,传多个参数即可;
ShadowBuilder.LEFT、
ShadowBuilder.TOP、
ShadowBuilder.RIGHT、
ShadowBuilder.BOTTOM)

想要显示描边shadowShow必须为true,如果设置了shadowSize的值默认会重置shadowXSize,shadowYSize的值,以shadowSize为准,四边阴影尺寸相同,想要横向纵向尺寸不同,只设置shadowXSize,shadowYSize即可。

//替换BConstraintLayout、BLinearLayout、BFrameLayout、BRelativeLayout.......
  <com.bary.ui.layout.BLinearLayout
        ...
        app:bsv_shadowShow="true"
        app:bsv_shadowSize="3dp"
        app:bsv_shadowDx="1dp"
        app:bsv_shadowDy="1dp"
        app:bsv_shadowColor="#ff8585"
        app:bsv_shadowAlpha="0.8"
        app:bsv_shadowHideEdges="left|top"
  >
  </com.bary.ui.layout.BLinearLayout>


二、使用方法

1、把maven { url 'https://jitpack.io' }这段代码添加到项目的build.gradle存储库末尾

  allprojects {
        repositories {
              ...
              maven { url 'https://www.jitpack.io' }
        }
  }

2、在需要用的主程序或Module下的build.gradle中引用

  dependencies {
        ...
        implementation 'com.github.barystudio:BSuperView:最新版本'
  }



点击下方↓↓↓ 查看最新版本

BSuperView 如果觉得有用欢迎Star、赞、赏 O(∩_∩)O


Bary Studio

更多内容都在【Android开发这些年,沉淀下了什么?】专题中


最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。