koobas.hobune.stream
How to flip the card(in guiTexture)
Hello. I am thinking to create a memory card game. For example, i will have all the cards face down. So when player click on the card, i want the card to flip over. How do i go about doing the effect of flipping the guiTexture?? I hope it is clear. Not good in english.
Thank you
hello. i don't know how come i can't comment anymore. anyway thank you $$anonymous$$arnix. I will look into it. I have another ideas, don't need to use animation, i think.Something like a close window, so when player click on it, the window are open and the words are displayed? How about this? is it tougher??
As an alternative with GUITextures:
You could animate the GUITexture by scaling it in a horizontal way.
myCard.pixelInset.width = someAnimatedWidth
If the card has a width of 0, swap the texture of the card with the front texture: myCard.texture = theFrontTexture. And then animate it back to its original size.
UPDATE
To animate your card, you should use the Time class. I don't think I can make it any easier for you than this here. It has been written from scratch, so no compilation ensurance. =)
// save the original width in some variable first on the initialize step // set a variable called animateSpeed to some number you like for the speed. // save some state that tells you if we are in the front or in the back. var originalWidth; var animSpeed = 5; var isFront = false; var isAnimating = false; // set this to true when clicking
function Awake() { originalWidth = myCard.pixelInset.width; }
function Update() { if(isAnimating) { if (myCard.pixelInset.width > originalWidth) { // do nothing, the card is as big as it should be newWidth = 0; isAnimating = false; // done animating
// snap the card to exactly the right size
myCard.pixelInset.width = originalWidth;
}
// check the width of the card
else if(myCard.pixelInset.width > 0 && !isFront)
{
// make smaller, we are still looking at the back
newWidth = -animSpeed * Time.deltaTime;
}
else if(myCard.pixelInset.width > 0 && isFront)
{
// make larger, we are looking at the front
newWidth = animSpeed * Time.deltaTime;
}
else if (myCard.pixelInset.width < 0)
{
// the turnover point
myCard.texture = frontTexture;
isFront = true;
}
// add the new width to the current width
myCard.pixelInset.width += newWidth;
}
}
hello marnix, thank for the reply. what you mean by someAnimatedWidth?? how to calculate it?? and when will the card's width turn 0?? sorry am not very strong in program$$anonymous$$g.
Updated my answer. I hope this will be enough to understand. I am not saying that this is your correct solution, because I actually agree with @Christian.
If you dont want the animation, you can just change myCard.texture to the front-texture and then you're done.
hello marnix, thank you. i will give it a try although i still quite confused how thing work .
First of all, I like your idea, this is a great idea for a first game, if you're just starting out with Unity. :)
Secondly, you'll find that this is totally simple if you don't use guitextures for the cards. Make the cards actual 3D objects instead and scale the mesh to give it a proper size as a card. You should use a Cube mesh and make it really thin for a card, not a Plane mesh. This is because a Plane mesh is a single, 2D-surface, and will not accept a different texture on either side. A thin cube will. Then slap the card-textures onto the cubes' front and back. You can use a large plane underneath them all and give it a wooden texture to make it look like the surface of a tabletop, then position a camera right on top of the table and have it look directly down.
Once your cards are 3D objects, you can flip them by rotating them around one of its axes, but remember to do this in LOCAL space. You can use transform.Rotate to accomplish that, making sure you pass Space.Self to indicate local space:
transform.Rotate(new Vector3(0, 180, 0), Space.Self);
That line of code flips a card to its backside around the y-axis.
hello, thank you for the reply. But sorry i totally don't understand what you mean. Care to explain in details?
Explain in details what you've done yourself, first. How are your cards modelled currently? Are you using GUITextures, like in this link?
http://unity3d.com/support/documentation/Components/class-GuiTexture.html
hello.. refer to the image http://imageshack.us/photo/my-images/840/memoryd.png/.
So far i only create guiTexture on the wall. Hiding behind is all the words.
If you're just using guiTextures, when a click is detected on a texture, hide that texture to expose the words underneath.
If, as you've mentioned above, you want to have a "flip" effect, you'll have to either animate it with textures (swapping out the texture frame-by-frame to mimic actual movement) or do as Christian said and move to a gameObject-based approach. Of these options, the latter seems like the easier.
hello ChrisD, yes, i agree that the answer Christian suggest is much more easier approach. I try the way and i wonder how come the image i add into cube look so dark. I mean like cannot see properly the texture of the cube.
