add demos to README.md

orx-no-clear/README.md

@@ -1,54 +1,60 @@
-# orx-no-clear
+# orx-no-clear
-
+
-A simple OPENRNDR Extension that provides the classical drawing-without-clearing-the-screen functionality that
+A simple OPENRNDR Extension that provides the classical drawing-without-clearing-the-screen functionality that
-OPENRNDR does not support natively.
+OPENRNDR does not support natively.
-
+
-#### Usage
+#### Usage
-
+
-```kotlin
+```kotlin
-fun main() = application {
+fun main() = application {
-    configure {
+    configure {
-        title = "NoClearProgram"
+        title = "NoClearProgram"
-    }
+    }
-    program {
+    program {
-        backgroundColor = ColorRGBa.PINK
+        backgroundColor = ColorRGBa.PINK
-        extend(NoClear())
+        extend(NoClear())
-        extend {
+        extend {
-            drawer.circle(Math.cos(seconds) * width / 2.0 + width / 2.0, Math.sin(seconds * 0.24) * height / 2.0 + height / 2.0, 20.0)
+            drawer.circle(Math.cos(seconds) * width / 2.0 + width / 2.0, Math.sin(seconds * 0.24) * height / 2.0 + height / 2.0, 20.0)
-        }
+        }
-    }
+    }
-}
+}
-```
+```
-
+
-#### Usage with additional configuration
+#### Usage with additional configuration
-Optionally, a static `backdrop` may be setup by providing custom code.
+Optionally, a static `backdrop` may be setup by providing custom code.
-
+
-- Example 1. Customising the backdrop with an image
+- Example 1. Customising the backdrop with an image
-```kotlin
+```kotlin
-extend(NoClear()) {
+extend(NoClear()) {
-    val img = loadImage("data\\backdrop.png")
+    val img = loadImage("data\\backdrop.png")
-    backdrop = {
+    backdrop = {
-        drawer.image(img, 0.0, 0.0, width * 1.0, height * 1.0)
+        drawer.image(img, 0.0, 0.0, width * 1.0, height * 1.0)
-    }
+    }
-}
+}
-```
+```
-
+
-- Example 2. Customising the backdrop with a checker-board pattern
+- Example 2. Customising the backdrop with a checker-board pattern
-```kotlin
+```kotlin
-extend(NoClear()) {
+extend(NoClear()) {
-    backdrop = {
+    backdrop = {
-        val xw = width / 8.0
+        val xw = width / 8.0
-        val yh = height / 8.0
+        val yh = height / 8.0
-        drawer.fill = ColorRGBa.RED
+        drawer.fill = ColorRGBa.RED
-        (0..7).forEach { row ->
+        (0..7).forEach { row ->
-            (0..7).forEach { col ->
+            (0..7).forEach { col ->
-                if ((row + col) % 2 == 0) {
+                if ((row + col) % 2 == 0) {
-                    drawer.rectangle(row * xw, col * yh, xw, yh)
+                    drawer.rectangle(row * xw, col * yh, xw, yh)
-                }
+                }
-            }
+            }
-        }
+        }
-    }
+    }
-}
+}
-```
+```
-
+
-NB! any submitted _lambda expression_ must be valid within the `renderTarget` context.
+NB! any submitted _lambda expression_ must be valid within the `renderTarget` context.
+<!-- __demos__ -->
+## Demos
+### DemoNoClear
+[source code](src/demo/kotlin/DemoNoClear.kt)
+
+![DemoNoClearKt](https://raw.githubusercontent.com/openrndr/orx/media/orx-no-clear/images/DemoNoClearKt.png)