Rotate a rect
Monkey Forums/Monkey Programming/Rotate a rect
| ||
Hi all I am wanting to know how to rotate a rect in Monkey, should I use the matrix transformations in money to achieve this? With PushMatrix Rotate and PopMatrix, I get the usual rotation around the origin, so my object does not rotate around itself (local coordinate). Can someone point me in the right direction to get this working? Do I need to transform from world to local? Is so, how do I accomplish that? |
| ||
Translate to set the center of rotation, then rotate, then dra |
| ||
Hmmm, yeah that is what I have been attempting, here is my code, it still does not translate to local coords.Import mojo Class Game Extends App Field toggle:Bool = False Method OnCreate() SetUpdateRate 60 End Method OnRender() Cls SetColor 0, 0, 0 PushMatrix() SetColor(255, 255, 255) If (toggle) Translate(30, 30) Rotate(45) EndIf DrawRect(300, 300, 30, 30) PopMatrix(); DrawText "Rotation test", 10, 10 End Method OnUpdate() If KeyHit(KEY_SPACE) toggle = Not toggle EndIf End End Function Main() New Game() End |
| ||
Ok, I got it, you transform to where you want the object, then rotate, and draw. Thanks!Import mojo Class Game Extends App Field toggle:Bool = False Field angle:Float = 0 Method OnCreate() SetUpdateRate 60 End Method OnRender() Cls SetColor 0, 0, 0 PushMatrix() SetColor(255, 255, 255) Translate(300, 300) Rotate(angle) DrawRect(-15, -15, 30, 30) PopMatrix(); DrawText "Rotation test", 10, 10 angle = angle + 1 End Method OnUpdate() If KeyHit(KEY_SPACE) toggle = Not toggle EndIf End End Function Main() New Game() End |
| ||
Just wondering if your actually doing a rect as a test but your ultimatly going to be rotating a sprite or image ? If your end goal is working with sprites then you don't in a lot of cases need to translate, you simply set the midhandle flag on the image and then use the override for DrawImage and give it the rotation value. |
| ||
Interesting, let me take a look at midhandle, but I am not going to be using a sprite here. I needed to rotate the rect, and then scale it to achieve a trail effect for a projectile. Is there a better way for me to accomplish that? I am scaling the rect and decreasing the alpha and it gives a really nice trail. Here is a screenshot ![]() I have not started using sprites yet with monkey believe it or not, do you have a quick example of what you mean? |
| ||
Ah ok, are you talking about SetHandle? I see that in one of the Monkey samples. You set the handle and the specify the rotation on DrawImage. What do you guys recommend I do for bullet trails? Load an image, rotate it and scale it? |
| ||
You could do something like this for rotating rectangles:Import mojo Class RectDemo Extends App Method CreateRectangle:Image( width:Int,height:Int,color:Int = $FFFFFFFF) Local img:Image = CreateImage(width,height) Local pixels:Int[width*height] For Local i:Int = 0 To pixels.Length()-1 pixels[i] = color Next img.WritePixels(pixels,0,0,width,height) ' Set Handle to The middle img.SetHandle(width/2, height/2) Return img End Field rect:Image Field angle:Float Field alpha:Float Field dec:Float Field scale:Float Method OnCreate:Int() rect = CreateRectangle(50,50) angle = 0.0 alpha = 1.0 dec = 0.01 scale = 1 SetUpdateRate(60) Return 0 End Method OnUpdate:Int() angle += dec*200 alpha -= dec scale += dec*10 If(alpha<= dec) dec *= -1 alpha = 0 Elseif(alpha>=1) dec *= -1 alpha = 1 End Return 0 End Method OnRender:Int() Cls() SetAlpha(alpha) DrawImage( rect,DeviceWidth()/2,DeviceHeight()/2,angle,scale,scale ) SetAlpha(1.0) Return 0 End End Function Main:Int() New RectDemo() Return 0 End |
| ||
Yeah that is pretty cool. Thanks for posting. I will prototype this change too, and see how it looks, I will go for a gradient filled texture and stretch it the length of the trail and report back. Is it less computationally expensive to use images, than primitives? |
| ||
Well, using an image with SetHandle instead of a rectangle is a lot better. I tried it out and it works really well in a lot less lines of code. Thanks all for your help. |
| ||
Is this the kind of thing your talking about ? http://www.monkeycoder.co.nz/Community/topics.php?forum=1237&app_id=237 What I am doing there is taking a 2*4 pixel image and scaling it to make a line , I then create 10 line segments to make a trail that fades out, the above code is extremely inefficient because as each tail segment reaches 0 alpha I am deleting it and creating a new segment at the front, did this to test its worst case performance which I was impressed with. What you really would do is create an array of those ten moving tail segment points and then simply draw your cool line between them, so not creating and deleting segments each move but rather just moving the ones that already created. |
| ||
Kinda yeah, I will work on it some more and see how it looks after some tweaks. Thanks again |
| ||
This is what I have right now and I think it will work!![]() |
| ||
how you going about it if you don't mind me asking ? |
| ||
I have a 10x2 gradient filled texture, which I scale and alpha blend. It works quite well. I have tested 2 weapons types with many trails, and it renders real nice. I have noticed that with HTML5 as the target I get a significant frame rate drop, so I am going to have to try and speed it up more. If you like I can post some more screenshots. |
| ||
screenshots are always nice, if your game has a black background there is another method of making trails that will trail everything you draw with very little overhead. |
| ||
I may even post a demo tonight of the trails, yeah I won't be using just a plain background forever, so I can't use the other method. What does that method entail? Not clearing the backbuffer? |
| ||
Here is a screenshot, hopefully I can get to post a demo soon. I have made the code a lot more efficient, and now I don't see a framerate drop anymore.![]() |
| ||
Yeah, this basically... https://dl.dropboxusercontent.com/u/56777267/code/Alpha/arrows/MonkeyGame.html What you do is replace the cls call with the drawing of a partially alphaed out mask image, the really neat thing is that you can texture this cls image to create some really cool looking effects. the one in the above demo makes it look as if the little ship things are releasing some sort of thrust out their backs, but its actually just the cls texture. its neat, but yeah only really usable with a black or coloured background. |
| ||
A bigger limitation than requiring a flat coloured background is that the render buffer behaviour isn't consistent across targets. Some will buffer swap, some might clear without you doing it explicitly. |
| ||
Interesting, say... how do you share your demo like you did there on dropbox? I can show you guys my demo real quick *EDIT ok, I do the whole dl.dropboxusercontent.com deal, but just get a blank page for MonkeyGame.html Also when I try the HTML on my local machine I get a DOM security error, very frustrating. It works fine in debug, standalone, not so much. |
| ||
Android in particular won't do the buffer fullscreen motion blur trick. I already tried. :( Some video cards on PC won't either. |
| ||
@grovey Copy the html5 folder to your public Dropbox folder, then right click on MonkeyGame.html and choose "Copy public link" from the context menu. Then paste that url into a post here. |
| ||
I try that, but just a blank page is served up. http://dl.dropboxusercontent.com/s/wgl5a9iz0vl7e9q/MonkeyGame.html This file will also not work on my local machine, outside of the IDE/Debug mode |
| ||
I don't think you copied the whole html5 folder. Looks like you just copied the html file. |
| ||
I copied the whole directory, I get a menu option saying "Share dropbox link" but none that says "copy public link". I copied my entire html5 directory, including the data folder, config file and main.js file. It does seem that MonkeyGame.html is isolated as if it does not have access to the game code and data, but I cannot seem to get it shared. |
| ||
"Share dropbox link" is the context menu option you get for files outside of the public folder. |
| ||
Ok, dropbox accounts created after October 2012 no longer have public folders, you have you create one yourself, which is why I was not seeing the correct context menu. Anyway, I created the public folder, and now it works. Here is the demo. https://dl.dropboxusercontent.com/u/201286064/html5/MonkeyGame.html |
| ||
is that true about the public folder? wonder why they did that. as for the demo yeah it looks neat, simply scaling the small image out looks smooth as well, which is nice. |
| ||
Looks good - love me some Alien Breed / Chaos Engine / Smash TV! :) |
| ||
Thanks guys, yeah I am thinking of starting a project thread here on the Monkey forums where I can chronicle the progress for others to see and play test. This was just a prototype to get trails working, and as with most prototypes you can get carried away adding things to it. I have a few more things to prototype and I will officially start coding the game. |
| ||
Ok, I started a project thread for this http://www.monkeycoder.co.nz/Community/topics.php?forum=211& Hopefully I can continue to make decent progress, and actually finish a game! |