processing

• DeIntegro

  so i programmed my first piece of code in processing...but it took about 1.5 hours to code something i probably should have done in minutes. the problem i have is with setting with pixel precision arguments on the screen. i figured if the display window had a pixel grid of say 10px intervals, that would help tremendously. anyway, how do i solve spending hours figuring out where to place /*Draws body of creature */ in my code unless i have a grid...it just seemed like making educated guesses. which is definitely not efficient!

  //sets size
  size(320, 240);
  smooth();

  /*Draws head of creature */
  stroke(0);
  fill(240,0,0);
  ellipseMode(CENTER);
  ellipse(160,60,75,75);

  /*Draws eyes of creature */
  noStroke();
  fill(0,255,15);
  ellipseMode(CENTER);
  ellipse(140,60,15,25);
  ellipse(180,60,15,25);

  /*Draws nose of creature */
  noStroke();
  fill(255);
  ellipseMode(CENTER);
  ellipse(160,70,15,15);

  /*Draws mouth of creature */
  stroke(0);
  rectMode(CENTER);
  rect(160,85,25,2);
  println("you're done with the face");

  /*Draws body of creature */
  stroke(0);
  fill(12,34,120);
  rectMode(CENTER);
  rect(160,133,28,70);

  /*Draws line on top of head */
  stroke(0);
  line(125,23,193,23);

  /*Draws right arm */
  stroke(0);
  line(174,120,200,160);

  /*Draws left arm */
  stroke(0);
  line(146,120,117,160);

  /*Draws left leg */
  stroke(0);
  line(146,169,136,220);

  /*Draws right leg */
  stroke(0);
  line(174,169,185,220);
  println("your done with creature");
  

  DeIntegro

  Flag

• PIZZA0

  really basic way would be maybe setting up a draw loop then set the x/y of the object you are trying to place to the mouse position and also print the mousex/y to the console and make a note of the numbers when it's where you want it.

  void setup(){
  size(500,500);
  background(0);
  stroke(255);
  fill(255);
  }

  void draw(){
  background(0);
  ellipse(mouseX,mouseY,50,50);
  println("x:"+mouseX+" y:"+mouseY);
  }
  

  PIZZA 0Permalink

  UpvoteDownvote

  Dogear

  Flag

  • i'm really computer illiterate when you say console, what do you mean? is that the same as what's in the utilities folder on a mac?DeIntegro

  Show [[ numHiddenNotes ]] more notesAdd Note

  SaveCancel

• stewdio0

  You're going to love these three commands:

  pushMatrix()
  http://processing.org/reference/…

  popMatrix()
  http://processing.org/reference/…

  translate()
  http://processing.org/reference/…

  You'll love them because what you can do is design your guy at any position on the screen, and then simply move (or "translate") that position to elsewhere. For example, let's say you've drawn the head of this creature so that it's centered on point (0, 0) like so :

  ellipseMode( CENTER );
  ellipse( 0, 0, 15, 15 );

  You can easily "translate" that point of (0, 0) to something random like let's say... (23, 79) by sticking in one "translate" command :

  ellipseMode( CENTER );
  translate( 23, 79 );
  ellipse( 0, 0, 15, 15 );

  Anything that comes after that call to translate() will be moved over by (23, 79). PushMatrix and PopMatrix allow you to group translations together. (Think of this as like grouping a bunch of objects together in Illustrator and then moving them around as a group while other objects stay where they are.) Let's say you want one circle at (23, 79) and one that's actually at (0, 0). You could make that happen by doing this :

  ellipseMode( CENTER );
  pushMatrix();
  translate( 23, 79 );
  ellipse( 0, 0, 15, 15 );
  popMatrix();
  ellipse( 0, 0, 15, 15 );

  Notice how the first time we call the Ellipse function we're within a matrix that's been translated. But then we pop that matrix off the stack and so when we call Ellipse a second time we're back to our fresh matrix where (0, 0) really means (0, 0). You can push, pop, and translate to your heart's content within the draw loop so go wild. You can even nest push / pops.

  Also, just in case you're working from a book and not the Processing website, this page is extremely useful :
  http://processing.org/reference/…

  stewdio 0Permalink

  UpvoteDownvote

  Dogear

  Flag

  Show [[ numHiddenNotes ]] more notesAdd Note

  SaveCancel

• stewdio0

  And of course, you can just move your whole drawing around with the mouse by combining my advice and PIZZA's:

  void setup()
  {
  size( 960, 540 );
  }

  void draw()
  {
  pushMatrix();
  translate( mouseX, mouseY );
  ...[your drawing code here]...
  popMatrix();
  println( "x: " + mouseX + " y: " + mouseY );
  }

  stewdio 0Permalink

  UpvoteDownvote

  Dogear

  Flag

  Show [[ numHiddenNotes ]] more notesAdd Note

  SaveCancel

• DeIntegro0

  Thanks guys...i'll definitely experiment with these examples. Your help is appreciated!

  DeIntegro 0Permalink

  UpvoteDownvote

  Dogear

  Flag

  Show [[ numHiddenNotes ]] more notesAdd Note

  SaveCancel