how to rotate a view along x axis - android-animation

I want to rotate a view along its x axis.I tried to do the following:
AnimationSet anim=new AnimationSet(true);
RotateAnimation rotate=new RotateAnimation(0.0f,-10.0f,RotateAnimation.ABSOLUTE,0.5f,RotateAnimation.RELATIVE_TO_SELF,0.5f);
rotate.setFillAfter(true);
rotate.setDuration(5000);
rotate.setRepeatCount(0);
anim.addAnimation(rotate);
View relatv1=(View)findViewById(R.id.relativeLayout1);
relatv1.setAnimation(anim);
but i instead the view rotates along its y axis.How can i accomplish x axis rotation?

Use an ObjectAnimator like this:
ObjectAnimator animation = ObjectAnimator.ofFloat(view, "rotationX", 0.0f, 360f);
animation.setDuration(5000);
animation.setRepeatCount(ObjectAnimator.INFINITE);
animation.setInterpolator(new AccelerateDecelerateInterpolator());
animation.start();

The ObjectAnimator class does the rotation along the axis for the view that is passed as an argument to ofFloat method.
If you want to rotate the view only once don't set any repeat count.
The answer from "its-tomweber" is working perfectly.

Related

How rotate image respecting proportions

I would like to rotate long image representing hand of a clock.
I have following code:
val hand = Image(handBitmap).apply {
scaledHeight = 50.0
scaledWidth = 400.0
anchor(.0, 0.5)
addUpdater {
rotation = Angle.fromDegrees( rotation.degrees + 1)
}
}
I expected result like on this image:
but I got this:
What should I change to achieve a hand of clock like effect?
The code seems correct, and seems to work properly with the latest version of KorGE. Which version of KorGE are you using?
As discussed in discord:
The problem was that the anchor point is set to the left, center of the image, while the image itself has a gap:
By adjusting the anchor point (that is a ratio to something that fits the end of the arrow, should fix the issue)
In the case of this image an anchor of anchor(.09, 0.52) could work:
Note also that you can open the debugger by pressing F7 inside the window to actually see the bounds of the image, the anchor point, and the AABB bounds to debug this kind of issues.
Hope this was helpful!
The problem looked more like this:
o
|
o------- -------o
|
o
It occurs when I set scaledHeight and scaledWidth.
Finally setting scale(1.0) helped.

How to rotate an object from its center when using Object3d.lookAt()

I'm drawing texts and computing their bounding boxes. I always want the texts to show their face to the camera and so I'm using following lines:
textArr.forEach(function(text) {
var textGeo = d.geometry;
text.lookAt(camera.position)
})
It's working fine but it rotates from top left corner and I can't change the axis of rotation:
How can I make it rotate from center of the text while using .lookAt()?
Try center the pivot using
THREE.GeometryUtils.center(textGeo)

libGDX autoresizing image button

i want a list with image buttons to be displayed in my libGDX app.
The idea is that the image has a size of lets say 400x100 pixels.
I need the list to be able to display the images stretched to width of the screen - the height of the image should be resized to keep the aspect ratio.
But everytime i try to do this the image won't get resized properly.
The image is not stretched when smaller then screen width or the padding get's bad or the aspect ration gets wrong.
Could you suggest a way to do this, i'm struggling to find any solution..
The actor must be Button a button.. (need "checked"/selected functionality)
I tried to do something like this:
Table table = new Table();
table.setFillParent(true);
Texture t1 = ... snip ...
Texture t2 = ... snip ...
ImageButton i1 = new ImageButton( new TextureRegionDrawable(new TextureRegion(t1));
ImageButton i2 = new ImageButton( new TextureRegionDrawable(new TextureRegion(t2));
i1.getImageCell().expandX().fillX();
i2.getImageCell().expandX().fillX();
table.add(i1).expandX().fillX();
table.row();
table.add(i2).expandX().fillX();
getStage().add(table);
This worked for me:
imageButton.setBounds(x, y, 128, 128);
imageButton.getImageCell().expand().fill();
float screenWidth = this.stage.getWidth();
i2.setWidth(screenWidth);
If i understand correctly, this should do what you want.

How to use CGAffineTransformConcat properly, combine scale and rotate

I am creating view, then rotating them and flipping them. Seems to work to use CGAffineTransformConcat to combing the scales and rotation to get the result I expect, but I am running into some trouble.
Initially I set up a transform that flips the view vertically.
CGAffineTransform flipViewTrans;
viewFlipTrans = CGAffineTransformMakeScale(1, -1);
selectedView.transform = CGAffineTransformConcat(selectedView.transform, flipViewTrans);
When I rotate the view I concat the original flip transform and this seems to preserve this flip transform exactly as expected through the rotation.
-(IBAction)rotateView:(UISlider*)sender {
float angle = sender.value;
selectedView.rotation = angle;
[selectedView setTransform:CGAffineTransformMakeRotation(angle)];
selectedView.transform = CGAffineTransformConcat(selectedView.transform, flipViewTrans);
}
The view flips fine too.
-(IBAction)flipSickerH:(GradientButton*)sender {
viewFlipTrans = CGAffineTransformMakeScale(-1, 1);
selectedView.transform = CGAffineTransformConcat(selectedView.transform, viewFlipTrans);
}
The problem is when I rotate after doing the flip as above, the results do not come out as expected. The view flips in the opposite direction suddenly.
What is happening, I think, is that the concatenated transforms are reset, so the only transform is the rotation. So the concatenation in the rotate code is failing in this case maybe.
Any clues as to what I need to do?

THREE.js rotating camera around an object using orbit path

I am struggling in solving this problem.
On my scene, I have a camera which looks at the center of mass of an object. I have a some buttons that enable to set camera position on particular view (front view, back view,...) along a invisible sphere that surroung the object (constant radius).
When I click on the button, i would like the camera to move from its start position to the end position along the sphere surface. When camera moves I would like it to keep fixing center of mass of the object.
Has anyone have a clue on how to achieve this?
Thanks for help!
If you are happy/prefer to use basic trigonometry then in your initialisation section you could do this:
var cameraAngle = 0;
var orbitRange = 100;
var orbitSpeed = 2 * Math.PI/180;
var desiredAngle = 90 * Math.PI/180;
...
camera.position.set(orbitRange,0,0);
camera.lookAt(myObject.position);
Then in your render/animate section you could do this:
if (cameraAngle == desiredAngle) { orbitSpeed = 0; }
else {
cameraAngle += orbitSpeed;
camera.position.x = Math.cos(cameraAngle) * orbitRange;
camera.position.y = Math.sin(cameraAngle) * orbitRange;
}
Of course, your buttons would modify what the desiredAngle was (0°, 90°, 180° or 270° presumably), you need to rotate around the correct plane (I am rotating around the XY plane above), and you can play with the orbitRange and orbitSpeed until you hare happy.
You can also modify orbitSpeed as it moves along the orbit path, speeding up and slowing down at various cameraAngles for a smoother ride. This process is called 'tweening' and you could search on 'tween' or 'tweening' if you want to know more. I think Three.js has tweening support but have never looked into it.
Oh, also remember to set your camera's far property to be greater than orbitRadius or you will only see the front half of your object and, depending on what it is, that might look weird.