OLD | NEW |
1 <sky> | 1 <sky> |
2 <style> | 2 <style> |
3 div { | 3 div { |
4 height: 200px; | 4 height: 200px; |
5 background-color: lightblue; | 5 background-color: lightblue; |
6 } | 6 } |
7 </style> | 7 </style> |
8 <div id="canvas" /> | 8 <div id="canvas" /> |
9 <script> | 9 <script> |
10 import 'dart:math' as math; | 10 import 'dart:math' as math; |
(...skipping 38 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
49 context.translate(0.0, 50.0); | 49 context.translate(0.0, 50.0); |
50 var builder = new LayerDrawLooperBuilder() | 50 var builder = new LayerDrawLooperBuilder() |
51 ..addLayerOnTop( | 51 ..addLayerOnTop( |
52 new DrawLooperLayerInfo() | 52 new DrawLooperLayerInfo() |
53 ..setOffset(const Point(150.0, 0.0)) | 53 ..setOffset(const Point(150.0, 0.0)) |
54 ..setColorMode(TransferMode.srcMode) | 54 ..setColorMode(TransferMode.srcMode) |
55 ..setPaintBits(-1), | 55 ..setPaintBits(-1), |
56 (Paint layerPaint) { | 56 (Paint layerPaint) { |
57 layerPaint.color = const Color.fromARGB(128, 255, 255, 0); | 57 layerPaint.color = const Color.fromARGB(128, 255, 255, 0); |
58 layerPaint.setColorFilter( | 58 layerPaint.setColorFilter( |
59 new ColorFilter.Mode(const Color.fromARGB(128, 0, 0, 255), | 59 new ColorFilter.mode(const Color.fromARGB(128, 0, 0, 255), |
60 TransferMode.srcInMode)); | 60 TransferMode.srcInMode)); |
61 layerPaint.setMaskFilter( | 61 layerPaint.setMaskFilter( |
62 new MaskFilter.Blur(BlurStyle.normal, 3.0, highQuality: true)); | 62 new MaskFilter.blur(BlurStyle.normal, 3.0, highQuality: true)); |
63 }) | 63 }) |
64 ..addLayerOnTop( | 64 ..addLayerOnTop( |
65 new DrawLooperLayerInfo() | 65 new DrawLooperLayerInfo() |
66 ..setOffset(const Point(75.0, 75.0)) | 66 ..setOffset(const Point(75.0, 75.0)) |
67 ..setColorMode(TransferMode.srcMode) | 67 ..setColorMode(TransferMode.srcMode) |
68 ..setPaintBits(-1), | 68 ..setPaintBits(-1), |
69 (Paint layerPaint) { | 69 (Paint layerPaint) { |
70 Gradient redYellow = new Gradient.Radial( | 70 Gradient redYellow = new Gradient.Radial( |
71 new Point(0.0, 0.0), radius/3.0, | 71 new Point(0.0, 0.0), radius/3.0, |
72 [const Color(0xFFFFFF00), const Color(0xFFFF0000)], | 72 [const Color(0xFFFFFF00), const Color(0xFFFF0000)], |
73 null, TileMode.mirror); | 73 null, TileMode.mirror); |
74 layerPaint.setShader(redYellow); | 74 layerPaint.setShader(redYellow); |
75 }) | 75 }) |
76 ..addLayerOnTop( | 76 ..addLayerOnTop( |
77 new DrawLooperLayerInfo()..setOffset(const Point(225.0, 75.0)), | 77 new DrawLooperLayerInfo()..setOffset(const Point(225.0, 75.0)), |
78 (Paint layerPaint) { | 78 (Paint layerPaint) { |
79 // Since this layer uses a DST color mode, this has no effect. | 79 // Since this layer uses a DST color mode, this has no effect. |
80 layerPaint.color = const Color.fromARGB(128, 255, 0, 0); | 80 layerPaint.color = const Color.fromARGB(128, 255, 0, 0); |
81 }); | 81 }); |
82 paint.setDrawLooper(builder.build()); | 82 paint.setDrawLooper(builder.build()); |
83 context.drawCircle(0.0, 0.0, radius, paint); | 83 context.drawCircle(0.0, 0.0, radius, paint); |
84 | 84 |
85 context.commit(); | 85 context.commit(); |
86 }); | 86 }); |
87 } | 87 } |
88 </script> | 88 </script> |
89 </sky> | 89 </sky> |
OLD | NEW |