# Mascara de recorte

**URL:** https://discourse.processing.org/t/mascara-de-recorte/24935
**Category:** Español
**Created:** [October 26, 2020, 8:50pm UTC](https://discourse.processing.org/t/mascara-de-recorte/24935 "2020-10-26T20:50:17Z")
**Posts on this page:** 3
**Page:** 1

<div class="post-metadata">

### Author: ![pescemc](https://avatars.discourse-cdn.com/v4/letter/p/3be4f8/32.png) [@pescemc](https://discourse.processing.org/u/pescemc)
#### Post date: [October 26, 2020, 8:50pm UTC](https://discourse.processing.org/t/mascara-de-recorte/24935/1 "2020-10-26T20:50:18Z")

</div>

Hola, necesito crear un programa como el del video que dejo a continuación, se trata de 2 imágenes superpuestas, con una máscara de recorte en forma circular manejada por el mouse, que muestra el exterior de una imagen, y el interior del otro. Y no estoy seguro de si es posible hacerlo, ¡gracias!

[https://www.youtube.com/watch?v=RorkBlgz0vQ&feature=youtu.be&ab\_channel=MatiasPesce](https://www.youtube.com/watch?v=RorkBlgz0vQ&feature=youtu.be&ab_channel=MatiasPesce)

De momento podría insertar las 2 imágenes y crear la elipse que sigue el mouse, lo único que falta es que la elipse funcione como una máscara de recorte:

```auto
PImage fondo1, fondo2;
PImage mask;

void setup(){
  
  size(1920, 1080);
  
  fondo1 = loadImage("1.jpg");
  fondo2 = loadImage("2.jpg");
  
  frameRate(60);
}

void draw(){
  
  background(fondo2);
  image(fondo1, 0, 0);
  
  ellipse(mouseX, mouseY, 200, 200);
  noStroke();
}

```

---

<div class="post-metadata">

### Author: ![datacolor](https://avatars.discourse-cdn.com/v4/letter/d/f6c823/32.png) [@datacolor](https://discourse.processing.org/u/datacolor)
#### Post date: [November 25, 2020, 10:01am UTC](https://discourse.processing.org/t/mascara-de-recorte/24935/2 "2020-11-25T10:01:43Z")

</div>

Hola!quiero darte ayuda pero el video fue eliminado…creo que tengo un codigo que puede ser tu solucion,decime necesitas ver en tu PImage mask la imagen resultante del proceso de mascara circular entre las imagenes fondo1 y fondo2?

---

<div class="post-metadata">

### Author: ![datacolor](https://avatars.discourse-cdn.com/v4/letter/d/f6c823/32.png) [@datacolor](https://discourse.processing.org/u/datacolor)
#### Post date: [November 25, 2020, 1:28pm UTC](https://discourse.processing.org/t/mascara-de-recorte/24935/3 "2020-11-25T13:28:04Z")

</div>

Hola aqui va el codigo:

PGraphics maskImage;  
PImage fondo1,fondo2;

void setup(){  
size(1920,1080);  
fondo1=loadImage(“1.jpg”);  
fondo2=loadImage(“2.jpg”);  
maskImage=createGraphics(1920,1080);  
}

void draw(){  
background(0);  
image(fondo2,0,0);  
//creamos la mascara circular  
maskImage.beginDraw();  
maskImage.background(0);  
maskImage.ellipse(mouseX,mouseY,200,200);  
maskImage.endDraw();  
//aplicamos la mascara  
fondo1.mask(maskImage);  
//mostramos el proceso como imagen  
Image(fondo1,0,0);  
}