ofVideoPlayer inside a circle?


#1

Hi, very new to both coding and openFrameworks. Would anyone know how to import a video but with the frame being a circle rather than the original rectangle. Preferably without distorting the image, more like a circle mask. I’d also like to do it with a circle that has a resolution of 6 so that it looks more like a hexagon. Is there something inside ofVideoPlayer that can do this?
Thanks in advance


#2

“the frame being a circle rather than the original rectangle”. This is not possible. What you can do is to “cut out” a circle from the original frame, and draw it. It is like to apply the mask of a circle to your video, and then draw on screen just what is inside the mask.

Have a look at the examples. First, have a look at examples/video/videoPlayerExample and then examples/shaders/05_alphaMasking. If you are new to shaders read this article. https://openframeworks.cc/ofBook/chapters/shaders.html.


#3

Thank you for your help


#4

Hi,
It is a bit late, but as a complement to @edapx answer, you can also make a mask like that, it can be more simple to begin:

class ofApp : public ofBaseApp
{

	public:
		void setup() ;
		void update() ;
		void draw() ;

		ofVideoPlayer video ;
		ofFbo mask ;

} ;
void ofApp::setup()
{
	// load the movie
	video.load( "fingers.mov" ) ;
	video.play() ;

	// Create a surface (an ofFbo) to draw the circle mask 
	float w = video.getWidth() ;
	float h = video.getHeight() ;
	mask.allocate( w, h ) ;

	// Draw the circle into the fbo
	mask.begin() ;
	ofClear( 0.f, 0.f ) ;
	ofDrawCircle( w / 2.f, h / 2.f, h / 2.f ) ;
	mask.end() ;

	// Tell OF to mask the video texture with the fbo texture
	ofTexture & videoTexture = video.getTexture() ;
	ofTexture & maskTexture = mask.getTexture() ;
	videoTexture.setAlphaMask( maskTexture ) ;
	// The same in a shorter form:
	// video.getTexture().setAlphaMask( mask.getTexture() ) ;
}

void ofApp::update()
{
	video.update() ;
}

void ofApp::draw()
{
	video.draw( 0.f, 0.f ) ;
}
```