please I need help with positioning of the mapicon below the mapcontrol.center point like this screenshot here http://www.windowsphone.com/en-us/store/app/sygic-gps-navigation-maps-poi-route-directions/340f7b71-86bc-4f99-8c59-d4a6126c10b1
Use NormalizedAnchorPoint property of the MapIcon class. It takes a Point, with x and y ranging from 0 to 1.
Based on your screenshot (3rd one), you should use a value of (0.5, 1).
MapIcon icon = new MapIcon();
icon.NormalizedAnchorPoint = new Point(0.5, 1);
I choose a different option by using 'RenderTransform' which enable me to extend the 'MapControl' below the bottom of the page and thereby moving the 'MapIcon' and MapControl center closer to the bottom of the page just as i wanted. Its not clean but it worked.
Related
I'd like to be able change the padding of a GMSMapView without changing the location of a map. Right now, Google Maps iOS SDK changes the map location so that the same point is in center after the padding has been applied. This is different than how the Android SDK works, which just leaves the map as it is.
I've found a slight workaround for this, but it doesn't work consistently. I can calculate what the new center location should be and update the map camera when I change the padding with the following...
UIEdgeInsets oldPadding = self.mapCtrl.map.padding;
UIEdgeInsets newPadding = UIEdgeInsetsMake(top, left, bottom, right);
float deltaX = ((newPadding.right - newPadding.left)/2 - (oldPadding.right-oldPadding.left)/2);
float deltaY = ((newPadding.top - newPadding.bottom)/2 - (oldPadding.top-oldPadding.bottom)/2);
GMSCameraUpdate *updatedCamera = [GMSCameraUpdate scrollByX:deltaX Y:deltaY];
[self.mapCtrl.map setPadding:newPadding];
[self.mapCtrl.map moveCamera:updatedCamera];
But I'd say it only works 50%. The other 50% the map moves to the new padding location and then back to where I want it to be.
I see two possible solutions for this... A) change the padding in a different way so that it doesn't move the map, or B) figure out a way to get the above code to work by somehow pausing or grouping map movements so that both calls only go through at once. But I can't figure out how to make either of those two things happen.
Make sure you have the same padding on top and bottom so everything keeps centered.
In case someone needs it in the future:
mapView.padding = newPadding
mapView.layer.removeAllAnimations()
That messes with the internals of GMSMapView though and the padding isn't applied to the map itself correctly, just to the UI.
I use the following code to re-apply the padding again after my animation so that the map behaves correctly again.
let newCenter = mapView.projection.coordinate(for: mapView.bounds.inset(by: newMapViewPadding).center)
mapView.padding = newMapViewPadding + UIEdgeInsets(all: 1)
mapView.padding = newMapViewPadding
mapView.moveCamera(GMSCameraUpdate.setTarget(newCenter))
It's correct that we need to set a padding with top AND bottom to keep things appearing correctly, but it's also important to do it AFTER attaching the view to it's parent.
I was doing it before and it did not work properly.
I have a sprite with having an action through which, it moves towards right side.
CCSprite *spaceShip1=CCSprite::create("ufo_1.png");
spaceShip1->setPosition(ccp(visibleSize.width/8,visibleSize.height/2));
this->addChild(spaceShip1, 3);
CCMoveBy* moveleft1 = CCMoveBy::create(3, ccp(visibleSize.width, 0));
spaceShip1->runAction(moveleft1);
I want to get the current visual position of sprite, as it is moving due to runAction, it should return its updated position.
I am using:
spaceShip1->getPosition();
and this position is utilizing here:
CCParticleSystemQuad* _spaceShip1 = new CCParticleSystemQuad();
_spaceShip1 = CCParticleSystemQuad::create("growingFlare.plist");
_spaceShip1->setPosition(spaceShip1->getPosition());
_spaceShip1->setAngle(180);
_spaceShip1->setScale(5);
_spaceShip1->stopSystem();
this->addChild(_spaceShip1, 4);
That particle effect must take place at the current position of spaceship, but it always took effect at initial position of spaceship.
I'm trying to get the current position of sprite. but it always returns the initial position instead of its current moving position.
What I have to do to get its current position?
float xPos = spaceShip->getPositionX();
float yPos = spaceShip->getPositionY();
CCLog("%f %f", xPos, yPos);
Try this in the method where you want to get the current x,y position of the moving sprite. It won't get the initial position what you get now.
That particle initialization happens during init(). Animation is not live then, hence will always give initial position.
You have 2 options.
In your update method. SetPosition() of your particle system every frame to the updated spaceship getPostion.
Make particle system as a child of spaceship.
In case of, "this->addChild()", do "_firstSpaceShip->addChild(_particleSystem)" and give it a initial x position like -10, so it always follow behind your spaceship.
May be this will help you out
CCParticleSystemQuad* _spaceShip1 = new CCParticleSystemQuad();
_spaceShip1 = CCParticleSystemQuad::create("growingFlare.plist");
_spaceShip1->setPosition(spaceShip1->getPositionX(), spaceShip1->getPositionY());
Using the first photo below, let's say:
The red outline is the stage bounds
The gray box is a Sprite on the stage.
The green box is a child of the gray box and has a rotation set.
both display object are anchored at the top-left corner (0,0).
I'd like to rotate, scale, and position the gray box, so the green box fills the stage bounds (the green box and stage have the same aspect ratio).
I can negate the rotation easily enough
parent.rotation = -child.rotation
But the scale and position are proving tricky (because of the rotation). I could use some assistance with the Math involved to calculate the scale and position.
This is what I had tried but didn't produce the results I expected:
gray.scaleX = stage.stageWidth / green.width;
gray.scaleY = gray.scaleX;
gray.x = -green.x;
gray.y = -green.y;
gray.rotation = -green.rotation;
I'm not terribly experienced with Transformation matrices but assume I will need to go that route.
Here is an .fla sample what I'm working with:
SampleFile
You can use this answer: https://stackoverflow.com/a/15789937/1627055 to get some basics. First, you are in need to rotate around the top left corner of the green rectangle, so you use green.x and green.y as center point coordinates. But in between you also need to scale the gray rectangle so that the green rectangle's dimensions get equal to stage. With uniform scaling you don't have to worry about distortion, because if a gray rectangle is scaled uniformly, then a green rectangle will remain a rectangle. If the green rectangle's aspect ratio will be different than what you want it to be, you'd better scale the green rectangle prior to performing this trick. So, you need to first transpose the matrix to offset the center point, then you need to add rotation and scale, then you need to transpose it away. Try this set of code:
var green:Sprite; // your green rect. The code is executed within gray rect
var gr:Number=green.rotation*Math.PI/180; // radians
var gs:Number=stage.stageWidth/green.width; // get scale ratio
var alreadyTurned:Boolean; // if we have already applied the rotation+scale
function turn():void {
if (alreadyTurned) return;
var mat:flash.geom.Matrix=this.transform.matrix;
mat.scale(gs,gs);
mat.translate(-gs*green.x,-gs*green.y);
mat.rotate(-1*gr);
this.transform.matrix=mat;
alreadyTurned=true;
}
Sorry, didn't have time to test, so errors might exist. If yes, try swapping scale, translate and rotate, you pretty much need this set of operations to make it work.
For posterity, here is what I ended up using. I create a sprite/movieClip inside the child (green) box and gave it an instance name of "innerObj" (making it the actually content).
var tmpRectangle:Rectangle = new Rectangle(greenChild.x, greenChild.y, greenChild.innerObj.width * greenChild.scaleX, greenChild.innerObj.height * greenChild.scaleY);
//temporary reset
grayParent.transform.matrix = new Matrix();
var gs:Number=stage.stageHeight/(tmpRectangle.height); // get scale ratio
var mat:Matrix=grayParent.transform.matrix;
mat.scale(gs,gs);
mat.translate(-gs * tmpRectangle.x, -gs * tmpRectangle.y);
mat.rotate( -greenChild.rotation * Math.PI / 180);
grayParent.transform.matrix = mat;
If the registration point of the green box is at one of it's corners (let's say top left), and in order to be displayed this way it has a rotation increased, then the solution is very simple: apply this rotation with negative sign to the parent (if it's 56, add -56 to parent's). This way the child will be with rotation 0 and parent -> -56;
But if there is no rotation applied to the green box, there is almost no solution to your problem, because of wrong registration point. There is no true way to actually determine if the box is somehow rotated or not. And this is why - imagine you have rotated the green box at 90 degrees, but changed it's registration point and thus it has no property for rotation. How could the script understand that this is not it's normal position, but it's flipped? Even if you get the bounds, you will see that it's a regular rectangle, but nobody know which side is it's regular positioned one.
So the short answer is - make the registration point properly, and use rotation in order to display it like in the first image. Then add negative rotation to the parent, and its all good :)
Edit:
I'm uploading an image so I can explain my idea better:
As you can see, I've created a green object inside the grey one, and the graphics INSIDE are rotated. The green object itself, has rotation of 0, and origin point - top left.
#Vesper - I don't think that the matrix will fix anything in this situation (remember that the green object has rotation of 0).
Otherwise I agree, that the matrix will do a pretty job, but there are many ways to do it :)
I want to move a display object from one container to another, but have it appear in the same place on screen.
I thought I'd understood this years ago, but the following does not work:
function moveToNewContainer(obj:DisplayObject, newParent:DisplayObjectContainer):void {
var pos:Point = new Point(obj.x, obj.y);
var currentParent:DisplayObjectContainer = obj.parent;
pos = currentParent.localToGlobal(pos);
currentParent.removeChild(obj);
newParent.addChild(obj);
pos = newParent.globalToLocal(pos);
obj.x = pos.x;
obj.y = pos.y;
}
This doesn't position the object in the same place as I would have expected.
Does anyone know what I am doing wrong, please?
Thanks,
James
Using localToGlobal/globalToLocal and setting the x and y properties like you showed calculates the correct position for the object in its new parent, but does not adjust for other aspects of the transformation such as scaling or rotation. In other words, the object's registration point will indeed remain in the same place, but the object may be rotated, scaled, or sheared differently.
The solution to your problem will need to take into account the transform.concatenatedMatrix properties of the old and new parents--you'll need to multiply the object's transformation matrix by one and then by the inverse of the other, or something along those lines. Leave a comment if you need help working out the math.
There is nothing wrong with your code, provided that both containers have no transformations applied. If your clips are scaled, rotated, etc.. you need to handle that in addition to the coordinate space transformations that localToGlobal and globalToLocal do.
You have to check if your containers are actually placed on stage. If your new container isn't added as a child to stage, function globalToLocal fails, just because it doesnt know how to correctly calculate that data.
I'm using a flip mechanism to navigate through my site (flip file & demo). The problem is, once it's flipped the content been displayed good just like I want it, but there's some offset from the flipped (right) parts en the solid left part (visible when you look closely). Also the right part is now a little blurred (which is the disturbing part of my issue). This all caused by the flip (I think the rotationY is causing the problem).
When I click a button I do the following:
flip=new Flip(currentPage,nextPage,richting);
content.addChild(flip);
currentPage=nextPage;
nextPage = new MovieClip();
there is a fix for it, consider the following:
// store original matrix
var origMatrix:Matrix = box.transform.matrix;
// set initial position
box.rotationY = -180;
// start animation
TweenLite.to(box, 1, {rotationY:0, onComplete:cleanBlur})
// execute after animation complete
function cleanBlur():void {
box.transform.matrix = origMatrix;
}
maybe you can find better results using other 3d library.
EDIT: sorry the "box" object, I was testing in flash, but box would be any of your pages to flip. Just apply the same logic.
Matteo at Flash & Math has an excellent solution for this. He actually found that when you bring an object into native 3D space it expands the object by one pixel in both the width and height. This can be counteracted by scaling your object back and then setting it's z to 0 which will scale it back up. Now the object is ready to play with without the blur.
http://www.flashandmath.com/flashcs4/blursol/index.html
adding: This fixes the scale issue, but not the blurriness. You will still need to use the matrix transformation fix posted above.