Android图像相对于中心点的缩放动画

Posted 2023-02-16

【中文标题】Android图像相对于中心点的缩放动画

【英文标题】：Android image scale animation relative to center point

【发布时间】：2012-01-14 14:54:48

【问题描述】：

我有一个 ImageView，我对它做了一个简单的缩放动画。非常标准的代码。

我的 scale_up.xml：

<set xmlns:android="http://schemas.android.com/apk/res/android">
    <scale android:fromXScale="1"
           android:fromYScale="1"
           android:toXScale="1.2"
           android:toYScale="1.2"
           android:duration="175"/>
</set>

我的动画代码：

Animation a = AnimationUtils.loadAnimation(this, R.anim.scale_up);
((ImageView) findViewById(R.id.circle_image)).startAnimation(a);

问题：

当图像缩放时，它不是从中心缩放，而是从左上角缩放。换句话说，图像的缩放版本没有与中心相同的点，但它具有相同的左上角点。 Here's a link that explains what I mean.第一张图是动画的缩放方式，第二张图是我想要的缩放方式。它应该保持中心点相同。我尝试在图像、容器上设置重力，左右对齐，它总是缩放相同。 我在主屏幕使用RelativeLayout，ImageView位于另一个RelativeLayout中，但我尝试了其他布局，没有变化。

【参考方案1】：

50% 是动画视图的中心。

50%p 是父级的中心

<scale
    android:fromXScale="1.0"
    android:toXScale="1.2"
    android:fromYScale="1.0"
    android:toYScale="1.2"
    android:pivotX="50%"
    android:pivotY="50%"
    android:duration="175"/>

【讨论】：

对我来说 50% 完成了这项工作（没有 p）

如果它相对于你应用动画的组件宽度或高度，它应该没有 p。 p 指的是你应用动画的组件的父级。

如何在Java文件中使用50%p，而不是XML？

new ScaleAnimation(1.0f,1.2f,1.0f,1.2f,Animation.RELATIVE_TO_PARENT,0.5f, Animation.RELATIVE_TO_PARENT,0.5f);

还有"a" - Animation.ABSOLUTE 设置在px中。

【参考方案2】：

@stevanveltema 和@JiangQi 提供的答案是完美的，但如果你想使用代码进行扩展，那么你可以使用我的答案。

// first 0f, 1f mean scaling from X-axis to X-axis, meaning scaling from 0-100%
// first 0f, 1f mean scaling from Y-axis to Y-axis, meaning scaling from 0-100%
// The two 0.5f mean animation will start from 50% of X-axis & 50% of Y-axis, i.e. from center

ScaleAnimation fade_in =  new ScaleAnimation(0f, 1f, 0f, 1f, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
fade_in.setDuration(1000);     // animation duration in milliseconds
fade_in.setFillAfter(true);    // If fillAfter is true, the transformation that this animation performed will persist when it is finished.
view.startAnimation(fade_in);

【讨论】：

@T.Todua 什么错误？请提出一个新问题并链接回此答案。

如果我想要像 ``` android:repeatCount="infinite" android:repeatMode="reverse" ```

这样的动画无限重复怎么办？

【参考方案3】：

忘记额外的翻译，将android:pivotX、android:pivotY设置为宽度和高度的一半，它将从图像的中心缩放。

【讨论】：

pivotX 和 pivotY 应该设置为 viewportWidth 和 viewportHeight 的一半。

【参考方案4】：

您可以使用集合中的平移动画来抵消它。您可能需要调整 toXDelta 和 toYDelta 值以使其正确，以使图像保持居中。

<set xmlns:android="http://schemas.android.com/apk/res/android">
    <scale android:fromXScale="1"
        android:fromYScale="1"
        android:toXScale="1.2"
        android:toYScale="1.2"
        android:duration="175"/>
    <translate
        android:fromXDelta="0"
        android:fromYDelta="0"
        android:toXDelta="-20%"
        android:toYDelta="-20%"
        android:duration="175"/>
</set>