Flutter 頁面中添加水印、自定義水印

最近開發手機APP 使用 Fltter

由於需要使用水印的功能，但是第一次接觸Flutter ，就想着能不能在網上找到現成的使用，結果全是一羣複製粘貼的，還卵用沒有，不過由於我太機制，直接去官方的 pub get 找到一個插件。嘿嘿。 pub get
搜到了插件的引入。使用方式
使用方式文檔
原作者的 github 地址 水印功能 github

不過這個包的依賴需要限定dart 的版本，所以我就把作者的源代碼拉到本地參考作者的方式自己定義了一個水印的工具類，代碼呈上

/**
 * 水印樣式
 * rowCount: 當前屏幕寬度中 展示多少列水印
 * columnCount: 當前屏幕高度中，展示多少行水印
 * watermark: 水印展示的文字
 * textStyle: 文字的樣式
 */
class DisableScreenshotsWatarmark extends StatelessWidget {
  final int rowCount;
  final int columnCount;
  final String text;
  final TextStyle textStyle;

  const DisableScreenshotsWatarmark({
    Key key,
    @required this.rowCount,
    @required this.columnCount,
    @required this.text,
    @required this.textStyle,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return IgnorePointer(
      child: Container(
          child: Column(
            children: creatColumnWidgets(),
          )),
    );
  }

  List<Widget> creatRowWdiges() {
    List<Widget> list = [];
    for (var i = 0; i < rowCount; i++) {
      final widget = Expanded(
          child: Center(
              child: Transform.rotate(
                  angle: pi / 10, child: Text(text, style: textStyle))));
      list.add(widget);
    }
    return list;
  }

  List<Widget> creatColumnWidgets() {
    List<Widget> list = [];
    for (var i = 0; i < columnCount; i++) {
      final widget = Expanded(
          child: Row(
            children: creatRowWdiges(),
          ));
      list.add(widget);
    }
    return list;
  }
}


/**
 * 水印工具類 單例 instance
 * 使用方式：
 *
 * 獲取實例: WatarMarkInstance instance = WatarMarkInstance();
 * 添加水印: instance.addWatermark(context, "320321199708134818");
 * 刪除水印: instance.removeWatermark();
 *
 */
class WatarMarkInstance {

  static WatarMarkInstance _instance;
  factory WatarMarkInstance() {
    if (_instance == null) {
      _instance = WatarMarkInstance.private();
    }
    return _instance;
  }

  WatarMarkInstance.private();

  OverlayEntry _overlayEntry;

  void addWatermark(BuildContext context, String watermark,
      {int rowCount = 2, int columnCount = 8, TextStyle textStyle}) async {
    if (_overlayEntry != null) {
      _overlayEntry.remove();
    }
    OverlayState overlayState = Overlay.of(context);
    _overlayEntry = OverlayEntry(
        builder: (context) => DisableScreenshotsWatarmark(
          rowCount: rowCount,
          columnCount: columnCount,
          text: watermark,
          textStyle: textStyle ??
              const TextStyle(
                  color: Color(0x08000000),
                  fontSize: 14,
                  decoration: TextDecoration.none),
        ));
    overlayState.insert(_overlayEntry);
    // return await _methodChannel.invokeMethod<void>("addWatermark", ['我是水印']);
  }


  void removeWatermark() async {
    if (_overlayEntry != null) {
      _overlayEntry.remove();
      _overlayEntry = null;
    }
  }
}

主要參數都已經放在上面了。小夥伴可以自行參考。 再次感謝一下原作者 [哈哈哈]