I have an image which shows which way is north on a map. This image is updated by CoreLocation if a new heading is found. It is also placed at the correct position, I use the following code:
locateMeView.transform = CGAffineTransformMakeRotation(([CoreLocationController sharedInstance].heading - 45) * M_PI / 180);
CGRect frame = locateMeView.frame;
CGPoint pos = [MapClass vectorForLocation:[CoreLocationController sharedInstance].location mapCenter:curLocation zoom:curZoom];
frame.origin.x = (int)(self.view.bounds.size.width/2 + pos.x - frame.size.width / 2);
frame.origin.y = (int)(self.view.bounds.size.height/2 + pos.y - frame.size.height / 2);
frame.size.width = 24;
frame.size.height = 24;
locateMeView.frame = frame;
CoreLocationController is a class which stores the updates of the normal CoreLocation. The MapClass transforms lat/lng coordinates to x/y coordinates on my map. The position of the image is correct, but the rotation is causing strange effects. For 0 en M_PI the image is correct but between these the image is stretched as if it is also rotated around the z-axis and at M_PI/2 and 3 * M_PI/2, it disappears altogether. Can someone explain what is happening and what I am doing wrong?
I found out what was wrong (more or less anyway). When using the transform property you are not allowed (for whatever reason) to change the position by changing the frame, you have to use the center property. So the code in the end was:
CGPoint pos = [MapClass vectorForLocation:[CoreLocationController sharedInstance].location mapCenter:curLocation zoom:curZoom];
locateMeView.transform = CGAffineTransformMakeRotation(([CoreLocationController sharedInstance].heading - 45) * M_PI / 180);
locateMeView.center = CGPointMake(int)(self.view.bounds.size.width/2 + pos.x), (int)(self.view.bounds.size.height/2 + pos.y));
Hope that someone with the same problem will find my answer.
Another solution:
Set transform to identity
Change the frame
Set transform
In your situation it should be:
locateMeView.transform = CGAffineTransformIdentity;
CGRect frame = locateMeView.frame;
CGPoint pos = [MapClass vectorForLocation:[CoreLocationController sharedInstance].location mapCenter:curLocation zoom:curZoom];
frame.origin.x = (int)(self.view.bounds.size.width/2 + pos.x - frame.size.width / 2);
frame.origin.y = (int)(self.view.bounds.size.height/2 + pos.y - frame.size.height / 2);
frame.size.width = 24;
frame.size.height = 24;
locateMeView.frame = frame;
locateMeView.transform = CGAffineTransformMakeRotation(([CoreLocationController sharedInstance].heading - 45) * M_PI / 180);
Try setting the transform after the resizing? Order can matter with transforms.
Related
I have created one UIImageView
Here's code
capView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:kARROW_CAP_NAME]];
capView.frame = CGRectMake(0, 0, kARROW_H, kARROW_H);
[self addSubview:capView];
Now I have two points which I need to move around View, So, they are Updating..
PointA, PointB
I got the angle between them:
CGFloat angleBetweenPoints(CGPoint first, CGPoint second)
{
CGFloat height = second.y - first.y;
CGFloat width = first.x - second.x;
CGFloat rads = atan(height/width);
return RADIANS_TO_DEGREES(rads);
}
When I apply this angle to my UIImageView, it continuously change,
My used code here:
capView.transform = CGAffineTransformMakeRotation(arrowAngle);
or
capView.transform = CGAffineTransformRotate(self.transform, arrowAngle);
Arrow Angle is the value of above function which i write above..
Please take a look and help me.
Got the answer, So simple..
But still no one give me answer..
capView.transform = CGAffineTransformMakeRotation(RADIANS(M_PI_2 - arrowAngle))
And RADINAS is macro define here,
#define RADIANS(degrees) ((degrees * M_PI) / 180.0)
Thanks to all who be a part of it..
I'm having a heck of a time calculating points on a circle in Objective-C. Even after reading TONS of other code samples my circle is still way off center. (And that's taking into consideration "center" vs "origin" and adjusting for the size of the UIView, in this case a UIButton.)
Here's the code I'm using. The circle is formed correctly, it's just off center. I'm not sure if this is a radians vs degrees problem or something else. This is a helper function in a ViewController that programmatically creates the UIButtons and adds them to the view:
- (CGPoint)pointOnCircle:(int)thisPoint withTotalPointCount:(int)totalPoints {
CGPoint centerPoint = CGPointMake(self.view.frame.size.width / 2, self.view.frame.size.height / 2);
float radius = 100.0;
float angle = ( 2 * M_PI / (float)totalPoints ) * (float)thisPoint;
CGPoint newPoint;
newPoint.x = (centerPoint.x / 2) + (radius * cosf(angle));
newPoint.y = (centerPoint.y / 2) + (radius * sinf(angle));
return newPoint;
}
Thanks for the help!
The center of your buttons (i.e. points on the circle) is
newPoint.x = (centerPoint.x) + (radius * cosf(angle)); // <= removed / 2
newPoint.y = (centerPoint.y) + (radius * sinf(angle)); // <= removed / 2
Please note that if you place buttons (i.e. rectangles) on these points you have to make sure that their center lies at this point (i.e. subtract buttonWidth/2 from newPoint.x and buttonHeight/2 from newPoint.y to get the top left corner).
Not sure why you divide by 2 a second time newPoint coordinates...
What about this:
newPoint.x = centerPoint.x + (radius * cosf(angle));
newPoint.y = centerPoint.y + (radius * sinf(angle));
return newPoint;
I'd like the shadow applied correctly after rotation. This is my code:
myButton.transform = CGAffineTransformMakeRotation(M_PI / 180.0 * 90.0);
myButton.layer.shadowOffset = CGSizeMake(12.0, 12.0);
myButton.layer.shadowRadius = 2.0;
myButton.layer.shadowOpacity = 0.8;
myButton.layer.shadowColor = [UIColor blackColor].CGColor;
Without rotation the shadow looks fine:
But after rorating it by 90° the shadow is rotated as well:
Is there anything I can do about it without overriding the drawRect method and do low level drawing? Or maybe some method which corrects the shadowOffset with a given rotation angle? It's easy to correct the offset by hand for 90° so this is no option ;)
It should look like this:
Thanks in advance!
With help of Bartosz Ciechanowski this works now!
float angleInRadians = M_PI / 180.0 * -35.0;
myButton.transform = CGAffineTransformMakeRotation(angleInRadians);
myButton.layer.shadowOffset = [self correctedShadowOffsetForRotatedViewWithAngle:(angleInRadians)
andInitialShadowOffset:CGSizeMake(12.0, 12.0)];
myButton.layer.shadowRadius = 2.0;
myButton.layer.shadowOpacity = 0.8;
myButton.layer.shadowColor = [UIColor blackColor].CGColor;
This results in:
instead of
Assuming anAngle is in radians:
- (CGSize)correctedShadowOffsetForRotatedViewWithAngle:(CGFloat)anAngle
andInitialShadowOffset:(CGSize)anOffset
{
CGFloat x = anOffset.height*sinf(anAngle) + anOffset.width*cosf(anAngle);
CGFloat y = anOffset.height*cosf(anAngle) - anOffset.width*sinf(anAngle);
return CGSizeMake(x, y);
}
I think you could try using
myButton.layer.shadowOffset = CGSizeMake(-12.0, -12.0);
to
myButton.layer.shadowOffset = CGSizeMake(12.0, 12.0);
Just try using this, if it works.Either you need to set the shadow with Trial & Error method.
This is just a suggestion or a trick if could solve your problem.
following WWDC2010 Session 104 I just created a CATiledLayer within a UIScrollView for a 10000 x 8078 px image.
I am troubled with the frame & zoomScale when the view is first shows at its top level
like in session 104 I defined levelsOfDetail as 4
in my drawRect I call CGFloat lScale = CGContextGetCTM(lContext).a;
Strangely at runtime lScale is assigned 0.124907158, not 0.125 as expected.
As well the rect passed to drawRect has floatpoint values, such as
rect.origin.x = 4099.04443
rect.origin.y = 6144
rect.size.width = 2049.52222
rect.size.height = 2048
Most irritating for me is that the frame of the CATiledLayer shows an origin 0 x 26.93 even though I created the tiledImageView using initWithFrame using a 0x0 origin.
Any ideas where I can find the calculation that is responsible for this?
EDIT:
I found the source for the wierd frame position, which is the ScrollView bounds being incorrectly set at 450 px. that should be 420 px. The layoutSubview routine in the UIScrollView has a center view routine that inadvertently adjusted the y coordinate.
I found a cure to this.
The WWDC 2010 session 104 sample has two UIScrollView methods that control the view behaviour.
The first is configureForImageSize that I mentioned in my previously posted answer where the zoomscales are set.
Due to the explained float-point difference the imageView-bounds get generated with the decimals as highlighted before (see wx/hx or wy/hy).
To get clean this up I used the override of layoutSubviews where I calculate the view frame:
- (void) layoutSubviews {
[super layoutSubviews];
CGSize lBoundsSize = self.bounds.size;
CGRect lFrameToCenter = imageView.frame;
// cure to the decimals problem
lFrameToCenter.size.width = roundf(lFrameToCenter.size.width);
lFrameToCenter.size.height = roundf(lFrameToCenter.size.height);
if (lFrameToCenter.size.width < lBoundsSize.width)
lFrameToCenter.origin.x = (lBoundsSize.width - lFrameToCenter.size.width) / 2;
else
lFrameToCenter.origin.x = 0;
if (lFrameToCenter.size.height < lBoundsSize.height)
lFrameToCenter.origin.y = (lBoundsSize.height - lFrameToCenter.size.height) / 2;
else
lFrameToCenter.origin.y = 0;
imageView.frame = lFrameToCenter;
if ([imageView isKindOfClass:[tileView class]]) {
imageView.contentScaleFactor = 1.0;
}
}
Note that I round the frame size before doing anything else with it!
I got a little further in my bug analysis.
Having an mImageSize of 10000x8078 and 320x450 Bounds in the UIScrollView I used the configureForImageSize calculations from the session 104 example as follows:
- (void) configureForImageSize:(CGSize)mImageSize {
CGSize lBoundsSize = [self bounds].size;
// set up our content size and min/max zoomscale
CGFloat lXScale = lBoundsSize.width / mImageSize.width; // the scale needed to perfectly fit the image width-wise
CGFloat lYScale = lBoundsSize.height / mImageSize.height; // the scale needed to perfectly fit the image height-wise
// debug values
float wx = mImageSize.width * lXScale;
float wy = mImageSize.width * lYScale;
float hx = mImageSize.height * lXScale;
float hy = mImageSize.height * lYScale;
...
}
The debugger shows the following values:
* mImageSize = width 10000 height 8078
* bounds size: width 320 height 450
* lXScale = 0.0396137647
* lYScale = 0.0450000018
* wx = 320
* wy = 363.51001
* hx = 396.137634
* hy = 450.000031
so I gather the image size in relation to the bounds leads to a floatpoint calculation difference. When the CATiledLayer is generated the bounds are alway floatpoint values.
If that is the cause, how can I get a mathematical way out of this without having to resize the image (ugly thought)???
I am trying to change my Sprite anchor point so that I can rotate over a 0.0f,0.0f anchorpoint. At first my object is rotation at the default anchor point (0.5f,0.5f). However later on I need it to rotate over a 0.0,0.0 AnchorPoint.
The problem is I cannot change the anchor point and change the position accordingly, so it stays on the same position, without the object appearing to quickly move and reposition to its original point.
Is there a way I can set the anchor point and the position of my Sprite at once, without it moving at all?. Thank you.
-Oscar
I found a solution to this with a UIView elsewhere, and rewrote it for cocos2d:
- (void)setAnchorPoint:(CGPoint)anchorPoint forSprite:(CCSprite *)sprite
{
CGPoint newPoint = CGPointMake(sprite.contentSize.width * anchorPoint.x, sprite.contentSize.height * anchorPoint.y);
CGPoint oldPoint = CGPointMake(sprite.contentSize.width * sprite.anchorPoint.x, sprite.contentSize.height * sprite.anchorPoint.y);
newPoint = CGPointApplyAffineTransform(newPoint, [sprite nodeToWorldTransform]);
oldPoint = CGPointApplyAffineTransform(oldPoint, [sprite nodeToWorldTransform]);
CGPoint position = sprite.position;
position.x -= oldPoint.x;
position.x += newPoint.x;
position.y -= oldPoint.y;
position.y += newPoint.y;
sprite.position = position;
sprite.anchorPoint = anchorPoint;
}
This is a good question, and I don't know the full answer yet.
As you may have noticed, the anchorPoint cannot be changed without affecting scale and rotation.
For scaled sprites:
You have to simultaneously change the anchorPoint and position of your sprite. See this question for a hint
For rotated sprites:
Intuition says you would need to simultaneously change anchorPoint, rotation, and position. (I have no idea how to compute this.)
NOTE: I'm still learning graphics programming, so I'm not 100% able to compute this stuff yet.
I've needed this a couple of times and decided to make a extension for CCNode, tested it abit and seems to work fine. Can be really useful to some :)
It's tested with 1.x but It should work fine in 2.x too. Supports transformed nodes and HD.
Just add this to your project and import whenever you need it - It will be added to all classes deriving from CCNode. (CCSprite, CCLayer)
Interface
#import "cocos2d.h"
#interface CCNode (Extensions)
// Returns the parent coordinate for an anchorpoint. Useful for aligning nodes with different anchorpoints for instance
-(CGPoint)positionOfAnchorPoint:(CGPoint)anchor;
// As above but using anchorpoint in points rather than percentage
-(CGPoint)positionOfAnchorPointInPoints:(CGPoint)anchor;
//Sets the anchorpoint, to not move the node set lockPosition to `YES`. Setting it to `NO` is equal to setAnchorPoint, I thought this would be good for readability so you always know what you do when you move the anchorpoint
-(void)setAnchorPoint:(CGPoint)a lockPosition:(BOOL)lockPosition;
#end
Implementation
#import "CCNode+AnchorPos.h"
#implementation CCNode (Extensions)
-(CGPoint)positionOfAnchorPoint:(CGPoint)anchor
{
float x = anchor.x * self.contentSizeInPixels.width;
float y = anchor.y * self.contentSizeInPixels.height;
CGPoint pos = ccp(x,y);
pos = CGPointApplyAffineTransform(pos, [self nodeToParentTransform]);
return ccpMult(pos, 1/CC_CONTENT_SCALE_FACTOR());
}
-(CGPoint)positionOfAnchorPointInPoints:(CGPoint)anchor;
{
CGPoint anchorPointInPercent = ccp(anchor.x/self.contentSize.width, anchor.y/self.contentSize.height);
return [self positionOfAnchorPoint:anchorPointInPercent];
}
-(void)setAnchorPoint:(CGPoint)a lockPosition:(BOOL)lockPosition
{
CGPoint tempPos = [self positionOfAnchorPoint:a];
self.anchorPoint = a;
if(lockPosition)
{
self.position = tempPos;
}
}
#end
Cocos2d-x + Fixed scale
YourClass.h
virtual cocos2d::Vec2 positionFromSprite(cocos2d::Vec2 newAnchorPoint, cocos2d::Sprite *sprite);
YourClass.m
Vec2 YourClass::positionFromSprite(Vec2 newAnchorPoint, cocos2d::Sprite *sprite) {
Rect rect = sprite->getSpriteFrame()->getRect();
Vec2 oldAnchorPoint = sprite->getAnchorPoint();
float scaleX = sprite->getScaleX();
float scaleY = sprite->getScaleY();
Vec2 newPoint = Vec2(rect.size.width * newAnchorPoint.x * scaleX, rect.size.height * newAnchorPoint.y * scaleY);
Vec2 oldPoint = Vec2(rect.size.width * oldAnchorPoint.x * scaleX, rect.size.height * oldAnchorPoint.y * scaleY);
Vec2 position = sprite->getPosition();
position.x -= oldPoint.x;
position.x += newPoint.x;
position.y -= oldPoint.y;
position.y += newPoint.y;
return position;
}