CODEWITHSUNDEEP
androidlistviewanimation
Krzysztof Majewski
Krzysztof Majewski

Reputation: 2534

Animation during onClick() on ListView item

When I click on one of my ListView elements a TextView shows up (or disappears) and backgroud color of four components in my element changes.

My problem is that it happens very quick. Is there a way I can make this more smooth? Like animation or something.

my OnCLickListener class:

private class TextViewOnClick implements TextView.OnClickListener {

    private TextView answerView;
    private TextView questionView;
    private Button tickButton;
    private Button crossButton;

    public TextViewOnClick(TextView answerView, TextView questionView, Button tick, Button cross) {
        this.answerView = answerView;
        this.questionView = questionView;
        this.tickButton = tick;
        this.crossButton = cross;
    }
    @Override
    public void onClick(View v) {
        if(answerView.getVisibility() == TextView.GONE) {
            answerView.setVisibility(TextView.VISIBLE);

            questionView.setBackgroundColor(Color.parseColor("#A6E7FF"));
            answerView.setBackgroundColor(Color.parseColor("#A6E7FF"));
            tickButton.setBackgroundColor(Color.parseColor("#A6E7FF"));
            crossButton.setBackgroundColor(Color.parseColor("#A6E7FF"));
        }
        else {
            answerView.setVisibility(TextView.GONE);

            questionView.setBackgroundColor(Color.parseColor("#FFFFFF"));
            answerView.setBackgroundColor(Color.parseColor("#FFFFFF"));
            tickButton.setBackgroundColor(Color.parseColor("#FFFFFF"));
            crossButton.setBackgroundColor(Color.parseColor("#FFFFFF"));
        }
    }
}

Upvotes: 0

Views: 1184

Answers (1)

Dale_Plante
Dale_Plante

Reputation: 934

While you cannot animate the color changing to be slower, you can change the view disappearing/appearing to be slower.

Look at the ViewPropertyAnimator class: http://developer.android.com/reference/android/view/ViewPropertyAnimator.html

You would use it kind of like this:

    if(answerView.getVisibility() == TextView.GONE) {
        answerView.setAlpha(0);
        answerView.setVisibility(TextView.VISIBLE);
        answerView.animate().alpha(1).setDuration(500).withEndAction(new Runnable(){
            @Override
            public void run(){
                 questionView.setBackgroundColor(Color.parseColor("#A6E7FF"));
                 answerView.setBackgroundColor(Color.parseColor("#A6E7FF"));
                 tickButton.setBackgroundColor(Color.parseColor("#A6E7FF"));
                 crossButton.setBackgroundColor(Color.parseColor("#A6E7FF"));
            }
        );
    }
    else { 
     ...//follow the template above
    }

What this does (step by step) is:

-sets the view to be visible, but with an alpha of 0. This makes the component visible to the app however not to the user.

-animates the view to make it visible to the user. alpha(1) means that this view will be completely opaque by the end of the animation, and setDuration(500) means the animation will take 500 ms (you can change this value of course).

-at the end of the animation, this uses withEndAction to change the color of your other views.

Upvotes: 1

Related Questions