Commit 004a3f9382aa575573574727a7f9b1adb9980c21

Authored by wdn127929
1 parent 9e0dbd43

封面图蒙版iOS和安卓不一样,iOS需要多加一层且第一层画笔不能是透明色

Showing 1 changed file with 146 additions and 8 deletions
@@ -2099,12 +2099,133 @@ class Utils { @@ -2099,12 +2099,133 @@ class Utils {
2099 stream.addListener(ImageStreamListener(listener)); 2099 stream.addListener(ImageStreamListener(listener));
2100 return completer.future; 2100 return completer.future;
2101 } 2101 }
  2102 +
2102 // static Future<ui.Image> getImage(String asset) async { 2103 // static Future<ui.Image> getImage(String asset) async {
2103 // ByteData data = await rootBundle.load(asset); 2104 // ByteData data = await rootBundle.load(asset);
2104 // Codec codec = await ui.instantiateImageCodec(data.buffer.asUint8List()); 2105 // Codec codec = await ui.instantiateImageCodec(data.buffer.asUint8List());
2105 // FrameInfo fi = await codec.getNextFrame(); 2106 // FrameInfo fi = await codec.getNextFrame();
2106 // return fi.image; 2107 // return fi.image;
2107 // } 2108 // }
  2109 + // static Future<Uint8List> canvas(
  2110 + // context, String _thumbnail, String month, String week) async {
  2111 + // var pictureRecorder = new ui.PictureRecorder(); // 图片记录仪
  2112 + // var canvas = new Canvas(pictureRecorder); //canvas接受一个图片记录仪
  2113 + // var images = await loadImage(_thumbnail, true); // 使用方法获取Unit8List格式的图片
  2114 + // print(images);
  2115 + // // Paint _linePaint = new Paint()
  2116 + // // ..color = Colors.blue
  2117 + // // ..style = PaintingStyle.fill
  2118 + // // ..isAntiAlias = true
  2119 + // // ..strokeCap = StrokeCap.round
  2120 + // // ..strokeWidth = 500;
  2121 + // // Paint selfPaint = Paint()
  2122 + // // ..color = Colors.red
  2123 + // // ..style = PaintingStyle.fill
  2124 + // // ..isAntiAlias = true
  2125 + // // ..strokeCap = StrokeCap.butt
  2126 + // // ..strokeWidth = 2;
  2127 + // final paint = Paint()
  2128 + // // ..color = Colors.red
  2129 + // // ..maskFilter = MaskFilter.blur(BlurStyle.normal, 5.0)
  2130 + // ..style = PaintingStyle.fill;
  2131 +
  2132 + // // 绘制一个矩形作为蒙版
  2133 + // // canvas.drawRect(Rect.fromLTRB(10, 10, 80, 80), paint);
  2134 +
  2135 + // // // 应用蒙版后,再绘制其他图形
  2136 + // // paint.maskFilter = null;
  2137 + // // canvas.drawCircle(Offset(60, 60), 30, paint);
  2138 +
  2139 + // // canvas.drawRect(Rect.fromLTWH(0, 0, 500, 400), paint);
  2140 +
  2141 + // // canvas.drawImage(images, Offset(0, 0), paint);
  2142 +
  2143 + // // 定义源矩形,通常是图像的全部
  2144 + // final Rect source = Rect.fromLTWH(
  2145 + // 0.0, 0.0, images.width.toDouble(), images.height.toDouble());
  2146 + // // 定义目标矩形,即画布的大小
  2147 + // final Rect destination = Rect.fromLTWH(0.0, 0.0, 500, 400);
  2148 + // // 绘制图像
  2149 + // canvas.drawImageRect(images, source, destination, paint);
  2150 +
  2151 + // final paint1 = Paint()
  2152 + // ..color = Colors.black.withOpacity(0.4)
  2153 + // ..maskFilter = MaskFilter.blur(BlurStyle.normal, 5.0)
  2154 + // ..style = PaintingStyle.fill;
  2155 +
  2156 + // // 绘制一个矩形作为蒙版
  2157 + // canvas.drawRect(Rect.fromLTRB(0, 0, 500, 400), paint1);
  2158 +
  2159 + // // 在画布上绘制图片,使用BoxFit来适配画布大小
  2160 + // // canvas.drawImageRect(
  2161 + // // images,
  2162 + // // Rect.fromLTWH(0, 0, images.width.toDouble(), images.height.toDouble()),
  2163 + // // Rect.fromLTWH(0, 0, images.width.toDouble(), images.height.toDouble()),
  2164 + // // paint);
  2165 +
  2166 + // // 绘制文字
  2167 + // ui.ParagraphBuilder pb2 = ui.ParagraphBuilder(ui.ParagraphStyle(
  2168 + // textAlign: TextAlign.center,
  2169 + // fontWeight: FontWeight.normal,
  2170 + // fontStyle: FontStyle.normal,
  2171 +
  2172 + // // :MyColours.color_000000,
  2173 + // fontSize: 26));
  2174 + // pb2.pushStyle(ui.TextStyle(color: MyColours.color_FFEFC5, fontSize: 26));
  2175 + // pb2.addText(
  2176 + // '${Provider.of<UserModel>(context, listen: false).user.sellername}');
  2177 +
  2178 + // // 设置文本的宽度约束
  2179 + // ParagraphConstraints pc2 = ui.ParagraphConstraints(width: 500);
  2180 + // ui.Paragraph paragraph2 = pb2.build()..layout(pc2);
  2181 + // canvas.drawParagraph(paragraph2, Offset(10, 40));
  2182 +
  2183 + // // 绘制文字
  2184 + // ui.ParagraphBuilder pb = ui.ParagraphBuilder(ui.ParagraphStyle(
  2185 + // textAlign: TextAlign.center,
  2186 + // fontWeight: FontWeight.bold,
  2187 + // fontStyle: FontStyle.normal,
  2188 +
  2189 + // // :MyColours.color_000000,
  2190 + // fontSize: 48));
  2191 + // pb.pushStyle(ui.TextStyle(color: MyColours.color_FFEFC5, fontSize: 48));
  2192 + // pb.addText(month);
  2193 +
  2194 + // // 设置文本的宽度约束
  2195 + // ParagraphConstraints pc = ui.ParagraphConstraints(width: 500);
  2196 + // ui.Paragraph paragraph = pb.build()..layout(pc);
  2197 + // canvas.drawParagraph(paragraph, Offset(10, 150));
  2198 +
  2199 + // // 绘制文字
  2200 + // ui.ParagraphBuilder pb3 = ui.ParagraphBuilder(ui.ParagraphStyle(
  2201 + // textAlign: TextAlign.center,
  2202 + // fontWeight: FontWeight.bold,
  2203 + // fontStyle: FontStyle.normal,
  2204 +
  2205 + // // :MyColours.color_000000,
  2206 + // fontSize: 42));
  2207 + // pb3.pushStyle(ui.TextStyle(color: MyColours.color_FFEFC5, fontSize: 42));
  2208 + // pb3.addText(week);
  2209 +
  2210 + // // 设置文本的宽度约束
  2211 + // ParagraphConstraints pc3 = ui.ParagraphConstraints(width: 500);
  2212 + // ui.Paragraph paragraph3 = pb3.build()..layout(pc3);
  2213 + // canvas.drawParagraph(paragraph3, Offset(10, 230));
  2214 +
  2215 + // //下面的代码是生成图片的关键代码,以上绘制文字和圆圈的代码可以忽略不计
  2216 + // var picture =
  2217 + // await pictureRecorder.endRecording().toImage(500, 400); //设置生成图片的宽和高
  2218 + // var pngImageBytes =
  2219 + // await picture.toByteData(format: ui.ImageByteFormat.png);
  2220 + // // var imgBytes = Uint8List.view(pngImageBytes.buffer); //这一行和下面这一行都是生成Uint8List格式的图片(原理还不知道)
  2221 + // Uint8List pngBytes = pngImageBytes.buffer.asUint8List();
  2222 + // print(pngBytes); //pngBytes可以放在Image.memory()中预览
  2223 + // // setState(() {
  2224 + // // imageMemory = pngBytes;
  2225 + // // Uint8List result = await resizeImage(pngBytes); //重置图片尺寸
  2226 + // Uint8List result = await testFromFileComporessList(context, pngBytes);
  2227 + // return result;
  2228 + // }
2108 2229
2109 static Future<Uint8List> canvas( 2230 static Future<Uint8List> canvas(
2110 context, String _thumbnail, String month, String week) async { 2231 context, String _thumbnail, String month, String week) async {
@@ -2124,20 +2245,37 @@ class Utils { @@ -2124,20 +2245,37 @@ class Utils {
2124 // ..isAntiAlias = true 2245 // ..isAntiAlias = true
2125 // ..strokeCap = StrokeCap.butt 2246 // ..strokeCap = StrokeCap.butt
2126 // ..strokeWidth = 2; 2247 // ..strokeWidth = 2;
2127 - final paint = Paint()  
2128 - ..color = Color.fromRGBO(81, 81, 81, 0.4) 2248 + Paint paint = Paint()
  2249 + ..color = Color.fromRGBO(81, 81, 81, 0.6)
2129 ..style = PaintingStyle.fill; 2250 ..style = PaintingStyle.fill;
  2251 + if (Platform.isIOS) {
  2252 + paint = Paint()
  2253 + // ..color = Colors.red
  2254 + // ..maskFilter = MaskFilter.blur(BlurStyle.normal, 5.0)
  2255 + ..style = PaintingStyle.fill;
  2256 + }
2130 2257
2131 // canvas.drawRect(Rect.fromLTWH(0, 0, 500, 400), paint); 2258 // canvas.drawRect(Rect.fromLTWH(0, 0, 500, 400), paint);
2132 2259
2133 // canvas.drawImage(images, Offset(0, 0), paint); 2260 // canvas.drawImage(images, Offset(0, 0), paint);
2134 2261
2135 - // 定义源矩形,通常是图像的全部  
2136 - final Rect source = Rect.fromLTWH(0.0, 0.0, images.width.toDouble(), images.height.toDouble());  
2137 - // 定义目标矩形,即画布的大小  
2138 - final Rect destination = Rect.fromLTWH(0.0, 0.0, 500, 400);  
2139 - // 绘制图像  
2140 - canvas.drawImageRect(images, source, destination, paint); 2262 + // 定义源矩形,通常是图像的全部
  2263 + final Rect source = Rect.fromLTWH(
  2264 + 0.0, 0.0, images.width.toDouble(), images.height.toDouble());
  2265 + // 定义目标矩形,即画布的大小
  2266 + final Rect destination = Rect.fromLTWH(0.0, 0.0, 500, 400);
  2267 + // 绘制图像
  2268 + canvas.drawImageRect(images, source, destination, paint);
  2269 +
  2270 + if (Platform.isIOS) {
  2271 + final paint1 = Paint()
  2272 + ..color = Colors.black.withOpacity(0.6)
  2273 + ..maskFilter = MaskFilter.blur(BlurStyle.normal, 5.0)
  2274 + ..style = PaintingStyle.fill;
  2275 +
  2276 + // 绘制一个矩形作为蒙版
  2277 + canvas.drawRect(Rect.fromLTRB(0, 0, 500, 400), paint1);
  2278 + }
2141 2279
2142 // 在画布上绘制图片,使用BoxFit来适配画布大小 2280 // 在画布上绘制图片,使用BoxFit来适配画布大小
2143 // canvas.drawImageRect( 2281 // canvas.drawImageRect(