Flutter的Canvas.drawOval是椭圆吗？

Question

我一直在学习在Flutter中绘画自定义形状。画布具有一种称为drawOval()的方法。椭圆在数学上不像椭圆那样定义，因此并非所有椭圆都是椭圆。在这种情况下，我认为“椭圆”是一个椭圆形，但是我想通过查看源代码来确认这一点。

Flutter使用Skia绘制东西，我发现this class，但我仍然不明白在Skia中如何在钩子下方绘制椭圆形。 （我知道如何在Flutter中绘制椭圆形。）

Flutter / Skia椭圆形是椭圆形吗？它在源代码中实际计算并绘制在何处？

Answer 1

我不确定将矩形作为唯一参数（用于形状）的方法还有什么期望，但是，我花时间创建了一些示例代码来确切说明Canvas.drawOval的形式用来画椭圆：

绘图

let userSelection = document.querySelector('.userOutput');

// Set up a click event on the document, so any click will trigger the callback
document.addEventListener('click', userPicked);

function userPicked(evt) {
    // Check to see if the actual object clicked is one of the buttons
    if(evt.target.classList.contains("btn")){
      // Return the value of the clicked button
      userSelection.textContent = evt.target.value;
    }
}

我同意这个名称不太合适，应该使用<div class="allbuttons"> <button class="btn" value="a">A</button> <button class="btn" value="b">B</button> <button class="btn" value="c">C</button> </div> <p class="userOutput"></p>。

肯定是椭圆形

我阅读Skia documentation for drawOval的方式中，作者认为“椭圆形”一词很清楚，而蛋形之类的东西却不清楚，因为这在整个图形中并未广泛传播库。
如果我的插图对您来说不够用，则混合模式示例below this section也会使用import 'package:flutter/material.dart'; class _ExampleRenderObject extends RenderBox { @override void paint(PaintingContext context, Offset offset) { final Paint redPaint = Paint()..color = Colors.redAccent; final Canvas canvas = context.canvas; // This will produce a circle as the rectangle is a square. canvas.drawOval( Rect.fromPoints( Offset(100, 100), Offset(200, 200), ), redPaint); // This will draw an ellipse that is stretched horizontally. canvas.drawOval( Rect.fromPoints( Offset(100, 300), Offset(300, 400), ), redPaint); // This will draw an ellipse that is stretched vertically. canvas.drawOval( Rect.fromPoints( Offset(100, 500), Offset(200, 700), ), redPaint); super.paint(context, offset); } @override bool get sizedByParent => true; @override void performResize() { size = constraints.biggest; super.performResize(); } } void main() { runApp(MaterialApp(debugShowCheckedModeBanner: false, home: Scaffold(body: Example()))); } class Example extends LeafRenderObjectWidget { Example({Key key}) : super(key: key); @override RenderObject createRenderObject(BuildContext context) { return _ExampleRenderObject(); } } 绘制椭圆。

源代码

这就是我进入源代码的程度，但是，它没有提供任何线索，也许无法访问实现的源代码：

SkCavnas.cpp drawEllipse SkDevice.h drawOval SkDevice.cpp（不包含->）-> SkRefCnt.cpp（无）drawOval SkRefCnt.h（我不确定这是如何工作的）