EditText交互时按钮淡入动画重复触发问题求助

Hey there! Let's dig into why your send button's fade-in animation is playing twice and how to fix it.

Common Causes of the Double Animation #

The most likely culprits are:

• Uncancelled pending animations: If a partial fade-out (or any other in-progress animation) is still running when you trigger the fade-in, the two animations stack and create a "double play" effect.
• Multiple triggers of ShowSendButton(): Your TextWatcher might fire multiple times for a single text input (e.g., if you’re handling both onTextChanged and afterTextChanged), or other listeners (like focus changes) are calling the method repeatedly.
• Layout animation conflicts: Android’s default layout animations might kick in when you change the button’s visibility, overlapping with your custom alpha animation.

Step-by-Step Fixes #

1. Cancel Existing Animations Before Starting New Ones

Always cancel any ongoing animations on the button before starting a new one to prevent stacking. Update your methods like this:

private void ShowSendButton() { 
    if (sendbtn.Visibility != ViewStates.Visible) { 
        // Cancel any in-progress animation first
        sendbtn.Animate().Cancel();
        
        sendbtn.Visibility = ViewStates.Visible;
        sendbtn.Alpha = 0.0f; // Reset alpha to 0 for a clean fade-in start
        
        // Add a duration for consistent timing (adjust as needed)
        sendbtn.Animate().Alpha(1.0f).SetDuration(300); 
    } 
}

private void HideSendButton() { 
    if (sendbtn.Visibility != ViewStates.Gone) { 
        sendbtn.Animate().Cancel();
        
        sendbtn.Animate()
            .Alpha(0.0f)
            .SetDuration(300)
            // Only set visibility to GONE after the animation finishes
            .WithEndAction(() => {
                sendbtn.Visibility = ViewStates.Gone;
                sendbtn.Alpha = 1.0f; // Reset alpha for next use
            });
    } 
}

2. Clean Up Your TextWatcher Implementation

Make sure you only trigger the show/hide logic once per text change. Stick to afterTextChanged and avoid redundant calls:

editText.AddTextChangedListener(new TextWatcher {
    public void AfterTextChanged(IEditable s) {
        string input = s.ToString().Trim();
        if (!string.IsNullOrEmpty(input)) {
            ShowSendButton();
        } else {
            HideSendButton();
        }
    }

    // Leave these empty unless you specifically need them
    public void BeforeTextChanged(ICharSequence s, int start, int count, int after) {}
    public void OnTextChanged(ICharSequence s, int start, int before, int count) {}
});

3. Disable Layout Animations (If Needed)

If Android’s default layout animations are conflicting with your custom animation, disable them for the button’s parent layout:

Add this to your parent layout in XML:

android:animateLayoutChanges="false"

Or do it programmatically:

LayoutAnimationController layoutAnim = sendbtn.Parent.LayoutAnimation;
if (layoutAnim != null) {
    layoutAnim.SetDuration(0);
    ((ViewGroup)sendbtn.Parent).LayoutAnimation = layoutAnim;
}

Verify the Fix #

After applying these changes, test typing into the EditText—the fade-in should play only once, and the fade-out should cleanly hide the button without leftover animation artifacts.

内容的提问来源于stack exchange，提问作者Nicolás de Ory