Book Image

Cinder Creative Coding Cookbook

Book Image

Cinder Creative Coding Cookbook

Overview of this book

Cinder is one of the most exciting frameworks available for creative coding. It is developed in C++ for increased performance and allows for the fast creation of visually complex, interactive applications."Cinder Creative Coding Cookbook" will show you how to develop interactive and visually dynamic applications using simple-to-follow recipes.You will learn how to use multimedia content, draw generative graphics in 2D and 3D, and animate them in compelling ways. Beginning with creating simple projects with Cinder, you will use multimedia, create animations, and interact with the user.From animation with particles to using video, audio, and images, the reader will gain a broad knowledge of creating applications using Cinder.With recipes that include drawing in 3D, image processing, and sensing and tracking in real-time from camera input, the book will teach you how to develop interesting applications."Cinder Creative Coding Cookbook" will give you the necessary knowledge to start creating projects with Cinder that use animations and advanced visuals.

Related Content you might be interested in

Current Title:

Small book image
Cinder Creative Coding Cookbook
May, 2013 | 352 pages
No titles found
Table of Contents (19 chapters)
Cinder Creative Coding Cookbook
Cinder Creative Coding Cookbook
Credits
Credits
About the Authors
About the Authors
About the Reviewers
About the Reviewers
www.PacktPub.com
www.PacktPub.com
Preface
Preface
Free Chapter
1
Getting Started
Getting Started
Introduction
Creating a project for a basic application
Creating a project for a screensaver application
Creating a project for an iOS touch application
Understanding the basic structure of an application
Responding to mouse input
Responding to key input
Responding to touch input
Accessing files dropped onto the application window
Adjusting a scene after resizing the window
Using resources on Windows
Using resources on iOS and OS X
Using assets
2
Preparing for Development
Preparing for Development
Introduction
Setting up a GUI for tweaking parameters
Saving and loading configurations
Making a snapshot of the current parameter state
Using MayaCamUI
Using 3D space guides
Communicating with other software
How it works...
There's more...
See also
Preparing your application for iOS
3
Using Image Processing Techniques
Using Image Processing Techniques
Introduction
Transforming image contrast and brightness
Integrating with OpenCV
Detecting edges
Detecting faces
Detecting features in an image
Converting images to vector graphics
4
Using Multimedia Content
Using Multimedia Content
Introduction
Loading and displaying video
Creating a simple video controller
Saving window content as an image
Saving window animations as video
Saving window content as a vector graphics image
Saving high resolution images with the tile renderer
Sharing graphics between applications
5
Building Particle Systems
Building Particle Systems
Introduction
Creating a particle system in 2D
Applying repulsion and attraction forces
Simulating particles flying in the wind
Simulating flocking behavior
Making our particles sound reactive
Aligning particles to a processed image
Aligning particles to the mesh surface
Creating springs
6
Rendering and Texturing Particle Systems
Rendering and Texturing Particle Systems
Introduction
Texturing particles
Adding a tail to our particles
How it works…
Creating a cloth simulation
Texturing a cloth simulation
Texturing a particle system using point sprites and shaders
Connecting the dots
Connecting particles with spline
7
Using 2D Graphics
Using 2D Graphics
Drawing 2D geometric primitives
Drawing arbitrary shapes with the mouse
Implementing a scribbler algorithm
Implementing 2D metaballs
Animating text around curves
Adding a blur effect
Implementing a force-directed graph
8
Using 3D Graphics
Using 3D Graphics
Introduction
Drawing 3D geometric primitives
Rotating, scaling, and translating
Drawing to an offscreen canvas
Drawing in 3D with the mouse
Adding lights
Picking in 3D
Creating a height map from an image
Creating a terrain with Perlin noise
Saving mesh data
9
Adding Animation
Adding Animation
Animating with the timeline
Creating animation sequences with the timeline
Animating along a path
Aligning camera motion to a path
Animating text – text as a mask for a movie
Animating text – scrolling text lines
Creating a flow field with Perlin noise
Creating an image gallery in 3D
Creating a spherical flow field with Perlin noise
10
Interacting with the User
Interacting with the User
Introduction
Creating an interactive object that responds to the mouse
Adding mouse events to our interactive object
Creating a slider
Creating a responsive text box
Dragging, scaling, and rotating objects using multi-touch
11
Sensing and Tracking Input from the Camera
Sensing and Tracking Input from the Camera
Capturing from the camera
Tracking an object based on color
Tracking motion using optical flow
Object tracking
Reading QR code
Building UI navigation and gesture recognition with Kinect
Building an augmented reality with Kinect
12
Using Audio Input and Output
Using Audio Input and Output
Generating a sine oscillator
Generating sound with frequency modulation
Adding a delay effect
Generating sound upon the collision of objects
Visualizing FFT
Making sound-reactive particles
Index
Index

Drawing 2D geometric primitives

In this recipe, we will learn how to draw the following 2D geometric shapes, as filled and stroked shapes:

  • Circle

  • Ellipse

  • Line

  • Rectangle

Getting ready

Include the necessary header to draw in OpenGL using Cinder commands.

Add the following line of code at the top of your source file:

#include "cinder/gl/gl.h"

How to do it…

We will create several geometric primitives using Cinder's methods for drawing in 2D. Perform the following steps to do so:

  1. Let's begin by declaring member variables to keep information about the shapes we will be drawing.

    Create two ci::Vec2f objects to store the beginning and end of a line, a ci::Rectf object to draw a rectangle, a ci::Vec2f object to define the center of the circle, and a float object to define its radius. Finally, we will create aci::Vec2f to define the ellipse's radius and two float objects to define its width and height.

    Let's also declare two ci::Color objects to define the stroke and fill colors.

    Vec2f mLineBegin,mLineEnd;
Rect...
Previous Section
End of Section 2
Next Section