Add Horizontal Layout Panel demo

2020-05-01 08:14:16 +02:00
parent 3ed00d36d8
commit afd581b91f
1 changed files with 81 additions and 0 deletions
--- a/orx-panel/src/demo/kotlin/DemoHorizontalLayout01.kt
+++ b/orx-panel/src/demo/kotlin/DemoHorizontalLayout01.kt
@@ -0,0 +1,81 @@
+import org.openrndr.application
+import org.openrndr.color.ColorRGBa
+import org.openrndr.extensions.SingleScreenshot
+import org.openrndr.math.Spherical
+import org.openrndr.math.Vector3
+import org.openrndr.panel.controlManager
+import org.openrndr.panel.elements.button
+import org.openrndr.panel.elements.div
+import org.openrndr.panel.elements.h1
+import org.openrndr.panel.elements.requestRedraw
+import org.openrndr.panel.style.*
+
+fun main() = application {
+    program {
+        // -- this block is for automation purposes only
+        if (System.getProperty("takeScreenshot") == "true") {
+            extend(SingleScreenshot()) {
+                this.outputFile = System.getProperty("screenshotPath")
+            }
+        }
+        val cm = controlManager {
+            styleSheet(has class_ "horizontal") {
+                paddingLeft = 10.px
+                paddingTop = 10.px
+
+                // ----------------------------------------------
+                // The next two lines produce a horizontal layout
+                // ----------------------------------------------
+                display = Display.FLEX
+                flexDirection = FlexDirection.Row
+            }
+
+            styleSheet(has type "h1") {
+                marginTop = 10.px
+                marginLeft = 7.px
+                marginBottom = 10.px
+            }
+
+            layout {
+                val header = h1 { "click a button..." }
+
+                div("horizontal") {
+                    // A bunch of names for generating buttons
+                    listOf("load", "save", "redo", "stretch", "bounce",
+                            "twist", "swim", "roll", "fly", "dance")
+                            .forEachIndexed { i, word ->
+
+                        // A fun way of generating a set of colors
+                        // of similar brightness:
+                        // Grab a point on the surface of a sphere
+                        // and treat its coordinates as an rgb color.
+                        val pos = Vector3.fromSpherical(
+                                Spherical(i * 19.0, i * 17.0, 0.4))
+                        val rgb = ColorRGBa.fromVector(pos + 0.4)
+
+                        button {
+                            label = word
+                            style = styleSheet {
+                                // Use Color.RGBa() to convert a ColorRGBa
+                                // color (the standard color datatype)
+                                // into "CSS" format:
+                                background = Color.RGBa(rgb)
+                            }
+
+                            // When the button is clicked replace
+                            // the header text with the button's label
+                            events.clicked.listen {
+                                header.replaceText(it.source.label)
+                                header.requestRedraw()
+                            }
+                        }
+                    }
+                }
+            }
+        }
+        extend(cm)
+        extend {
+            drawer.background(0.2, 0.18, 0.16, 1.0)
+        }
+    }
+}