You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何在Flutter中使用Syncfusion PDF绘制圆角矩形?

实现Syncfusion Flutter PDF中的圆角矩形

要在Syncfusion Flutter PDF中绘制圆角矩形,你需要借助PdfPath的addRoundedRectangle方法创建带圆角的路径,再通过graphics.drawPath完成绘制。以下是修改后的完整代码:

createBoxRounded(PdfPage page) {
  final Size pageSize = Size(page.getClientSize().width, page.getClientSize().height);
  final Rect rectBounds = Rect.fromCenter(
      center: Offset(pageSize.width / 2, pageSize.height / 2.5),
      width: 300,
      height: 300);

  // 创建圆角矩形路径,设置圆角半径为20
  final PdfPath path = PdfPath();
  path.addRoundedRectangle(rectBounds, 20);

  // 绘制带边框和填充的圆角矩形
  page.graphics.drawPath(
    pen: PdfPen(
      PdfColor(232, 233, 235),
      width: 5,
      dashStyle: PdfDashStyle.custom,
    ),
    brush: PdfSolidBrush(PdfColor(255, 255, 255)),
    path: path,
  );

  // 原代码中的矩形注释为PDF标注,与绘制图形无关,可按需保留或删除
  // PdfRectangleAnnotation(const Rect.fromLTWH(0, 0, 150, 150), 'Rectangle',
  //     color: PdfColor(255, 0, 0), setAppearance: true);

  return page;
}

核心修改点:

  • 用PdfPath.addRoundedRectangle替代直接调用drawRectangle,通过第三个参数控制圆角半径(这里设为20,匹配你注释中的需求);
  • 使用graphics.drawPath绘制创建好的圆角路径,保留原有的边框样式和填充颜色设置。

内容的提问来源于stack exchange,提问作者Boby

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.06.18 13:45:03