• 【Android UI】贝塞尔曲线 ③ ( 贝塞尔曲线关键点坐标记录 | 二阶贝塞尔曲线示例 )



    贝塞尔曲线参考 : https://github.com/venshine/BezierMaker





    一、贝塞尔曲线关键点坐标记录



    贝塞尔曲线 绘制时 , 使用 android.graphics.Path 记录 贝塞尔曲线 的 ① 起始点 , ② 终止点 , 以及 ③ 若干 控制点 ;

    一阶贝塞尔曲线有 0 0 0 个控制点 , 二阶贝塞尔曲线有 1 1 1 个控制点 , 三阶贝塞尔曲线有 2 2 2 个控制点 , ⋯ \cdots , n n n 阶贝塞尔曲线 n − 1 n-1 n1 个控制点 ;





    二、二阶贝塞尔曲线示例



    创建 android.graphics.Path 实例对象后 , 首先调用 Path#moveTo 方法 , 设置起始点 ;

    Path#moveTo 函数原型如下 :

        /**
         * 将下一个轮廓的起点设置为点(x,y)。
         *
         * @param x 新轮廓起点的x坐标
         * @param y 新轮廓起点的y坐标
         */
        public void moveTo(float x, float y) {
            nMoveTo(mNativePath, x, y);
        }
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9

    然后调用 Path#quadTo 方法 , 设置 二阶贝塞尔曲线 的 控制点终止点 ;

        /**
         * 从最后一个点开始添加二次贝塞尔,
         * 接近控制点(x1,y1),并在(x2,y2)处结束。
         * 如果未对此轮廓进行moveTo()调用,
         * 则第一个点将自动设置为(0,0)。
         *
         * @param x1 二次曲线上控制点的x坐标
         * @param y1 二次曲线上控制点的y坐标
         * @param x2 二次曲线端点的x坐标
         * @param y2 二次曲线端点的y坐标
         */
        public void quadTo(float x1, float y1, float x2, float y2) {
            isSimplePath = false;
            nQuadTo(mNativePath, x1, y1, x2, y2);
        }
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15

    最后 , 调用 Canvas 画布的 Canvas#drawPath 方法 , 将上述设置 起始点 控制点 终止点 的 Path 实例对象 绘制到画布上 ;





    三、代码示例



    package kim.hsl.android_ui;
    
    import android.content.Context;
    import android.graphics.Canvas;
    import android.graphics.Color;
    import android.graphics.Paint;
    import android.graphics.Path;
    import android.util.AttributeSet;
    import android.view.View;
    import androidx.annotation.Nullable;
    
    public class BesselCurve2 extends View {
    
        public BesselCurve2(Context context) {
            this(context, null);
        }
    
        public BesselCurve2(Context context, @Nullable AttributeSet attrs) {
            this(context, attrs, 0);
        }
    
        public BesselCurve2(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
            super(context, attrs, defStyleAttr);
        }
    
        @Override
        protected void onSizeChanged(int width, int height, int oldWidth, int oldHeight) {
            super.onSizeChanged(width, height, oldWidth, oldHeight);
        }
    
        @Override
        protected void onDraw(Canvas canvas) {
            super.onDraw(canvas);
    
            // 初始化 曲线 和 画笔 实例对象
            Path path = new Path();
            Paint paint = new Paint();
            paint.setColor(Color.BLACK);
            paint.setStyle(Paint.Style.STROKE);
            paint.setStrokeWidth(20);
    
            // 设置起始点
            path.moveTo(0, getHeight() / 2F);
    
            // 设置控制点 和 终止点
            path.quadTo(getWidth() / 2F, getHeight(), getWidth(), getHeight() / 2F);
    
            // 绘制贝塞尔曲线
            canvas.drawPath(path, paint);
        }
    }
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51

    绘制效果 :

    在这里插入图片描述

  • 相关阅读:
    图论岛屿问题DFS+BFS
    springboot基于Android的洗衣店预约APP毕业设计源码260839
    【初阶与进阶C++详解】第三篇:类和对象上(类和this指针)
    vscode ssh连接失败
    HTML&CSS3
    水滴怕片效果实现
    安装教程之Windows 11安装Linux子系统并运行Linux GUI应用
    Java面向对象---尚硅谷Java入门视频学习
    Postman的环境变量和全局变量
    Service和启动其他应用的功能和替换Fragment
  • 原文地址:https://blog.csdn.net/han1202012/article/details/125918335