I have a UIView in the middle of the screen, 100x100 in this case, and it should function like a "target" guideline for the user.
When the user presses the Add button, a SCNBox should be added on the world at the exact same spot, with width / height / scale / distance / rotation corresponding the UIView's size and position on the screen.
This image may help understanding what I mean.
The UIView's size may vary, but it will always be rectangular and centered on the screen. The corresponding 3D model also may vary. In this case, a square UIView will map to a box, but later the same square UIView may be mapped into a cylinder with corresponding diameter (width) and height.
Any ideas how I can achieve something like this?
I've tried scrapping the UIView and placing the box as the placeholder, as a child of the sceneView.pointOfView, and later converting it's position / parent to the rootNode, with no luck.
Thank you!
Get the center position of the UIView in its parent view, and use the SCNRenderer’s unprojectPoint method to convert it to 3D coordinates in the scene, to get the position where the 3D pbject should be placed. You will have to implement some means to determine the z value.
Obviously the distance of the object will determine its size in screen but if you also want to scale the object you could use the inverse of the zoom level of your camera as the scale. With zoom level I mean your own means of zooming (e.g. moving the camera closer than a default distances would create smaller scale models). If the UIView changes in size, you could in addition or instead of the center point unproject all its corner points individually to 3D space, but it may just be easier to convert the scale of the uiview to the scale of the 3D node. For example, if you know the maximum size the UIView will be you can express a smaller view as a percentage of its max size and use the same percentage to scale the object.
You also mentioned the rotation of the object should correspond to the UIView. I assume that means you want the object to face the camera. For this you can apply a rotation to the object based on the .transform property of the pointOfView node.
Related
I programmed a simple 2d app/ game.I just noticed, that an isometric scene instead of the 2d one would look gorgeous . I did not use any SpriteKit, etc. , it's just a simple single-view-app.
Now I draw some nice isometric vectors of e.g. a petrol station, which I would love to use instead of the plain 2D-images. For sure I can just use them as an imageview. But my idea was that I may animate driving cars in straight ways, so that they seem to be 3D (isometric), but are just images moving along a given path. What is the best way to do this? Can I use my isometric image as a Gamescene (never used)?
Greetings!
If you’ve been doing without SpriteKit so far, I don’t see any need to use it now. Keep them as UIImageViews, and animate their positions normally, just make sure that the point you move them to makes sense, so as not to break the illusion.
You can open up your image in Preview, click and drag along it’s direction to make a rectangular selection along that direction, and use the width and height of that box to make a ratio, like 20:25, which then simplifies to 4:5. Meaning for every 4 points it moves along x-axis, it should move 5 points along y-axis. Then store this ratio as a CGPoint somewhere in your code, note that all your isometric images should give you this same ratio.
Then you could make an abstraction that moves an imageview x points along its direction, using that ratio. Say you want to move it 100 points along its direction, and say the ratio is 4:5. The ratio is a triangle of width 4, height 5. You use a^2=b^2+c^2 to calculate the hypotenuse of that triangle. Then find a k such that ck=100. Then multiply a and b by that k to give you your delta x and delta y. Apply those deltas to its current position and you have the final position to animate to, which will be 100 points along its direction.
I am currently trying to map textures using image labels onto 2 different triangles (because im using right angle wedges so i need 2 to make scalene triangles), but here is the problem, I can only set positional, size, and rotational data so I need to figure out how I can use this information to correctly map the texture onto the triangle
the position is based on the topleft corner and size of triangle (<1,1> corner is at the bottom right and <0,0> corner is at top left) and the size is based on triangle size also (<1,1> is same size as triangle and <0,0> is infinitely tiny) and rotation is central based.
I have the UV coordinates (given 0-1) and face vertices, all from an obj file. The triangles in 3D are made up of 2 wedges which are split at a right angle from the longest surface and from the opposite angle.
I don't quite understand this however it may be help to change the canvas properties on the Surface GUI
I need to draw vectors on the map and they must not scale when zooming (visible size should not vary). Placing them at lat/lng is easy but how can I avoid scaling with zoom, is there an example for Openlayers 3 ? Images would also suffice but I am not sure about performance as I need to rotate many.
I did not really need a vector so went for an icon + rotation.
I changed the title accordingly...
ol.style.Icon does the job as I can set the rotation and it will not scale with the zoom.
Example: http://openlayers.org/en/master/examples/icon.html
I have a UILabel on which I perform a CGAffineTransformConcat to tilt the text for some degrees. Instruments CA analysis tells me that the view has misaligned pixels now (leave out the transformation and the label is fine).
I wonder if there is any way to get rid of the misaligned pixels in this label or if that would be not possible since the transformation causes fractional values in the coordinates anyway.
I did a CGRectIntegral call on the frame which has fractional values but for some reason the view is still misaligned.
When a layer is rotated by an angle that is not a multiple of 90° it cannot be pixel-aligned.
If you want to present tilted text and nevertheless need aligned pixels the only way is to draw the layer (view) yourself. You would align the layer and instead do the rotation using Quartz.
Note after edit: You cannot use the frame when a transform is set:
Warning If the transform property is not the identity transform, the
value of this property is undefined and therefore should be ignored.
I have a texture with 250px width and 2000px height. 250x250 part of it drawn on screen according to various conditions (some kind of sprite sheet, yes). All I want is to draw it within a fixed destination rectangle with some rotation. Is it possible?
Yes. Here's how to effectively rotate your destination rectangle:
Take a look at the overloads for SpriteBatch.Draw.
Notice that none of the overloads that take a Rectangle as a destination take a rotation parameter. It's because such a thing does not make much sense. It's ambiguous as to how you want the destination rotated.
But you can achieve the same effect as setting a destination rectangle by careful use of the position and scale parameters. Combine these with the origin (centroid of scaling and rotation, specified in pixels in relation to your sourceRectangle) and rotation parameters to achieve the effect you want.
(If, on the other hand, you want to "fit" to a rectangle - effectively scaling after rotating - you would have to also use the transformMatrix parameter to Begin.)
Now - your question isn't quite clear on this point: But if the effect you are after is more like rotating your source rectangle, this is not something you can achieve with plain ol' SpriteBatch.
The quick-and-dirty way to achieve this is to set a viewport that acts as your destination rectangle. Then draw your rotated sprite within it. Note that SpriteBatch's coordinate system is based on the viewport, not the screen.
The "nicer" (but much harder to implement) way to do it would be to not use SpriteBatch at all, but implement your own sprite drawing that will allow you to rotate the texture coordinates.