以九补丁为背景展开视图动画答案

【问题标题】：Expanding animation on view with Nine-Patch as background以九补丁为背景展开视图动画
【发布时间】：2017-11-03 16:40:07
【问题描述】：

我正在尝试创建一个将View 从上到下展开的动画。

像这样：

我不能使用将pivotY 设置为0 的ScaleAnimation，因为这会像普通Bitmap 一样拉伸九补丁。我需要修改我的View 的高度。

我目前的解决方案：（test 是视图参考）

ValueAnimator anim = ValueAnimator.ofInt(test.getMeasuredHeight(), 800);
anim.setInterpolator(new FastOutSlowInInterpolator());
anim.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
    @Override
    public void onAnimationUpdate(ValueAnimator animation) {
        ViewGroup.LayoutParams params = test.getLayoutParams();
        params.height = (int) animation.getAnimatedValue();
        test.setLayoutParams(params);
    }
});
anim.setDuration(250).start();

这很好用，但它会将视图扩展到两侧：

有人知道制作这种动画的方法吗？ 感谢任何帮助。

【问题讨论】：

标签： android android-animation android-view

【解决方案1】：

一种解决方案是保留您的实现，但通过在上方放置一个不会让您的视图增长的元素将扩展限制在底部：

例子：

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <FrameLayout
         ...
         android:layout_height="100dp"/> //assuming your view starts 100dps from top

    <YourView
         ...
         .../>

 </LinearLayout>

由于您的容器是 LinearLayout 并且第一个 View(FrameLayout) 的高度为 100dp 并且高于您希望扩展的视图，因此它不会扩展其高度，因为它不能与同一层次结构的元素重叠，所以它会向下扩展

如果您通过将android:below="@id/framelayout_id" 添加到 YourView 来使用 RelativeLayout，它也可以工作，这也将保证 YourView 不会向上扩展

【讨论】：

谢谢！此解决方案也适用于 ConstraintLayout。
我很高兴它有帮助。如果它显然解决了您的问题，则将答案标记为正确

【解决方案2】：

添加一个额外的变量来保存 Y 轴上的初始位置。

展开顶部

 public void expandTop(final View test) {
        final float bottomAnchor = test.getY() + test.getHeight();
        final ValueAnimator anim = ValueAnimator.ofInt(test.getMeasuredHeight(), 800);

        anim.setInterpolator(new FastOutSlowInInterpolator());
        anim.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
            @Override
            public void onAnimationUpdate(ValueAnimator animation) {
                ViewGroup.LayoutParams params = test.getLayoutParams();
                params.height = (int) animation.getAnimatedValue();
                test.setY(bottomAnchor - (int) animation.getAnimatedValue());
                test.setLayoutParams(params);
            }
        });
        anim.setDuration(2500).start();
    }

展开底部

public void expandBottom(final View test) {
    final float topAnchor = test.getY();
    final ValueAnimator anim = ValueAnimator.ofInt(test.getMeasuredHeight(), 800);

    anim.setInterpolator(new FastOutSlowInInterpolator());
    anim.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
        @Override
        public void onAnimationUpdate(ValueAnimator animation) {
            ViewGroup.LayoutParams params = test.getLayoutParams();
            params.height = (int) animation.getAnimatedValue();
            test.setY(topAnchor);
            test.setLayoutParams(params);
        }
    });
    anim.setDuration(2500).start();
}

【讨论】：