前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >flutter截取当前widget并分享

flutter截取当前widget并分享

作者头像
徐建国
发布2021-11-30 20:02:46
1K0
发布2021-11-30 20:02:46
举报
文章被收录于专栏:个人路线

Flutter中截图的主要用到了类RepaintBoundary。

1、在需要截图的widget外包裹一层RepaintBoundary

代码语言:javascript
复制
RepaintBoundary(
      key: repaintWidgetKey,
      child: Container(
        width: _boxWidth + Adapter.px(30),
        height:_boxHeight + Adapter.px(isPhone ? 30 : 44),
        padding: EdgeInsets.only(top: Adapter.px(10), bottom: Adapter.px(isPhone ? 20 : 34), left: Adapter.px(15), right: Adapter.px(15)),
        color: Color(0xFFD3F4FD),
        child:  Container(
            width: _boxWidth,
            height: _boxHeight,
            decoration: BoxDecoration(
              color: Colors.white,
              boxShadow: [
                BoxShadow(
                  offset: Offset(0, Adapter.px(2)),
                  blurRadius: Adapter.px(14),
                  color: Color(0x29000000),
                  spreadRadius: 0,
                )
              ],
              borderRadius: BorderRadius.circular(_borderRadius),
            ),
            child: Stack(
              children: <Widget>[
                _renderRecord(),
                _renderDivider(),
                _renderDownTip(),
                _renderQRCode(),
              ],
            )),
      ),
    )

需要传入一个GlobalKey()

代码语言:javascript
复制
GlobalKey repaintWidgetKey = GlobalKey(); // 绘图key值

2、将截屏的图片生成ByteData

代码语言:javascript
复制
import 'dart:ui' as ui;
import 'dart:async';

  /// 截屏图片生成图片流ByteData
Future<ByteData> _capturePngToByteData() async {
    try {
      RenderRepaintBoundary boundary = repaintWidgetKey.currentContext
          .findRenderObject();
      double dpr = ui.window.devicePixelRatio; // 获取当前设备的像素比
      ui.Image image = await boundary.toImage(pixelRatio: dpr);
      ByteData _byteData = await image.toByteData(format: ui.ImageByteFormat.png);
      return _byteData;
    } catch (e) {
      print(e);
    }
    return null;
  }
代码语言:javascript
复制
void saveImage() async {
    // 截屏
    ByteData byteData = await QSCommon.capturePngToByteData(key);

    Uint8List pngBytes = byteData.buffer.asUint8List();
    print(pngBytes);

    final result = await ImageGallerySaver.saveImage(
      Uint8List.fromList(pngBytes),
      quality: 100,
    );

    Fluttertoast.showToast(msg: "保存成功");
    print(result);
  }

代码语言:javascript
复制
void shareVxImage() async {
    ByteData byteData = await QSCommon.capturePngToByteData(key);

    Uint8List pngBytes = byteData.buffer.asUint8List();
    Directory tempDir = await getTemporaryDirectory();

    String storagePath = tempDir.path;
    File file = new File('$storagePath/enarate.png');
    if (!file.existsSync()) {
      file.createSync();
    }
    file.writeAsBytesSync(pngBytes);

    print(file);

    WxSdk.ShareImage(
      //分享图片

      file: "/data/user/0/com.xinxing.cixi_community/cache/enarate.png",
    );
  }
本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2021-08-03,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 坚果前端 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档