Bezier curves are familiar to everyone. If you are still unfamiliar with them, you should take a look at the examples of second and third order Bezier curves in this article. This article starts with the basics, customizing the View to use the Bessel curve API provided by the Android system. The Bezier Curve was widely published by French engineer Pierre Bezier in 1962. He used Bezier curves to design the body of a car.

First of all, we need to know what kind of curve the second and third order Bezier curves are. The second order Bezier curves have a starting point, a ending point and a control point. The curve connects the starting point and the ending point, and the lines between the control point and the starting point and the ending point respectively are tangent lines of the curve. The third order Bezier curve also has two control points, and let’s look at their renderings below.

Second order Bezier curve




Second order Bezier curve rendering

Third order Bezier curve




Third order Bezier curve rendering

Foundation consolidation

In this example, we use Paint and Path to draw Bessel curves. The basics of them are posted below

SetAntiAlias: setAntiAlias: Sets the alias of the brush. SetColor: sets the color of the brush. SetAlpha: setAntiAlias: sets the alias of the brush. SetStyle: Set brush Style, paint.style. STROKE to hollow, paint.style. FILL to solid setStrokeWidth: This class encapsulates many geometric Path methods, such as moveTo: to change the position of a starting point. LineTo: to join a coordinate point. ArcTo: to draw an arc Path. QuadTo (float x1, float y1, float x2, float y2): float x1, float y1, float y2 CubicTo (float x1, float y1, float x2, float y2, float x3, float y3): The method of quadratic Bessel curves adds two final words: 1. Quadratic Cubic (= cubic) Cubic, cubicCopy the code

Next is to customize the third order Bezier curve View code




Related variables




Initialization function




Draw function




Gesture touch management

This is the code for third-order Bezier curves. If you want to see more code, please go to my GitHub: GitHub sample project In-DepthStudy