Change image according to touch dragged - cocos2d-iphone

this one is my sprite sheet i want to change the image according to user moves his finger on the screen
i.e, when he is touches the finger near this bow which is displayed initially no2 image from sprite sheet must be displayed, as he goes on dragging his finger according images must be displayed on screen
can anyone please guide me on this scenario because i totally don't know from where i must start.
thanks in advance
this is how i am displaying first image from sprite sheet
danceSheet = [CCSpriteBatchNode batchNodeWithFile:#"bowspritesheet.png"];
[self addChild:danceSheet z:1];
danceSprite = [CCSprite spriteWithTexture:danceSheet.texture rect:CGRectMake(0, 0, 90, 140)];
danceSprite.rotation=-90;
danceSprite.position=ccp(screenSize.width/1.2, screenSize.height/6);
[danceSheet addChild:danceSprite z:0];

Here you have to make one variable that tells you that is the maximum distance user can stretch. Beyond that if he stretch , there will be no effect on the bow. Suppose that distance as 30 pixels.
Now you can implement your functionality using cctouchbegun method and cctouchmoved method. In cctouch method you have to set one ccpoint variable which will store the first location user touched. Suppose that as firstLocation. Simultaneously, you change the sprite of your bow to no.2 image.
Now, you have to work in ccmoved function. In that as user moved his fingure you will get current position where user has touched right now. So you have to get the distance and devide it by (30/10) that is 3. Suppose (your distance/3)= 1 then you don't need to change the image of the bow. Now if it is equal to 2 then you have to change the bow wiht no.(2+1=)3 image. SO From this way you can implement bow functionality.Here we did (30/10) because you have set maximum distance user can stretch is equal to 30 and you have 10 different image of bow with arrow.
Hope, you get this,.If you find any difficulty in implementing this you can as me.

I think you want some arrow animation using this given sprite-sheet, and you might want like when you swipe backwards from middle of your bow weapon then you want to launch your arrow. Right ?! you can use this sprite-sheet ,i guess what you have to do is just calculate or assume some distance. and as i am showing your this sprite-sheet , you have around 10 images for launching arrow action. so what you have to do is just put all those images at some equal distance according to your touch location ... i.e if you have 30px distance then you can put all your images according to your touch at 3px position. means you will start with your initial image at 0px & then put all other images at 0 -3 -6 -9 & so on.. so this way you might achieve this. I hope my this try help you .. ask me if you don't get my answer at any point.

Related

How to calculate the listbox scrollbar row based on the thumb position?

While searching about I found these topics by Raymond Chen position calculation in scroll bars and scrollbar series I have read all the series but I still couldn't figure out how to properly calculate it, I'm not sure if I have missed something as English is a bit difficult to me.
Based on what i read, I tried to calculate it like this:
1- Get the total height of the list box range max * row height
2- Get the scroll area listbox height - arrows - thumb height
3- How many pixels of the total height must be scrolled for each pixel of the 'scroll area' total height/scroll area
4- Resulting in the formula:
((thumb position - arrow) * pixels) / row height
To get the thumb position I have used the API GetScrollBarInfo, however, it return the thumb position in a different position than where it was, in the example below it returned 45 while it's at 40:
Example
My calc method returned 408 while the top row is 406.
I know about the APIs SetScrollInfo, GetScrollInfo and GetScrollBarInfo, however, as i mentioned they return a different position than where the thumb really was and new data (rows) is constantly added to the control im working, making not viable calling these api multiple times.
How do windows calculate the listbox top row relative to the thumb position? im looking for information to create a custom scrollbar.

Issue related to draggable content in famo.us

I have small application in famo.us framework. There are 5 images. I want drag images. requirement is like when i drag firstImage, second image should be visible behind the first image. i tried to show second image on dragging up of firstImage, but it hides firstimage.
so is it possible to show second image behind the first image ??
Thanks
Check the z position of your images. Chances are you're encountering z-fighting, where two elements exist on the same position on the same z-axis. Try changing the z-index of the images to different values first to see if that fixes it.
Otherwise, check the 3d-transform you've supplied to famous to make sure your images aren't resting on the same z-value.

SDL drawing a sprite once a button is pressed

So, i'm a complete stranger to SDL and i found this nice code online:
http://gamedevgeek.com/tutorials/animating-sprites-with-sdl/
I was just wondering how to make it so that when i press space a shape gets placed infront of me? For instance, im just walking around and when i press space a rectangle or another bmp is places in front of me.
Sorry for not being explicit in what i want, i just dont know how to explain it.
You need:
Another Surface to draw (blit), made from the rectangle.bmp. This would use the same method as is used for the grass (or the player if you wanted animation).
Knowledge of where "in front" is: up, down, left or right. Look at the code and see what variables change when you press one of the arrow keys. (Hint: don't use rcSprite.) In a larger game, you would want to define a new variable for the direction that the player is facing, and then use that for both the sprite animation and for placing the rectangle, as it would make the code easier to understand.
Some new code in HandleEvent, which does something if the key is SDLK_SPACE.
Then calculate a position to place the rectangle (say, the player's position with 50 added to "x" if they were facing right), and draw the rectangle in the same way as the grass.
In general, look at what code has already been written, and Google for stuff you don't know (e.g. the name of SDLK_SPACE).
Good luck

How to show part of an image using QT?

So, this is my problem: I have this very big image, and I want to show only a specific part of it. After the user pressing a specific key I want the image to move, showing another part of it. The transition from one part of the image to another have to be smooth, animated.
I tried using a QLabel to show the image but it always shows the center of the image, and I do not really know how to make the animation. What would you guys suggest?
Interesting question. Here is something I just tested and seems to work.
Add a QGraphicsView with dimensions the dimensions of the part of the image you want to display, eg 100x100. Create a QGraphicsScene and add it to the view:
QGraphicsScene* pScene = new QGraphicsScene(this);
ui->graphicsView->setScene(pScene);
Now add your image into the scene. In my case I has an image in my resource file. The trick is to set the sceneRect to the position you want to display. I wanted to display an 100x100 part of the image starting from 0,300 :
pItem = pScene->addPixmap(QPixmap::fromImage(QImage(":/photos/image")));
pScene->setSceneRect(0,300,100,100);
In order to test the smooth moving I added a button which when clicked is triggering a slot called move. This slot simply updates the sceneRect. In my simple example I just move the image 100 pixels right. In a real world scenario you could also move it diagonally or vertically and check the image limits.
void move()
{
for (unsigned i=currentX; i<currentX + 100; i++)
{
ui->graphicsView->scene()->setSceneRect(i,300,100,100);
qApp->processEvents();
}
currentX += 100;
}
Notice the currentX variable. It is nothing more than the last image position. Also we must call the processEvents in order to "see" the image moving smoothly.
You could use QPixmap::copy( int x, int y, int width, int height ) to copy a region of the image and display that.
Few options:
Try using a Q3CanvasSprite (within in a Q3Canvas). It is designed more for splitting one image into multiple ones but not for animating between them. You could try abusing it and declaring (say) 100 frames (10 per digit, which would be used as animation steps) or just use the move() method.
Try QGraphicsPixmapItem::setOffset() (within a QGraphicsScene). This might be overkill as QGraphicsScene is made for large number of images).
I'm not sure, but maybe this can be done with QStateMachine and QAbstractAnimation.

Cocos2d scroll layer on Sprite drag

I have designed a small tutorial named "Stacker", As the name suggests, The game involves stacking blocks on each other. I have a large number of blocks to be stacked and hence all cant be accomodated in the screen itself... I m new to cocos2d and box2d but have managed to create a body with its adjoining sprite wen a user clicks on the screen. I have used MouseJoint to give movement to the body till the user performs the drag action that is till the user takes his finger off the screen.
The problem is that i need to follow the sprite (actually need the camera to follow the sprite) when the user drags it above the screen space, i referred the following links with no success... i guess wat i need is to move the body to a virtual coordinates which m not getting coz even if the screen does shift using the camera methods, but the sprite doesnt move with respect to the screen...
cocos2d forum link
flash concept but box2d
Can some1 guide me in case i need to have some pre-requisites before following camera in the manner i specified.. Thanx!
Ok Guys!
Got it guys! Had to take a global variable which records the increments per frame, The increments were equal to the layer movement which i did by setting the position of the layer to a unit less in every frame! Then set the Mouse join to the target which is (ScreenCoordinates + increment) dis too has to be done in every frame!
Done!
Cool method but needed a bit of brainstorming!!