Ayuda! transparencia y relleno de ellipse

Ayuda!! Como hacer para que la ellipse tome la textura de una imagen, solo logre que tome la paleta de colores, pero quisiera que se rellene con la textura de una imagen. Intente usar createShape para rellenar la ellipse pero no puedo resolverlo.tambien quiero que cuando la ellipse se mueva tenga transparencia, es decir que se superpongan unas a otras, pero respentando la paleta de colores que uso, como se puede hacer eso? Intente con Fill y stroke pero tampoco puedo resolverlo.
Agradecería mucho que alguien pueda ayudarme!

//declaración del ArrayList
ArrayList <Caminante> caminantes;

Paleta colores;
//PImage [] trazos;
PImage pincelada;
//int anchoPincel;
//int altoPincel;
int posx, posy;
//int cantPinceles;


int cantidad = 10;
void setup() {
  fullScreen();
  //size( 1000, 600 );
  fill(0);
  
  
  imageMode(CENTER);
  //cantPinceles=5;
  //inicalizo el objeto, indigandole como parametro del constructor el nombre
  //de la imagen que usare como paleta
colores= new Paleta ("rojo.jpg");
 colorMode(HSB, 10);
  //background(255, 0, 0);
  

  //inicialización
  caminantes = new ArrayList();

  for ( int i=0; i<cantidad; i++ ) {
    //inicialización
    Caminante c = new Caminante(colores.devolverColor());
    //lo agrego al ArrayList
    caminantes.add( c );
  }
  background( 0 );
}
void draw() {
/* pushStyle();
  fill( 0 , 5 );
  rect( 0,0, width ,height );
  popStyle();
  */
  
  for ( Caminante este : caminantes ) {
    if( mousePressed ){
      pushStyle();
    //  fill( 0 , 30 );
      
      fill(0,30);
    rect( 0,0, width ,height );
      popStyle();
         
    }    
    este.mover();
    este.dibujar();
  }
}
class Caminante {

  
  float x,y;
  //float t;
  float velocidad;
  float direccion;
  float variacionAngular = 7;
  color colorRelleno;
  
  Caminante(color _colorRelleno ) {
    colorRelleno = _colorRelleno;
    if (random(100) < 50)
    {
      x = width;
      y = random( height );
    }
    else
    {
      x = random( width );
      y = height;
    }
    
   // t = random( 10,20 );
    velocidad = 7;
    direccion = 5;//radians( random(100) );
    pushStyle();
    print("caminantes");
    
    //le da la paleta de color
    
    //colorRelleno = color( random(105,208), random(91,100), random(195,208), random(5,30) );
    
    popStyle();
  }
  
  void dibujar(){
    pushStyle();
    noStroke();
    fill( colorRelleno );
    ellipse( x , y , 35,35 );
    popStyle();
  }
  
  void mover(){
     
    direccion = direccion + radians( random(-variacionAngular,variacionAngular) );
    
    //coordenadas polares
    float dx = velocidad * cos( direccion );
    float dy = velocidad * sin( direccion );
    x = x + dx;
    y = y + dy;
    
    //espacio toroidal
    x = ( x>width-15 ? x-width : x );
    x = ( x<0 ? x+width : x );
    y = ( y>height ? y-height : y );
    y = ( y<0 ? y+height : y );
    
  }

}

class Paleta {
  //el unico miembro de la clase es una PImage
  PImage cuadro;  

  Paleta (String nombreArchivo ) {
    //en el constructor se carga la imagen, cuyo nombre de archivo lo recibe como parametro
    cuadro=loadImage (nombreArchivo );
    print("Entro");
  }
  //el metodo dibujar me permite mostrar en pantalla la imagen de la paleta que se cargó
  void dibujar(int x_, int y_) {
    int posx=x_;
    int posy=y_;
    image (cuadro, posx, posy);
    print("dibujar");
  }
  //el metodo devolverColor, de tipo color, utiliza dos variables para definir
  //aleatoriamente una coordenada, acorde a las dimensiones de la paleta cargada
  color devolverColor() {
    int x = int( random( cuadro.width ) );   
    int y = int(random( cuadro.height ));   
    //utilizando esas coordenadas aleatorias (x,y) 
    //con el metodo get devuelve el color rgb del pixel de dicha coordenada
    print("devolvio");
    return cuadro.get( x, y );
    
  }
}
1 Like

Esta es una demonstration para cambiar el alpha cuando utilizas fill():

  color devolverColor() {
    int x = int( random( cuadro.width ) );   
    int y = int(random( cuadro.height ));   
    //utilizando esas coordenadas aleatorias (x,y) 
    //con el metodo get devuelve el color rgb del pixel de dicha coordenada
    print("devolvio");

    color argb = cuadro.get( x, y );
    int myAlpha = 50;
    argb &= 0x00FFFFFF;               //RESETS alpha value: do first
    argb ^= (myAlpha  & 0xFF) << 24;  //Assigns a new alpha 
    return argb;
  }

Para trabajar con una textura en un elipse, necesitas trabajar con un objecto PGraphics si deseas trabajar con transparencia y tienes tambien que trabajar con mask(). Mas info en posts anteriores:

https://forum.processing.org/two/discussion/23886/masking-a-shape-with-another-shape
https://forum.processing.org/two/discussion/27757/can-i-create-a-mask-from-a-shape
https://forum.processing.org/two/discussion/11832/how-to-use-a-shape-ellipse-as-a-mask-to-show-a-background-a-image

Trata estas sugerencias y genera con una pequeña demonstracion para entender el concepto. Si te estancas, comparte la pregunta y tu código aqui. Es preferible que lo hagas en inglés ya que recibiras una respuesta más rápida.

Kf

2 Likes