安卓14自由窗口圆角处理之绘制圆角轮廓线

背景:

前面文章已经分享过:

如何一行代码搞定自由窗口的圆角处理?-wms/自由窗口/sf实战开发

但是又有学员朋友提出另一个blog的成果:

安卓aosp14上自由窗口划线边框Freeform Caption实战开发-千里马framework实战

想要把划线和圆角进行结合,把划线也变成圆角的,但是目前结合之后的情况是这样的:

下面就带大家来解决这样一个小需求小问题。

解决方法:

因为本质上划线只是一个自定义的OutlineLayout,所以只需要把当前的绘制矩形变成绘制圆角矩形既可以,但是绘制圆角矩形肯定需要圆角的半径和自由窗口的圆角半径保持一直,所以这里需要把自由窗口圆角半径设置给OutlineLayout。 设置圆角半径部分的代码: 半径来源: 主动设置半径

OutlineLayout部分的完整代码:

cpp 复制代码
public class OutlineLayout extends LinearLayout {

    float mCornerRadius = 0;
    public OutlineLayout(Context context) {
        super(context);
    }

    public OutlineLayout(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
    }

    public OutlineLayout(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    public OutlineLayout(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
        super(context, attrs, defStyleAttr, defStyleRes);
    }

    public void setCornerRadius(float cornerRadisRadius) {
        this.mCornerRadius = cornerRadisRadius;
    }

    @Override
    protected void dispatchDraw(Canvas canvas) {
        super.dispatchDraw(canvas);
        Paint paint = new Paint();
        paint.setColor(Color.RED);
        paint.setAntiAlias(true);
        paint.setStrokeWidth(30);
        paint.setStyle(Paint.Style.STROKE);
        RectF rect = new RectF(0,0,getWidth(),getHeight());
        //canvas.drawRect(rect,paint);canvas.draw
        canvas.drawRoundRect(rect,mCornerRadius,mCornerRadius,paint);
    }
}

整体代码也很简单,主要就是以下2个修改: 1、提供设置圆角半径的接口给外部

2、针对使用canvas.drawRoundRect绘制圆角的矩形

更多framework实战干货,请关注下面"千里马学框架"

相关推荐
明月_清风1 小时前
打字机效果优化:用 requestAnimationFrame 缓冲高频文字更新
前端·javascript
明月_清风2 小时前
Markdown 预解析:别等全文完了再渲染,如何流式增量渲染代码块和公式?
前端·javascript
掘金安东尼2 小时前
用 CSS 打造完美的饼图
前端·css
掘金安东尼10 小时前
纯 CSS 实现弹性文字效果
前端·css
牛奶10 小时前
Vue 基础理论 & API 使用
前端·vue.js·面试
牛奶10 小时前
Vue 底层原理 & 新特性
前端·vue.js·面试
anOnion11 小时前
构建无障碍组件之Radio group pattern
前端·html·交互设计
pe7er11 小时前
状态提升:前端开发中的状态管理的设计思想
前端·vue.js·react.js
SoaringHeart12 小时前
Flutter调试组件:打印任意组件尺寸位置信息 NRenderBox
前端·flutter
晚风予星12 小时前
Ant Design Token Lens 迎来了全面升级!支持在 .tsx 或 .ts 文件中直接使用 Design Token
前端·react.js·visual studio code