CropBox constructor

CropBox({ Rect? cropRect, required Size clipSize, required Widget child, required _CropRectUpdate cropRectUpdateEnd, Function? cropRectUpdateStart, _CropRectUpdate? cropRectUpdate, Size? cropRatio, Size? maxCropSize, double maxScale = 10.0, CropBoxType cropBoxType = CropBoxType.Square, bool needInnerBorder = false, GridLine? gridLine, CropBoxBorder? cropBoxBorder, Color? backgroundColor, Color? maskColor, })

裁剪素材组件

通过传入裁剪素材宽高clipSize，裁剪区域比例cropRatio以及待裁剪的内容child，就可以生成裁剪器，支持手势移动、放大缩小操作

再通过cropRectUpdateEnd回调拿到裁剪区域的值，对应到素材进行裁剪操作

{@tool dartpad --template=stateless_widget_material}

代码示例

CropBox(
  // cropRect: Rect.fromLTRB(1 - 0.4083, 0.162, 1, 0.3078), // 2.4倍 随机位置
  // cropRect: Rect.fromLTRB(0, 0, 0.4083, 0.1457), //2.4倍，都是0,0
  cropRect: Rect.fromLTRB(0, 0, 1, 0.3572), // 1倍
  clipSize: Size(200, 315),
  cropRatio: Size(16, 9),
  cropRectUpdateEnd: (rect) {
    print("裁剪区域移动 $rect");
  },
  child: Image.network(
    "https://img1.maka.im/materialStore/beijingshejia/tupianbeijinga/9/M_7TNT6NIM/M_7TNT6NIM_v1.jpg",
    width: double.infinity,
    height: double.infinity,
    fit: BoxFit.cover,
    loadingBuilder: (BuildContext context, Widget child, ImageChunkEvent loadingProgress) {
      if (loadingProgress == null)
        return child;
      return Center(
        child: CircularProgressIndicator(
          value: loadingProgress.expectedTotalBytes != null
              ? loadingProgress.cumulativeBytesLoaded / loadingProgress.expectedTotalBytes
              : null,
        ),
      );
    },
  ),
)

{@end-tool}

Implementation

CropBox({this.cropRect, required this.clipSize, required this.child, required this.cropRectUpdateEnd, this.cropRectUpdateStart, this.cropRectUpdate, this.cropRatio, this.maxCropSize, this.maxScale = 10.0, this.cropBoxType = CropBoxType.Square, this.needInnerBorder = false, this.gridLine, this.cropBoxBorder, this.backgroundColor, this.maskColor});