Processing Forum

Screen name:
professork

professork's Profile

2 Posts

2 Responses

0 Followers

Activity Trend

Last 30 days

Loading Chart...

Show:

Expanded view
List view

Flexing Stripes

[2 Replies]
- 14-Oct-2012 01:45 PM
- Forum: Programming Questions
Hi everyone,
I'm posting a mockup of a problem I am trying to solve in a larger project. Basically, I need the width of a stripe that's being hovered over (in a canvas of vertical stripes) to scale up in width. That part is easy. The hard part is scaling all the other stripes down and offsetting them so that all still fill the space but flex their size to accommodate the one that is now fatter...

In this mockup, I'm scaling one stripe up and I have a strategy in place for scaling all other stripes down by a factor, but I'm stuck on trying to figure out how to offset the positions.

Can you recommend a better way to approach this, or a way to finish what I've begun?

Thanks so much.. Michael
2. ArrayList<Stripe> stripes;
3. public int numStripes = 7;
5. void setup(){
6. size(700,400);
7. smooth();
8. rectMode(CENTER);
9. colorMode(HSB, 360,100,100);
10. stripes = new ArrayList<Stripe>();
11. for(int i=0; i<numStripes; i++){
12. stripes.add( new Stripe( (width-50) - i*100 ) );
13. }
14. }
15. void draw(){
16. background(300);
18. for(int i=0; i<stripes.size(); i++){
19. Stripe s = stripes.get(i);
21. s.checkHover();
22. if(s.hover){
23. for(int j=0; j<stripes.size(); j++){
24. if(j!=i){
25. //pass in xpos so in the class we can
26. //determine if it's position should be offset
27. //to the left or right.
28. stripes.get(j).scaleYourself(s.xpos);
29. }
30. }
31. }
33. s.display();
34. }
36. }
38. //--------------------------
40. public class Stripe{
41. public float xpos;
42. private float w, oldw, targetw;
43. public float h;
44. public boolean hover;
45. private float scaleFactor;
46. private float xoff;
47. private float rh;
49. public Stripe(float xpos){
50. oldw = 100;
51. targetw = oldw;
52. rh = random(200,300);
53. this.xpos = xpos;
54. h = random(360);
55. scaleFactor = 1.5;
56. }
58. public void display(){
59. noStroke();
60. fill(h, 90,90);
61. rect(xpos+xoff, height/2, w, rh);
62. stroke(0);
63. line(xpos+xoff, 0, xpos+xoff,height);
64. }
66. public void checkHover(){
67. if( abs(dist(mouseX,0, xpos, 0)) < 5 ){
68. scaleFactor = 1.5;
69. hover = true;
70. } else {
71. scaleFactor = 1;
72. hover = false;
73. }
75. targetw = oldw*scaleFactor;
76. w += (targetw - w) * 0.1;
77. }
78. public void scaleYourself(float comparex){
79. int direction;
80. if(this.xpos < comparex){
81. direction = -1;
82. } else {
83. direction = 1;
84. }
86. xoff = 0;//
89. scaleFactor = 1.0 - (numStripes / (oldw*1.5 - oldw));
90. targetw = oldw*scaleFactor;
91. w += (targetw - w) * 0.1;
92. }
94. }

Using ControlP5 in an external class in Eclipse

[2 Replies]
- 25-Sep-2012 12:46 PM
- Forum: Contributed Library Questions
I'd like to move all my GUI code to another class in order free up some space in the main class (the one that extends PApplet.) My hope was that I could create static variables in the GUIManager class and access them from all the additional asset Classes that need data from sliders (including the main class)
It's not working and I'm not sure how to remedy this.

Here's an abstraction of what i'm trying to do:
1. public class StripeGUIManager{
  
  private ControlP5 control;
  
  private ControlWindow window;
  
  private Controller<Toggle> bgColor;
  
  private Controller<Toggle> rSpeeds;
  
  private Controller<Knob> blurKnob;
  
  private Controller<Knob> speedKnob;
  
  public static float scalerAmt;
  
  public static float blurAmt;
  
  public static boolean blackOrWhite;
  
  public static boolean randomSpeeds;
  
  public StripeGUIManager(PApplet p) {
  
        control = new ControlP5(p);
  
        // Init window
  
        window = control
  
              .addControlWindow("Stripe_Control_Window", 100, 100, 200, 200)
  
              .hideCoordinates().setBackground(p.color(90));
  
        // Speed Scaler Knob
  
        speedKnob = control.addKnob("scalerAmt").setRange(0.2f, 3.5f)
  
              .setValue(1).setPosition(10, 100).setRadius(30)
  
              .setColorForeground(p.color(255))
  
              .setColorBackground(p.color(200, 160, 100))
  
              .setColorActive(p.color(255, 60, 60))
  
              .setDragDirection(Knob.HORIZONTAL);
  
        // Init blur knob
  
        blurKnob = control.addKnob("blurAmt").setRange(1, 100).setValue(5)
  
              .setPosition(100, 100).setRadius(30)
  
              .setColorForeground(p.color(255))
  
              .setColorBackground(p.color(200, 160, 100))
  
              .setColorActive(p.color(255, 60, 60))
  
              .setDragDirection(Knob.HORIZONTAL);
  
        // Init toggle switch
  
        bgColor = control.addToggle("blackOrWhite").setPosition(10, 40)
  
              .setSize(50, 20).setValue(true).setMode(ControlP5.SWITCH);
  
        rSpeeds = control.addToggle("randomSpeeds").setPosition(80, 40)
  
              .setSize(50, 20).setMode(ControlP5.SWITCH);
  
        // Set controls to window object
  
        ((Toggle) bgColor).moveTo(window);
  
        ((Knob) blurKnob).moveTo(window);
  
        ((Knob) speedKnob).moveTo(window);
  
        ((Toggle) rSpeeds).moveTo(window);
  
  }
  
  public void ControlEvent(ControlEvent theEvent) {
  
        if (theEvent.isController()) {
  
              System.out.println("Something is happening.");
  
              if (theEvent.getName().matches("blurAmt")) {
  
              blurAmt = theEvent.getValue();
  
        }
  
  }}} //Sorry about the formatting... It's a forum thing..
In the main class, I'd like to use these variables to affect various attributes, like so:
1. //Imports, Namespace, etc.
3. public class TestClass extends PApplet{
4. public void setup(){
5. //blah blah
6. }
7. public void draw(){
8. //let's say...
9. background(StripeGUIManager.scalerAmt);
10. }
So this is clearly not enough, but I can't find any resources or tutorials that don't use ControlP5 in the class that immediately extends PApplet. Does the solution involve adding Listeners?

Thanks!

m

«Prev
Next »