kaze/orx
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add comments to bezierPatch demos, simplify. (#173)

Browse Source
This commit is contained in:
Abe Pazos
2021-02-23 08:24:10 +01:00
committed by GitHub
parent 10aed4d53d
commit 8d6b82a24e
4 changed files with 95 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
orx-shapes/src/demo/kotlin/DemoBezierPatch01.kt
View File

@@ -3,7 +3,17 @@ import org.openrndr.color.ColorRGBa
import org.openrndr.extensions.SingleScreenshot
import org.openrndr.extra.shapes.bezierPatch
import org.openrndr.shape.LineSegment
import org.openrndr.shape.ShapeContour
/**
* Shows how to
* - create a [bezierPatch] out of 4 [LineSegment]
* - create a sub-patch out of a [bezierPatch]
* - create horizontal and vertical [ShapeContour]s out of [bezierPatch]es
*
* The created contours are horizontal and vertical in "bezier-patch space" but
* are rendered deformed following the shape of the bezier patch.
*/
fun main() {
application {
configure {
@@ -16,23 +26,34 @@ fun main() {
this.outputFile = System.getProperty("screenshotPath")
}
}
// helper to get screen locations using normalized uv values
fun pos(u: Double, v: Double) = drawer.bounds.position(u, v)
val c0 = LineSegment(pos(0.1, 0.1), pos(0.9, 0.1))
val c1 = LineSegment(pos(0.4, 0.3), pos(0.6, 0.4))
val c2 = LineSegment(pos(0.4, 0.7), pos(0.6, 0.6))
val c3 = LineSegment(pos(0.1, 0.9), pos(0.9, 0.9))
val bp = bezierPatch(c0.segment, c1.segment, c2.segment, c3.segment)
val bpSub = bp.sub(0.1, 0.1, 0.6,0.6)
extend {
drawer.clear(ColorRGBa.PINK)
val c0 = LineSegment(200.0, 100.0, width-200.0, 100.0).contour.segments.first()
val c1 = LineSegment(100.0, 150.0, width-100.0, 150.0).contour.segments.first()
val c2 = LineSegment(100.0, height-150.0, width-100.0, height-150.0).contour.segments.first()
val c3 = LineSegment(200.0, height-100.0, width-200.0, height-100.0).contour.segments.first()
// Show the line segments that form the bezier patch
drawer.stroke = ColorRGBa.YELLOW
drawer.strokeWeight = 5.0
drawer.lineSegments(listOf(c0, c1, c2, c3))
val bp = bezierPatch(c0, c1, c2, c3)
val bpsub = bp.sub(0.0, 0.0, 0.5, 0.5)
drawer.strokeWeight = 1.0
for (i in 0..50) {
drawer.stroke = ColorRGBa.BLACK
drawer.contour(bp.horizontal(i/50.0))
drawer.contour(bp.vertical(i/50.0))
drawer.contour(bp.horizontal(i / 50.0))
drawer.contour(bp.vertical(i / 50.0))
drawer.stroke = ColorRGBa.RED
drawer.contour(bpsub.horizontal(i/50.0))
drawer.contour(bpsub.vertical(i/50.0))
drawer.contour(bpSub.horizontal(i / 50.0))
drawer.contour(bpSub.vertical(i / 50.0))
}
}
}

27
orx-shapes/src/demo/kotlin/DemoBezierPatch02.kt
View File

@@ -2,12 +2,18 @@ import org.openrndr.application
import org.openrndr.color.ColorRGBa
import org.openrndr.extensions.SingleScreenshot
import org.openrndr.extra.shapes.bezierPatch
import org.openrndr.math.bezier
import org.openrndr.shape.Circle
import org.openrndr.shape.LineSegment
import org.openrndr.shape.Rectangle
import org.openrndr.shape.drawComposition
import org.openrndr.shape.ShapeContour
/**
* Shows how to create a [bezierPatch] out of a
* closed [ShapeContour] with 4 curved segments.
*
* Calling [Circle.contour] is one way of producing
* such a contour with vertices at the cardinal points
* but one can manually create any other 4-segment closed contour
* to use in bezier patches.
*/
fun main() {
application {
configure {
@@ -20,16 +26,17 @@ fun main() {
this.outputFile = System.getProperty("screenshotPath")
}
}
val c = Circle(width / 2.0, height / 2.0, 350.0).contour
val bp = bezierPatch(c)
extend {
drawer.clear(ColorRGBa.PINK)
val c = Circle(width/2.0, height/2.0, 350.0).contour
val bp = bezierPatch(c)
drawer.stroke = ColorRGBa.BLACK
for (i in 0..10) {
drawer.stroke = ColorRGBa.BLACK
drawer.contour(bp.horizontal(i/10.0))
drawer.contour(bp.vertical(i/10.0))
drawer.contour(bp.horizontal(i / 10.0))
drawer.contour(bp.vertical(i / 10.0))
}
}
}

34
orx-shapes/src/demo/kotlin/DemoBezierPatch03.kt
View File

@@ -1,12 +1,19 @@
import org.openrndr.application
import org.openrndr.color.ColorRGBa
import org.openrndr.extensions.Screenshots
import org.openrndr.extensions.SingleScreenshot
import org.openrndr.extra.shapes.bezierPatch
import org.openrndr.extra.shapes.distort
import org.openrndr.extra.shapes.regularStarRounded
import org.openrndr.math.transforms.transform
import org.openrndr.shape.Circle
import org.openrndr.shape.ShapeContour
/**
* Shows how to distort [ShapeContour]s using a [bezierPatch]
*
* In this case the contours are regular stars and the bezier patch
* is created using a circular contour with the required 4 segments.
*/
fun main() {
application {
configure {
@@ -19,26 +26,35 @@ fun main() {
this.outputFile = System.getProperty("screenshotPath")
}
}
extend(Screenshots())
val bp = bezierPatch(
Circle(width / 2.0, height / 2.0, 350.0).contour
)
val star = regularStarRounded(
7, 30.0, 40.0,
0.5, 0.5
)
extend {
drawer.clear(ColorRGBa.PINK)
val bp = bezierPatch(Circle(width / 2.0, height / 2.0, 350.0).contour)
// draw grid
for (i in 0..50) {
drawer.stroke = ColorRGBa.BLACK
drawer.contour(bp.horizontal(i / 50.0))
drawer.contour(bp.vertical(i / 50.0))
}
// draw stars
drawer.fill = ColorRGBa.PINK
for (j in 1 until 10) {
for (i in 1 until 10) {
val r = regularStarRounded(7, 30.0, 40.0, 0.5, 0.5).transform(
transform {
translate(j * width / 10.0, i * height / 10.0)
}
val starMoved = star.transform(
transform {
translate(j * width / 10.0, i * height / 10.0)
}
)
val dr = bp.distort(r, drawer.bounds)
drawer.contour(dr)
drawer.contour(bp.distort(starMoved, drawer.bounds))
}
}
}

35
orx-shapes/src/demo/kotlin/DemoBezierPatch04.kt
View File

@@ -1,10 +1,16 @@
import org.openrndr.application
import org.openrndr.color.ColorRGBa
import org.openrndr.extensions.Screenshots
import org.openrndr.extensions.SingleScreenshot
import org.openrndr.extra.shapes.bezierPatch
import org.openrndr.shape.Circle
/**
* Shows how to get positions and gradient values of those positions
* from a [bezierPatch]
*
* You can think of bezierPatch.position() as requesting points
* in a wavy flag (the bezier patch) using normalized uv coordinates.
*/
fun main() {
application {
configure {
@@ -17,23 +23,26 @@ fun main() {
this.outputFile = System.getProperty("screenshotPath")
}
}
val bp = bezierPatch(
Circle(drawer.bounds.center, 350.0).contour
//Rectangle.fromCenter(drawer.bounds.center, 550.0).contour
)
extend {
drawer.clear(ColorRGBa.PINK)
val bp = bezierPatch(Circle(width / 2.0, height / 2.0, 350.0).contour)
for (i in 0..50) {
drawer.stroke = ColorRGBa.BLACK.opacify(1.0)
}
drawer.stroke = ColorRGBa.BLACK
for (j in 1 until 50 step 2) {
for (i in 1 until 50 step 2) {
val p = bp.position(i / 50.0, j / 50.0)
val g2 = bp.gradient(i / 50.0, j / 50.0).normalized
val g = g2.perpendicular()
drawer.lineSegment(p, p + g2 * 10.0)
drawer.lineSegment(p, p - g2 * 10.0)
drawer.lineSegment(p, p + g * 10.0)
drawer.lineSegment(p, p - g * 10.0)
val u = i / 50.0
val v = j / 50.0
val pos = bp.position(u, v)
val grad = bp.gradient(u, v).normalized * 10.0
val perpendicular = grad.perpendicular()
drawer.lineSegment(pos - grad, pos + grad)
drawer.lineSegment(pos - perpendicular, pos + perpendicular)
//drawer.circle(pos + grad, 3.0)
}
}
}