如何使 Android 中的偏心旋转动画在纵向和横向上看起来相似?

发布于 2024-12-29 21:35:54 字数 4071 浏览 0 评论 0原文

我的屏幕上有一些图像,其中一张有一个简洁的动画,纵向看起来很棒。

令人惊叹的纵向动画 -rotate_anim_port.png - 此处

横向动画看起来并不那么出色。

横向动画 -rotate_anim_land.png -在上面。

我以这种方式实现偏心旋转动画,因为我有几个具有相同大小的可绘制资源的图像视图堆叠在一起在框架视图中,以使它们全部位于相对相同的位置,但能够缩放到框架视图的任何大小。

它看起来很糟糕,因为 RotateAnimation(fromDegrees, toDegrees,pivotXType,pivotXValue,pivotYType,pivotYValue) 所基于的视图与视图内的图像大小不同。在纵向模式下,图像的大小实际上与视图相同,但在横向模式下,差异很明显。

我一直在尝试但未能从视图和其中绘制的图像中获取位置,以用于计算正确的枢轴值以在代码中传递。

这是活动的代码:

package com.namespace;

import android.app.Activity;
import android.os.Bundle;
import android.os.Handler;
import android.view.animation.Animation;
import android.view.animation.LinearInterpolator;
import android.view.animation.RotateAnimation;
import android.widget.ImageView;

public class AnimationDemoActivity extends Activity {

// piviotValues if the view is the exact size of the drawable.
final float pivotXType = 0.3280274656679151f;
final float pivotYValue = 0.5060137457044674f;

private Handler mHandler = new Handler();
ImageView outside, inside;
RotateAnimation anim, anim2;

/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    outside = (ImageView) findViewById(R.id.imageView1);
    inside = (ImageView) findViewById(R.id.imageView2);

    outside.setVisibility(ImageView.INVISIBLE);
    inside.setVisibility(ImageView.INVISIBLE);

    // somewhere in here, code to recalculate pivotValues to adjust for the
    // size of the actual view the images are inside of

    anim = new RotateAnimation(0, 359, Animation.RELATIVE_TO_SELF,
            pivotXType, Animation.RELATIVE_TO_SELF, pivotYValue);
    anim.setInterpolator(new LinearInterpolator());
    anim.setRepeatCount(Animation.INFINITE);
    anim.setDuration(2000);

    anim2 = new RotateAnimation(0, 359, Animation.RELATIVE_TO_SELF,
            pivotXType, Animation.RELATIVE_TO_SELF, pivotYValue);
    anim2.setInterpolator(new LinearInterpolator());
    anim2.setRepeatCount(Animation.INFINITE);
    anim2.setDuration(750);

    mHandler.postDelayed(doRotation, 2500);
}

private Runnable doRotation = new Runnable() {
    public void run() {
        outside.setVisibility(ImageView.VISIBLE);
        inside.setVisibility(ImageView.VISIBLE);
        outside.startAnimation(anim);
        inside.startAnimation(anim2);
    }
};
}

这是布局:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#ffffff"
android:orientation="vertical"
android:padding="10sp" >

<ImageSwitcher
    android:id="@+id/imageSwitcher1"
    android:layout_width="fill_parent"
    android:layout_height="0dip"
    android:layout_weight="1"
    android:gravity="center" >
</ImageSwitcher>

<ImageSwitcher
    android:id="@+id/imageSwitcher2"
    android:layout_width="fill_parent"
    android:layout_height="0dip"
    android:layout_weight="1"
    android:gravity="center" >
</ImageSwitcher>

<FrameLayout
    android:layout_width="fill_parent"
    android:layout_height="0dip"
    android:layout_weight="1"
    android:gravity="center" >

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/dwdg_outside_arrow" >
    </ImageView>

    <ImageView
        android:id="@+id/imageView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/dwdg_inside_arrow" >
    </ImageView>
</FrameLayout>

</LinearLayout>

这里 是可运行的 apk - AnimationDemo.apk和压缩项目 - AnimationDemo.zip

我这样做是不是疯了?我是否完全忽略了某些事情?做什么?

I have a screen that has a few images and one of them has a neat animation on it that looks awesome in portrait.

Awesome animation in portrait - rotate_anim_port.png - in HERE

It does not look so awesome in landscape.

Animation in landscape - rotate_anim_land.png - in above.

I am implementing the off-center rotation animation in this way because I have several imageviews with drawable resources of the same size stacked together in a frameview to keep them all in relatively the same spot, but able to scale to whatever size the frameview is.

It looks bad because the view in which the RotateAnimation(fromDegrees, toDegrees, pivotXType, pivotXValue, pivotYType, pivotYValue) is basing its pivotValues off of is not the same size as the image inside the view. When in portrait, the image is virtually the same size as the view, but in landscape the difference is apparent.

I have been trying and failing to get the positions from both the view and the drawn image inside of it to use to math up the proper pivotValues to pass in code.

Here is the code for the activity:

package com.namespace;

import android.app.Activity;
import android.os.Bundle;
import android.os.Handler;
import android.view.animation.Animation;
import android.view.animation.LinearInterpolator;
import android.view.animation.RotateAnimation;
import android.widget.ImageView;

public class AnimationDemoActivity extends Activity {

// piviotValues if the view is the exact size of the drawable.
final float pivotXType = 0.3280274656679151f;
final float pivotYValue = 0.5060137457044674f;

private Handler mHandler = new Handler();
ImageView outside, inside;
RotateAnimation anim, anim2;

/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    outside = (ImageView) findViewById(R.id.imageView1);
    inside = (ImageView) findViewById(R.id.imageView2);

    outside.setVisibility(ImageView.INVISIBLE);
    inside.setVisibility(ImageView.INVISIBLE);

    // somewhere in here, code to recalculate pivotValues to adjust for the
    // size of the actual view the images are inside of

    anim = new RotateAnimation(0, 359, Animation.RELATIVE_TO_SELF,
            pivotXType, Animation.RELATIVE_TO_SELF, pivotYValue);
    anim.setInterpolator(new LinearInterpolator());
    anim.setRepeatCount(Animation.INFINITE);
    anim.setDuration(2000);

    anim2 = new RotateAnimation(0, 359, Animation.RELATIVE_TO_SELF,
            pivotXType, Animation.RELATIVE_TO_SELF, pivotYValue);
    anim2.setInterpolator(new LinearInterpolator());
    anim2.setRepeatCount(Animation.INFINITE);
    anim2.setDuration(750);

    mHandler.postDelayed(doRotation, 2500);
}

private Runnable doRotation = new Runnable() {
    public void run() {
        outside.setVisibility(ImageView.VISIBLE);
        inside.setVisibility(ImageView.VISIBLE);
        outside.startAnimation(anim);
        inside.startAnimation(anim2);
    }
};
}

and here is the layout:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#ffffff"
android:orientation="vertical"
android:padding="10sp" >

<ImageSwitcher
    android:id="@+id/imageSwitcher1"
    android:layout_width="fill_parent"
    android:layout_height="0dip"
    android:layout_weight="1"
    android:gravity="center" >
</ImageSwitcher>

<ImageSwitcher
    android:id="@+id/imageSwitcher2"
    android:layout_width="fill_parent"
    android:layout_height="0dip"
    android:layout_weight="1"
    android:gravity="center" >
</ImageSwitcher>

<FrameLayout
    android:layout_width="fill_parent"
    android:layout_height="0dip"
    android:layout_weight="1"
    android:gravity="center" >

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/dwdg_outside_arrow" >
    </ImageView>

    <ImageView
        android:id="@+id/imageView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/dwdg_inside_arrow" >
    </ImageView>
</FrameLayout>

</LinearLayout>

Here is runnable apk - AnimationDemo.apk and zipped project - AnimationDemo.zip

Am I crazy for doing it this way? Am I totally overlooking something? What do?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

孤者何惧 2025-01-05 21:35:54

我已经弄清楚了。当然,这是一行修复。在 ImageView 中添加属性 android:adjustViewBounds="true" 可以使视图缩小到可绘制资源的大小,并使动画正常工作。

I have it figured out. Of course, it was a one line fix. Adding the attribute android:adjustViewBounds="true" to the ImageViews makes the view shrink to the size of the drawable resource and make the animation work properly.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文