Alpha channel(transparency) is not working? Transparent ellipse completely masks a box

I don’t know why the orange box is masked by the transparent ellipse, please see the GIF below. How can I prevent the orange box from being masked?

oF of_v0.9.0_osx_release
Mac OS 10.10.5
Xcode 6.4

in ofApp::draw()

ofPushMatrix();
ofEnableDepthTest();
ofTranslate(ofGetWidth()/2, ofGetHeight()/2, 0);
ofRotateY(mouseX);

ofSetColor(ofColor::yellow);
ofDrawBox(0, 0, -50, 10, 10, 10);
ofSetColor(255);

ofSetColor(255, 0, 0, 10);
ofDrawEllipse(0, 0, 0, 100, 100);
ofSetColor(255);

ofSetColor(ofColor::orange);
ofDrawBox(0, 0, 50, 10, 10, 10);
ofSetColor(255);

ofDisableDepthTest();
ofPopMatrix();

Hi there!

It’s not a bug, it’s the way OpenGL works, regarding translucency and the depth buffer. Basically:

In order to achieve translucency, all opaque objects must be drawn before drawing any translucent ones.

(From the OpenGL Wiki — Transparency Sorting)

So, all you have to do is:

ofPushMatrix();
ofEnableDepthTest();
ofTranslate(ofGetWidth()/2, ofGetHeight()/2, 0);
ofRotateY(mouseX);

ofSetColor(ofColor::yellow);
ofDrawBox(0, 0, -50, 10, 10, 10);

ofSetColor(ofColor::orange);
ofDrawBox(0, 0, 50, 10, 10, 10);

ofSetColor(255, 0, 0, 10);
ofDrawEllipse(0, 0, 0, 100, 100);

ofDisableDepthTest();
ofPopMatrix();
1 Like

Hi hubris

I got it, thank you so much;) That was so helpful!!

Yuta

1 Like