Android实现View从底部向上滑入显示的自定义动画方案

Hey there! I get exactly what you're aiming for—you want a view to slide up from the bottom of its container and appear, which is the direct reverse of a typical "slide down" disappear animation. The default slide_up animations usually make views slide upward and vanish, so let's fix that with the right approach.

Why Your Initial Idea Didn't Work #

When you tried translating from 0 to -100%, that moves the view upward from its current position (off-screen), which is the "slide out" behavior you don't want. Instead, we need to start the view off-screen below its container and slide it up into its target position.

Solution 1: XML Animation (Traditional Approach) #

Create an animation resource file that starts the view at the bottom of its parent container and slides it up to its intended position, plus a fade-in for smoother visual flow:

1. Create res/anim/slide_up_in.xml:

<set xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- Slide from bottom of parent container to target position -->
    <translate
        android:duration="300"
        android:fromYDelta="100%p"
        android:toYDelta="0" />
    <!-- Fade in as the view slides up -->
    <alpha
        android:duration="300"
        android:fromAlpha="0.0"
        android:toAlpha="1.0" />
</set>

• 100%p refers to 100% of the parent container's height, so the view starts fully hidden below the container.
• You can add android:fillAfter="true" to the <set> tag if you want the animation's final state to persist without extra code.

2. Use the animation in your code:

View targetView = findViewById(R.id.your_target_view);
// Ensure the view is invisible initially (use GONE to avoid layout space)
targetView.setVisibility(View.VISIBLE); // Switch to visible right before animating
Animation slideUpAnim = AnimationUtils.loadAnimation(this, R.anim.slide_up_in);
targetView.startAnimation(slideUpAnim);

Solution 2: Property Animation (Modern & Flexible) #

Property animations are better for modern apps because they modify the view's actual layout properties (so clickable areas move with the view, unlike traditional XML animations). Here's how to implement it:

View targetView = findViewById(R.id.your_target_view);
targetView.setVisibility(View.VISIBLE);

// Calculate starting position: bottom edge of the parent container
ViewGroup parentContainer = (ViewGroup) targetView.getParent();
float startPositionY = parentContainer.getHeight();
float endPositionY = 0f; // View's intended layout position

// Create and start the translation animation
ObjectAnimator slideAnimator = ObjectAnimator.ofFloat(targetView, "translationY", startPositionY, endPositionY);
slideAnimator.setDuration(300);
slideAnimator.start();

• If you want the view to slide up from its own height (instead of the parent's full height), replace parentContainer.getHeight() with targetView.getHeight().

Key Tips #

• Initial Visibility: Set the view to View.GONE in your layout or initial code so it doesn't take up space before animating. Switch to View.VISIBLE right before starting the animation.
• Animation Speed: Adjust the 300 duration value to make the animation faster or slower as needed.
• Layout Tweaks: If using a constraint-based layout like ConstraintLayout, tweak the starting position calculation to match your specific layout constraints.

内容的提问来源于stack exchange，提问作者Kraken