| OLD | NEW |
| 1 --- | 1 --- |
| 2 layout: default | 2 layout: default |
| 3 title: "Sunflower Code Walkthrough" | 3 title: "Sunflower Code Walkthrough" |
| 4 --- | 4 --- |
| 5 <h1>{{ page:title }}</h1> | 5 <h1>{{ page:title }}</h1> |
| 6 | 6 |
| 7 <aside class="note"> | 7 <p> |
| 8 The <a href="https://code.google.com/p/dart/source/browse/branches/bleeding_ed
ge/dart/samples/#samples%2Fsunflower">full source code</a> for this sample is av
ailable. You can also <a href="sunflower.html">run the sample</a>. Note that it
uses the HTML5 range input control, which works only in Chrome. | 8 The <a href="https://code.google.com/p/dart/source/browse/branches/bleeding_ed
ge/dart/samples/#samples%2Fsunflower">full source code</a> for this sample is av
ailable. You can also <a href="sunflower.html">run the sample</a>. Note that it
uses the HTML5 range input control, which works only in Chrome. |
| 9 </aside> | 9 </p> |
| 10 | 10 |
| 11 <p>The Sunflower sample uses HTML5 Canvas to render an image resembling the head
of a sunflower. </p> | 11 <p>The Sunflower sample uses HTML5 Canvas to render an image resembling the head
of a sunflower. </p> |
| 12 | 12 |
| 13 <p>The easiest way to create a page layout for a static UI like this one is to u
se HTML directly. | 13 <p>The easiest way to create a page layout for a static UI like this one is to u
se HTML directly. |
| 14 Here is the HTML for the Sunflower sample, which includes heading text, the Canv
as object, an | 14 Here is the HTML for the Sunflower sample, which includes heading text, the Canv
as object, an |
| 15 HTML5 range input (slider), and an image showing the equations used to render th
e sunflower.</p> | 15 HTML5 range input (slider), and an image showing the equations used to render th
e sunflower.</p> |
| 16 | 16 |
| 17 {% highlight html %} | 17 {% highlight html %} |
| 18 <html> | 18 <html> |
| 19 <head> | 19 <head> |
| (...skipping 110 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 130 | 130 |
| 131 <ul> | 131 <ul> |
| 132 <li>Object method signatures like Canvas arc() and fill() are unchanged.</li> | 132 <li>Object method signatures like Canvas arc() and fill() are unchanged.</li> |
| 133 <li>Object properties are generally exposed with the same names as in JavaScript
.</li> | 133 <li>Object properties are generally exposed with the same names as in JavaScript
.</li> |
| 134 <li>Event handlers (all the onX methods) may be created simply by assigning a cl
osure that takes an Event argument.</li> | 134 <li>Event handlers (all the onX methods) may be created simply by assigning a cl
osure that takes an Event argument.</li> |
| 135 </ul> | 135 </ul> |
| 136 | 136 |
| 137 <p>By combining HTML layout with a dynamically typed language, Dart makes it qui
ck and easy to create rich user interfaces.</p> | 137 <p>By combining HTML layout with a dynamically typed language, Dart makes it qui
ck and easy to create rich user interfaces.</p> |
| 138 | 138 |
| 139 | 139 |
| OLD | NEW |