I am painting on a Panel by overriding the paintComponent -method.
class Canvas extends Panel ...
...
override def paintComponent(g: Graphics2D) {
super.paintComponent(g)
for (cmd <- commands.get) cmd.execute(g, this)
}
Okay. Inside one of the commands is this one.
case class TestCommand() {
def execute(g: java.awt.Graphics2D, c: Canvas) = {
val img = new BufferedImage(c.width, c.height, BufferedImage.TYPE_INT_RGB)
g.drawImage(img, null, 0, 0)
}
What im trying to do there is create a BufferedImage from the Graphics2D -object, so i can read the value of some pixel at location x, y.
However when this command is executed, i notice that the drawImage -method causes my panel to turn completely black, wiping everything i've drawn on it so far. I want the command to simply create a BufferedImage of what i've drawn on the panel, instead of somehow affecting the Graphics2D -object itself. What am i doing wrong here?
A Graphics2D is connected to some canvas or image. You might think of it like a brush or a pen. In this case, the graphics object you have is tied to your panel. Calling drawImage draws the image on to the panel.
If you want to draw the panel on to the image, you need a Graphics for the BufferedImage:
Graphics2D ig = img.createGraphics();
Then you need to paint the panel to the graphics. java.awt.Component provides a number of convenience methods for this type of thing, for example printAll:
c.printAll(ig);
ig.dispose(); // don't forget to dispose Graphics you've created
(Sorry, I don't really know Scala syntax, if it's different.)
Without being too presumptuous, there may be better ways to approach what you're doing. E.g. if you're doing painting to the panel, as mentioned in the comments, it's usually a good idea to do your painting on an image to begin with, then paint the image to the panel. Then you always have the image.
Related
I am working on a flash sound mixer application with multiple sound channels, and I am having trouble with the lights beside the volume knob.
Is there a way to hide just a part of an image?
On the image below, image-2 is on top of image-1 to create some kind of volume level indicator effect, and how much of image-2 is shown depends on the value of the volume.
image-url: http://s30.postimg.org/r3ow1g5bl/volume_lights_level.png
I've tried by just reducing the height of image-2, but it looks awful and distorted.
Is there something in flash that works closely the same as CSS's behavior.
example: I'll just make image-2 a background of a shape, and when I reduce the shape's height, the image-background does not get distorted or changes it's height as well.
By searching for solutions, I have come across the mask property, but I don't quite understand how it works, and most of the examples shown are images placed inside circles.
Is the mask property applicable in this situation?
I'm quite new to flash so I don't know a lot of things yet.
You can indeed use a mask.
How to programmatically create your mask
Put an occurrence of your image named myImage on the stage, and put over this occurrence a mask named myMask with the same dimensions. You can apply myMask mask to myImage using it's mask property like below:
Main Timeline
myImage.mask = myMask;
function mouseMoveHandler(e:MouseEvent):void {
myMask.height = myImage.y - e.stageY;
}
stage.addEventListener(MouseEvent.MOUSE_MOVE, mouseMoveHandler);
You have just to adapt this code to your animation, in the function where you click your button.
I got it working now, many THANKS #VC.One. heres how I did it.
Imported img-2 to stage, converted it into symbol(type:Movie Clip), assigned instance name: img2_mc.
I created a new layer for the mask, drawn a rectangle using rectangle tool, converted it also to symbol(type:Movie Clip), assigned instance name: mask_mc.
Then applied the mask to img2_mc.
/* the code */
img2_mc.mask = mask_mc;
function onEnterFrame(event:Event):void{
var volumeKnob_y = volSliderKnobOn.y + 12; // adjust it to the center of the knob
mask_mc.height = volumeKnob_y;
}
Here's what i want to do:
I want to load a model (most likely .3ds) into my .swf and be able to rotate it with the mouse.
This works fine at first glance, but there's problem, the rotations 'switch' over. Or to say it differently:
Imagine we have a model in the shape of a pipe.
If we drag the mouse to the right, the model rotates along its X-Axis to the left, mouse to the left, X-Axis rotation to the right, moving the mouse up, Y-Axis rotation downward, mouse down, Y-Axis rotation upward.
Now, lets say we turn the pipe to the right or left, until we face the (former) 'backside' of the pipe, and then we move the mouse down. The model will rotate downward instead of upward.
I hope you understand what i mean with this. I've been looking around for a good while now and never found a satisfying solution. There was talk about quaternions, but i can't grasp them.
Another suggestion i read somewhere is the following:
create a Matrix3D object, apply rotation on it, then multiply it with the desired Matrix3D of my 3d-Model.
I tried to do it, but the result stays the same, the directions of rotation switches depending on what side i'm facing.
private function update(e:Event):void
{
xCalc = (0.3*(stage.mouseX - lastMouseX));
yCalc = (0.3*(stage.mouseY - lastMouseY));
if(move)
{
var objTransform:Matrix3D = new Matrix3D();
objTransform.prependRotation(xCalc, Vector3D.Y_Axis, objC.pivotPoint);
objTransform.prependRotation(yCalc, Vector3D.X_Axis, objC.pivotPoint);
mesh.transform = multiply3DMatrices(mesh.transform, objTransform);
}
lastMouseX = stage.mouseX;
lastMouseY = stage.mouseY;
view.render();
}
multiply3DMatrices simply multiplies two 4x4 Matrices together.
objC is the ObjectContainer3D that holds my model. For some reason i cannot rotate it properly, unless i manipulate the rotationX/Y/Z properties.
mesh is the mesh inside of the Model (which is very simple, a single mesh).
Also, i'm aware that i could try another Framework for this (like papervision) but this project requires me to use Away3D.
Solved it by myself, the problem was that i created a new Matrix3D Object every time. The fixed code looks like this:
private function update(e:Event):void
{
...
if(move)
{
var objTransform:Matrix3D = mesh.transform;
objTransform.appendRotation(xCalc, Vector3D.Y_Axis, objC.pivotPoint);
objTransform.appendRotation(yCalc, Vector3D.X_Axis, objC.pivotPoint);
mesh.transform = objTransform;
}
...
}
And yes, the user bwroga was actually right, i should've used appendRotation instead of prependRotation, as well.
I am developing a 2D games with cocos2dx, in which I am still very new... inside the game, there's a number of UI Elements that I'd like to group together as one (I intend to group them into CCLayers). For example a few text labels and sprites form a CStatBar which is a CCLayer. This CStatBar will then be included in the various other CCLayer
How do I do that? I created the CStatBar class and then, inside the containing class's init() function, I CStatBar::create() and call this->addChild(pStatBar) however, the statbar did not appear... is there any obvious thing that I missed? All the positions are correct. Thanks!
EDIT:
Notes:
1. ccTouchesBegan of the sublayer is called, however it is not rendered/seen
2. How do I resize the sublayer so that it only cover partial area of the parent layer? Supposedly the CStatBar should only cover 10% of the top area of the screen, not the whole screen...
inside the CParent::init() function, you can initialize the CSublayer like so:
// Create and initialize CSublayer
CSublayer* pSublayer= CSublayer::create();
float fWidth = pSublayer->getContentSize().width;
float fHeight = pSublayer->getContentSize().height;
pSublayer->setPosition(ccp(fWidth/2.0f, fHeight/2.0f));
this->addChild( pSublayer );
and your CSublayer can be defined like other CCLayer.
If you want to restrict the CSublayer to be smaller than the CParent layer, you can do so inside its init function like so:
CSublayer::init() {
// initialize the size with the size of the background sprite
CCSprite *pSpriteBackground = CCSprite::createWithSpriteFrame(
CCSpriteFrameCache::sharedSpriteFrameCache()->spriteFrameByName("background.png")
);
this->setContentSize(CCSize(pSpriteBackground->getContentSize().width, pSpriteBackground->getContentSize().height));
pSpriteBackground->setPosition(ccp(fScreenHalfWidth, fScreenHeight-(pSpriteBackground->getContentSize().height/2.0f)));
this->addChild(pSpriteBackground);
}
I have a 3D ball in the browser , now I want to dig a hole on it to see its back.
How can I make it possiable ?
For example, I want the white triangle part of the cube could be transparent(I mean we could see the background behind the cube).
I've tried to change the alpha in fragment shader(the area in the code is a square not triangle, doesn't matter):
<script id="shader-fs-alpha" type="x-shader/x-fragment">
precision mediump float;
varying vec4 vColor;
uniform float uAlpha;
void main(void) {
if( gl_FragCoord.x < 350.0 && gl_FragCoord.x > 300.0
&& gl_FragCoord.y < 300.0 && gl_FragCoord.y > 230.0
) {
gl_FragColor = vec4(0, 0 ,0, 0.0);
} else {
gl_FragColor = vec4(vColor.rgb, 1.0);
}
}
</script>
This actually works but the area turns to be white(not transparent), so then I tried to enable blending, but that makes the whole cube transparent.
So now I thought if there's a way to enable bleanding in fragment shader and I could disable it in the else block.
Here's my whole project https://gist.github.com/royguo/5873503:
index.html : Shader script here.
buffers.js : All obejcts here.
shaders.js : Init shaders.
You should use stencil buffer. 2 steps: One, draw the triangle on stencil. Two, draw the cube with stencil test.
// you can use this code multiple time without clearing stencil
// just increment mask_id
mask_id = 1;
// allow to draw inside or outside mask
invert_mask = false;
1) Activate stencil buffer. Configure it: no testing and write mask_id value
glEnable(GL_STENCIL_TEST);
glStencilOp(GL_KEEP, GL_KEEP, GL_REPLACE);
glStencilFunc(GL_ALWAYS, mask_id, 0);
2) Remove color & depth writing
glDepthMask(GL_FALSE);
glColorMask(GL_FALSE, GL_FALSE, GL_FALSE, GL_FALSE);
3) here draw your triangle :)
4) Enabled depth & color writing for the cube
glColorMask(GL_TRUE, GL_TRUE, GL_TRUE, GL_TRUE);
glDepthMask(GL_TRUE);
5) Configure stencil for the cube: no writing and test stencil value
glStencilOp(GL_KEEP, GL_KEEP, GL_KEEP);
glStencilFunc(invert_mask ? GL_NOTEQUAL : GL_EQUAL, mask_id, 0xff);
6) here draw your cube :)
7) cleanup: remove stencil test
glDisable(GL_STENCIL_TEST);
Don't forget to request a stencil when you create your opengl context (see WebGLContextAttributes, second parameter of getContext)
This code run well with Opengl ES 2 on Ios platform. It didn't depend of any extension. WebGL use the same API.
The only small defect: no msaa on triangle borders. There is no free lunch :)
You could render part of the scene without the object (or the objects insides) to a texture and then project the texture onto a surface in front of the object. Just make sure that the surface faces the camera directly (is parallel to the x-y-plane in cam-space) and that the texture is rendered with the same center and perspective as the screen.
Use Learning WebGL: Rendering to Textures if you require help doing this. You should also check the light options to make sure the surface itself isn't affected by the lighting that your object gets.
Also: official WebGL reference sheet
try add these lines
glEnable (GL_BLEND);
glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA);
It worked for me with OpenGL ES.
Or remove some triangles from the ball mesh, or apply texture to it that has transparent parts, turn on blending and turn off any type of culling, so you don't loose back-oriented triangles.
EDIT:
Here's a tutorial on blending in webGL: http://learningwebgl.com/blog/?p=859
You have multiple modes to choose from how two pixels will me blended, and by adjusting alpha values you could have anything you want.
Eventually, you apply texture that has alpha set to 1.0 everywhere, except those parts where it should be "hollow" and then enable blending. I hope I made myself clear.
TIP: Instead of reading documentation (which sometimes can be more confusing than helping), try this http://www.nihilogic.dk/labs/webgl_cheat_sheet/WebGL_Cheat_Sheet.htm,. It lists all functions in a very nice manner.
I have made a C++ Builder XE form with rounded corner with the help of the following code
BorderStyle = bsNone;
void __fastcall TForm1::FormCreate(TObject *Sender)
{
HRGN frmrgn;
frmrgn = CreateRoundRectRgn (0, 0, ClientWidth, ClientHeight,12,12);
SetWindowRgn(Handle,frmrgn,true);
}
It looks cool but the border is missing, I tried many thing but not get good result
so please help me to draw border of color RGB(96,96,96)
And I want to make whole form dragable.
1. Painting a dark grey border
This one's easy, depending on how complex you want the border to look. If you just want an outline in dark grey, either draw it using a combination of lines and arcs, or use the FrameRgn function to draw an outline around your region with a specific brush. Doing this is the best solution since you already have a region you've used to define the shape of the window.
However, the MSDN documentation for SetWindowRgn says, "After a successful call to SetWindowRgn, the system owns the region specified by the region handle hRgn. The system does not make a copy of the region. Thus, you should not make any further function calls with this region handle." You'll need to create your region again for the paint method.
Some code for your paint method:
HRGN hRegion = ::CreateRoundRectRgn (0, 0, ClientWidth, ClientHeight,12,12);
Canvas->Brush->Style = bsSolid;
Canvas->Brush->Color = RGB(96, 96, 96);
::FrameRgn(Canvas->Handle, hRegion, Canvas->Brush->Handle, 2, 2);
::DeleteObject(hRegion); // Don't leak a GDI object
2. Making the window draggable without its title bar
The short summary is that you need to handle the WM_NCHITTEST message. Windows sends this to see if the mouse is over the title bar ('NC' stands for 'non-client'; it's actually testing to see if it's anywhere in the non-client area, which can be any window border, not just the top one.) You can make your window draggable by saying 'yes, the mouse is in the caption right now' even when it isn't. Some code:
// In the 'protected' section of your form's class declaration
virtual void __fastcall WndProc(Messages::TMessage &Message);
// The implementation of that method:
void __fastcall TForm1::WndProc(Messages::TMessage& Message) {
TForm::WndProc(Message); // inherited implementation
if (Message.Msg == WM_NCHITTEST && Msg.Result == htClient) {
Msg.Result = htCaption;
}
}
You can perform some hit testing of your own to restrict what parts of your window appear to be the title bar, in order to create a title bar of your own.
Example Delphi code.
A good article about using this message, and things to be aware of / traps not to fall into.