Music Play/Pause Button

edited January 2017 in Questions about Code

Hey i want a Play/Pause button in my Visualizer can you help me??

import ddf.minim.*;
import ddf.minim.analysis.*;
import ddf.minim.effects.*;
import ddf.minim.signals.*;
import ddf.minim.spi.*;
import ddf.minim.ugens.*;

PImage hintergrund;

Minim minim;
AudioPlayer Player;
FFT fft;
int w;
int farbe;


void setup()
{
  size(500,300,P3D);
  minim = new Minim(this);
  Player = minim.loadFile("bla.mp3"); // Spielt die Mp3 datei ab
  Player.loop(); // Wiederholt den aktuellen Song
  fft = new FFT(Player.bufferSize(), Player.sampleRate());
  fft.logAverages(60, 7);
  stroke(255);
  w = width/fft.avgSize();
  strokeWeight(w);
  strokeCap(SQUARE);
  farbe = 0;

}

void draw()
{
  hintergrund = loadImage("hintergrund.jpg");
  image(hintergrund,0,0);

  fft.forward(Player.mix);

  colorMode(HSB);
  stroke(farbe, 255, 255);
  colorMode(RGB);

  for(int i = 0; i < fft.avgSize(); i++){
    line((i * w)*3, height/1.1, (i * w)*3, height/1.1 - fft.getAvg(i) * 0.5);

}

  farbe += 5;
  if( farbe > 255)
  {
    farbe = 0;
  }
}

This is atm my Code also i would donate a few euro if you can help me :)

Answers

  • edited January 2017 Answer ✓

    Move line 35 to your setup() because you don't want to do this in draw().

    For play/pause:

    void mouseReleased()
    {
      if ( Player.isPlaying() )
      {
        Player.pause();
      }
      else
      {    
        Player.loop();
      }
    }
    

    For more information about Minim, check their reference: http://code.compartmental.net/minim/

    Kf

  • hey thank you for the fast answer

    the void mouseReleased is really great but how can i implate there a Button?

    because now the Song stops everytime i klick with my mouse but i want to press a Button

    greetings

  • You can check if your mouseX and mouseY values are within some values before calling Player.pause() or Player.loop().

  • You can use the following code:

    class Button {
      String label;
      float x;      
      float y;    
      float w;    
      float h;    
    
      // constructor
      Button(String labelB, float xpos, float ypos, float widthB, float heightB) {
        label = labelB;
        x = xpos;
        y = ypos;
        w = widthB;
        h = heightB;
      }
    
      void Draw() {
        fill(218);
        stroke(141);
        rect(x, y, w, h, 10);
        textAlign(CENTER, CENTER);
        fill(0);
        text(label, x + (w / 2), y + (h / 2));
      }
    
      boolean MouseIsOver() {
        if (mouseX > x && mouseX < (x + w) && mouseY > y && mouseY < (y + h)) {
          return true;
        }
        return false;
      }
    }
    

    Now you can use it in the following way:

    Button b1;
    
    void setup() {
      size(600, 400);
      rectMode(CORNER);
      textAlign(CENTER, CENTER);
      b1=new Button("Tap me!", width*0.2, 200, width*0.6, 50);
    
      //  Other coce OMMITED for simplicity
    }
    
    void draw() {
      background(92);
      b1.Draw();
    
      //  Other coce OMMITED for simplicity
    
    }
    
    void mouseReleased()
    {
      if (b1.MouseIsOver()==true) {
        if ( Player.isPlaying() )
       {
          Player.pause();
        }
        else
        {    
          Player.loop();
        }
      }
    }
    

    Kf

  • You could also use G4P or controlP5. If you install the libraries using the Processing IDE's library manager, you can have a look at the provided examples. Alternatively, you can do a search on the forum and you could see previous posts:

    https://forum.processing.org/two/search?Search=G4P
    https://forum.processing.org/two/search?Search=controlP5

    Kf

  • ill try to implate your code into mine but dosent work :( the code looks complicated is there a way who is moore simple ^^ ??

Sign In or Register to comment.