Masterarbeit Richard Stern. Flutter App, sich mit einem Bluetooth-Gerät verbindet und Berührungen auf einem Sensor visualisiert.
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

paint.html 11KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <meta name="viewport" content="width=device-width, initial-scale=1">
  7. <meta name="description" content="API docs for the paint method from the TouchPainter class, for the Dart programming language.">
  8. <title>paint method - TouchPainter class - TouchPainter library - Dart API</title>
  9. <!-- required because all the links are pseudo-absolute -->
  10. <base href="../..">
  11. <link href="https://fonts.googleapis.com/css?family=Source+Code+Pro:500,400i,400,300|Source+Sans+Pro:400,300,700" rel="stylesheet">
  12. <link rel="stylesheet" href="static-assets/github.css">
  13. <link rel="stylesheet" href="static-assets/styles.css">
  14. <link rel="icon" href="static-assets/favicon.png">
  15. </head>
  16. <body>
  17. <div id="overlay-under-drawer"></div>
  18. <header id="title">
  19. <button id="sidenav-left-toggle" type="button">&nbsp;</button>
  20. <ol class="breadcrumbs gt-separated dark hidden-xs">
  21. <li><a href="index.html">touch_demonstrator</a></li>
  22. <li><a href="ui_home_TouchPainter/ui_home_TouchPainter-library.html">TouchPainter</a></li>
  23. <li><a href="ui_home_TouchPainter/TouchPainter-class.html">TouchPainter</a></li>
  24. <li class="self-crumb">paint method</li>
  25. </ol>
  26. <div class="self-name">paint</div>
  27. <form class="search navbar-right" role="search">
  28. <input type="text" id="search-box" autocomplete="off" disabled class="form-control typeahead" placeholder="Loading search...">
  29. </form>
  30. </header>
  31. <main>
  32. <div class="col-xs-6 col-sm-3 col-md-2 sidebar sidebar-offcanvas-left">
  33. <h5>TouchPainter class</h5>
  34. <ol>
  35. <li class="section-title"><a href="ui_home_TouchPainter/TouchPainter-class.html#constructors">Constructors</a></li>
  36. <li><a href="ui_home_TouchPainter/TouchPainter/TouchPainter.html">TouchPainter</a></li>
  37. <li class="section-title">
  38. <a href="ui_home_TouchPainter/TouchPainter-class.html#instance-properties">Properties</a>
  39. </li>
  40. <li><a href="ui_home_TouchPainter/TouchPainter/context.html">context</a></li>
  41. <li><a href="ui_home_TouchPainter/TouchPainter/touchCollection.html">touchCollection</a></li>
  42. <li><a href="ui_home_TouchPainter/TouchPainter/width.html">width</a></li>
  43. <li class="inherited"><a href="ui_home_TouchPainter/TouchPainter/hashCode.html">hashCode</a></li>
  44. <li class="inherited"><a href="ui_home_TouchPainter/TouchPainter/runtimeType.html">runtimeType</a></li>
  45. <li class="inherited"><a href="ui_home_TouchPainter/TouchPainter/semanticsBuilder.html">semanticsBuilder</a></li>
  46. <li class="section-title"><a href="ui_home_TouchPainter/TouchPainter-class.html#instance-methods">Methods</a></li>
  47. <li><a href="ui_home_TouchPainter/TouchPainter/paint.html">paint</a></li>
  48. <li><a href="ui_home_TouchPainter/TouchPainter/shouldRepaint.html">shouldRepaint</a></li>
  49. <li class="inherited"><a href="ui_home_TouchPainter/TouchPainter/addListener.html">addListener</a></li>
  50. <li class="inherited"><a href="ui_home_TouchPainter/TouchPainter/hitTest.html">hitTest</a></li>
  51. <li class="inherited"><a href="ui_home_TouchPainter/TouchPainter/noSuchMethod.html">noSuchMethod</a></li>
  52. <li class="inherited"><a href="ui_home_TouchPainter/TouchPainter/removeListener.html">removeListener</a></li>
  53. <li class="inherited"><a href="ui_home_TouchPainter/TouchPainter/shouldRebuildSemantics.html">shouldRebuildSemantics</a></li>
  54. <li class="inherited"><a href="ui_home_TouchPainter/TouchPainter/toString.html">toString</a></li>
  55. <li class="section-title inherited"><a href="ui_home_TouchPainter/TouchPainter-class.html#operators">Operators</a></li>
  56. <li class="inherited"><a href="ui_home_TouchPainter/TouchPainter/operator_equals.html">operator ==</a></li>
  57. <li class="section-title"><a href="ui_home_TouchPainter/TouchPainter-class.html#static-properties">Static properties</a></li>
  58. <li><a href="ui_home_TouchPainter/TouchPainter/buttonPressed.html">buttonPressed</a></li>
  59. <li><a href="ui_home_TouchPainter/TouchPainter/buttonReleased.html">buttonReleased</a></li>
  60. </ol>
  61. </div><!--/.sidebar-offcanvas-->
  62. <div class="col-xs-12 col-sm-9 col-md-8 main-content">
  63. <h1>paint method</h1>
  64. <section class="multi-line-signature">
  65. <div>
  66. <ol class="annotation-list">
  67. <li>@override</li>
  68. </ol>
  69. </div>
  70. <span class="returntype">void</span>
  71. <span class="name ">paint</span>
  72. (<wbr><span class="parameter" id="paint-param-canvas"><span class="type-annotation">Canvas</span> <span class="parameter-name">canvas</span>, </span> <span class="parameter" id="paint-param-size"><span class="type-annotation">Size</span> <span class="parameter-name">size</span></span>)
  73. </section>
  74. <section class="desc markdown">
  75. <p>Called whenever the object needs to paint. The given <code>Canvas</code> has its
  76. coordinate space configured such that the origin is at the top left of the
  77. box. The area of the box is the size of the <code>size</code> argument.</p>
  78. <p>Paint operations should remain inside the given area. Graphical operations
  79. outside the bounds may be silently ignored, clipped, or not clipped.</p>
  80. <p>Implementations should be wary of correctly pairing any calls to
  81. <code>Canvas.save</code>/<code>Canvas.saveLayer</code> and <code>Canvas.restore</code>, otherwise all
  82. subsequent painting on this canvas may be affected, with potentially
  83. hilarious but confusing results.</p>
  84. <p>To paint text on a <code>Canvas</code>, use a <code>TextPainter</code>.</p>
  85. <p>To paint an image on a <code>Canvas</code>:</p><ol><li>
  86. <p>Obtain an <code>ImageStream</code>, for example by calling <code>ImageProvider.resolve</code>
  87. on an <code>AssetImage</code> or <code>NetworkImage</code> object.</p></li><li>
  88. <p>Whenever the <code>ImageStream</code>'s underlying <code>ImageInfo</code> object changes
  89. (see <code>ImageStream.addListener</code>), create a new instance of your custom
  90. paint delegate, giving it the new <code>ImageInfo</code> object.</p></li><li>
  91. <p>In your delegate's <a href="ui_home_TouchPainter/TouchPainter/paint.html">paint</a> method, call the <code>Canvas.drawImage</code>,
  92. <code>Canvas.drawImageRect</code>, or <code>Canvas.drawImageNine</code> methods to paint the
  93. <code>ImageInfo.image</code> object, applying the <code>ImageInfo.scale</code> value to
  94. obtain the correct rendering size.</p></li></ol>
  95. </section>
  96. <section class="summary source-code" id="source">
  97. <h2><span>Implementation</span> </h2>
  98. <pre class="language-dart"><code class="language-dart">@override
  99. void paint(Canvas canvas, Size size) {
  100. int maxSize = 1100;
  101. int leftLine = 100;
  102. int rightLine = 950;
  103. void _drawCircle(int x, int y, Color v) {
  104. double xCircle;
  105. double yCircle;
  106. xCircle = x.toDouble() &#47; maxSize * size.width;
  107. yCircle = y.toDouble() &#47; maxSize * size.height;
  108. Paint line = Paint()
  109. ..color = v
  110. ..strokeCap = StrokeCap.round
  111. ..style = PaintingStyle.stroke
  112. ..strokeWidth = 4.0;
  113. &#47;&#47; print(&quot;C: $xCircle &#47; ${size.width}&quot;);
  114. canvas.drawCircle(Offset(xCircle, yCircle), 8.0, line);
  115. }
  116. void _drawSlider(int x, int y, Color v) {
  117. double topSlider = 65.0;
  118. double bottomSlider = 940.0;
  119. int sliderPercent;
  120. double range = bottomSlider - topSlider;
  121. double sliderPosition;
  122. double sliderValue;
  123. if (y &gt; topSlider) {
  124. sliderPosition = y - topSlider;
  125. } else {
  126. sliderPosition = 0;
  127. }
  128. sliderValue = sliderPosition &#47; range; &#47;&#47; 0...1
  129. sliderPercent = (sliderValue * 100).round(); &#47;&#47; %
  130. if (sliderPercent &gt; 100) sliderPercent = 100;
  131. if (sliderPercent &lt; 0) sliderPercent = 0;
  132. &#47;* print(&quot;range: $range&quot;);
  133. print(&quot;sliderPosition = $sliderPosition&quot;);
  134. print(&quot;%: $sliderValue&quot;);
  135. print(&quot;%R: $sliderPercent&quot;);*&#47;
  136. Paint line = Paint()
  137. ..color = v
  138. ..strokeCap = StrokeCap.round
  139. ..style = PaintingStyle.stroke
  140. ..strokeWidth = 5.0;
  141. var xLine = rightLine;
  142. var yLine = size.height * (y &#47; maxSize);
  143. &#47;&#47; print(&quot;$yLine &#47; ${size.height}&quot;);
  144. canvas.drawLine(
  145. &#47;&#47;&#47;Slider line
  146. Offset(xLine &#47; maxSize * size.width, yLine),
  147. Offset(
  148. (xLine + (maxSize - xLine) &#47; 1.2) &#47; maxSize * size.width, yLine),
  149. line);
  150. TextSpan percentage =
  151. new TextSpan(style: new TextStyle(color: v), text: &quot;$sliderPercent&quot;);
  152. TextPainter tp = new TextPainter(
  153. text: percentage,
  154. textAlign: TextAlign.left,
  155. textDirection: TextDirection.rtl);
  156. tp.layout();
  157. tp.paint(canvas,
  158. new Offset(rightLine &#47; maxSize * size.width - 50.0, yLine - 15.0));
  159. }
  160. touchCollection.forEach((k, v) {
  161. &#47;&#47; print(&quot;${k.f} ${k.e} ${k.x} ${k.y}&quot;);
  162. if (k.x &lt;= 1023 &amp;&amp; k.y &lt; maxSize) {
  163. switch (k.e) {
  164. case 5:
  165. {
  166. break;
  167. }
  168. case 4:
  169. {
  170. continue move;
  171. }
  172. move:
  173. case 1:
  174. {
  175. &#47;* _drawCircle(0, maxSize, v); &#47;&#47;L U
  176. _drawCircle(0, 550, v); &#47;&#47; L M
  177. _drawCircle(0, 0, v); &#47;&#47; L O
  178. _drawCircle(550, 0, v); &#47;&#47; M O
  179. _drawCircle(550, 550, v); &#47;&#47; MITTE
  180. _drawCircle(550, maxSize, v); &#47;&#47; M U
  181. _drawCircle(maxSize, 0, v); &#47;&#47; R O
  182. _drawCircle(maxSize, 550, v); &#47;&#47; R M
  183. _drawCircle(maxSize, maxSize, v); &#47;&#47;R U*&#47;
  184. &#47;&#47; _drawCircle(175, 511, v); &#47;&#47; L M
  185. &#47;&#47; _drawCircle(850, 511, v); &#47;&#47; L M
  186. &#47;&#47; _drawCircle(180, 550, v); &#47;&#47; L M
  187. &#47;&#47;&#47; middle touch pad
  188. if (k.x &gt; leftLine &amp;&amp; k.x &lt; rightLine) {
  189. _drawCircle(k.x, k.y, v);
  190. }
  191. &#47;&#47;&#47; right slider
  192. else if (k.x &gt;= rightLine) {
  193. _drawSlider(k.x, k.y, v);
  194. }
  195. break;
  196. }
  197. default:
  198. {
  199. print(&quot; W.T.F&quot;);
  200. print(&quot;tE: $k.e&quot;);
  201. break;
  202. }
  203. }
  204. }
  205. });
  206. }</code></pre>
  207. </section>
  208. </div> <!-- /.main-content -->
  209. <div class="col-xs-6 col-sm-6 col-md-2 sidebar sidebar-offcanvas-right">
  210. </div><!--/.sidebar-offcanvas-->
  211. </main>
  212. <footer>
  213. <span class="no-break">
  214. touch_demonstrator 1.0.0+1
  215. </span>
  216. </footer>
  217. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  218. <script src="static-assets/typeahead.bundle.min.js"></script>
  219. <script src="static-assets/highlight.pack.js"></script>
  220. <script src="static-assets/URI.js"></script>
  221. <script src="static-assets/script.js"></script>
  222. </body>
  223. </html>