How to create a dial/knob.

TheWholeMushroomBar

Hi,

I'm trying to figure out how to create a dial or knob that will control motion on screen in a processing sketch.

I'm aware that there are Libraries such as ControlP5 available but, i'd like to be able to create my own.

Basically, i'm thinking of creating a circle with two lines, both initially set to 12 O'Clock. One of the lines is static on the 12 O'Clock position and the other can be dragged around. The angle between the two lines at the centre of the circle could then be calculated.

Could anybody give me pointers on how to achieve this?

KevinWorkman

Which part are you having trouble with?

The visual effect can be achieve with some basic trig. The input part of this can be achieved by listening for mouse events.

TheWholeMushroomBar

Thanks for the reply.

Basically i want to be able to move something to the right by clicking and dragging the dial clockwise, and left by clicking and dragging the dial counterclockwise. So if the angle increases, move right, if angle decreases, move left.

I'm trying to understand the trig behind it at the moment, but having difficulty.

KevinWorkman

This is the first result I found for googling "processing draw line at angle" and it contains the trig you're looking for: http://processing.org/discourse/beta/num_1261157915.html

TheWholeMushroomBar

Thanks a lot for the help.