Animate while setBackgroundColor in android

Question

I'm working on a custom stepper. Everything is working fine.

What I want to do now is animate the stepper while filling the current step.

this Image shows my idea:

This is my code while setting the color of the line, title, and the icon src:

private void DrawStepper(int position) {
    switch (position) {

        case 0:
            imgStepShipper.setImageResource(R.drawable.ic_current_step);
            txtStepShipper.setTextColor(getResources().getColor(R.color.colorPrimary));
            line.setBackgroundColor(getResources().getColor(R.color.colorDarkWhite));

            imgStepConsignee.setImageResource(R.drawable.ic_unselected_step);
            txtStepConsignee.setTextColor(getResources().getColor(R.color.colorDarkSuperWhite));
            line2.setBackgroundColor(getResources().getColor(R.color.colorDarkWhite));

            imgStepShipment.setImageResource(R.drawable.ic_unselected_step);
            txtStepShipment.setTextColor(getResources().getColor(R.color.colorDarkSuperWhite));
            line3.setBackgroundColor(getResources().getColor(R.color.colorDarkWhite));

            imgStepCharges.setImageResource(R.drawable.ic_unselected_step);
            txtStepCharges.setTextColor(getResources().getColor(R.color.colorDarkSuperWhite));

            break;

        case 1:
            imgStepShipper.setImageResource(R.drawable.ic_done_step);
            txtStepShipper.setTextColor(getResources().getColor(R.color.colorPrimary));
            line.setBackgroundColor(getResources().getColor(R.color.colorPrimary));

            imgStepConsignee.setImageResource(R.drawable.ic_current_step);
            txtStepConsignee.setTextColor(getResources().getColor(R.color.colorPrimary));
            line2.setBackgroundColor(getResources().getColor(R.color.colorDarkWhite));

            imgStepShipment.setImageResource(R.drawable.ic_unselected_step);
            txtStepShipment.setTextColor(getResources().getColor(R.color.colorDarkSuperWhite));
            line3.setBackgroundColor(getResources().getColor(R.color.colorDarkWhite));

            imgStepCharges.setImageResource(R.drawable.ic_unselected_step);
            txtStepCharges.setTextColor(getResources().getColor(R.color.colorDarkSuperWhite));

            break;

        case 2:
            imgStepShipper.setImageResource(R.drawable.ic_done_step);
            txtStepShipper.setTextColor(getResources().getColor(R.color.colorPrimary));
            line.setBackgroundColor(getResources().getColor(R.color.colorPrimary));

            imgStepConsignee.setImageResource(R.drawable.ic_done_step);
            txtStepConsignee.setTextColor(getResources().getColor(R.color.colorPrimary));
            line2.setBackgroundColor(getResources().getColor(R.color.colorPrimary));

            imgStepShipment.setImageResource(R.drawable.ic_current_step);
            txtStepShipment.setTextColor(getResources().getColor(R.color.colorPrimary));
            line3.setBackgroundColor(getResources().getColor(R.color.colorDarkWhite));

            imgStepCharges.setImageResource(R.drawable.ic_unselected_step);
            txtStepCharges.setTextColor(getResources().getColor(R.color.colorDarkSuperWhite));

            break;

        case 3:
            imgStepShipper.setImageResource(R.drawable.ic_done_step);
            txtStepShipper.setTextColor(getResources().getColor(R.color.colorPrimary));
            line.setBackgroundColor(getResources().getColor(R.color.colorPrimary));

            imgStepConsignee.setImageResource(R.drawable.ic_done_step);
            txtStepConsignee.setTextColor(getResources().getColor(R.color.colorPrimary));
            line2.setBackgroundColor(getResources().getColor(R.color.colorPrimary));

            imgStepShipment.setImageResource(R.drawable.ic_done_step);
            txtStepShipment.setTextColor(getResources().getColor(R.color.colorPrimary));
            line3.setBackgroundColor(getResources().getColor(R.color.colorPrimary));

            imgStepCharges.setImageResource(R.drawable.ic_current_step);
            txtStepCharges.setTextColor(getResources().getColor(R.color.colorPrimary));
            break;
    }
}

Position is the current step.

and this is my UI:

As I said, I want to animate the line each time a move from step to another.

Thank you :)

Maksym V. · Accepted Answer · 2018-04-05T08:19:45.633

1

well, u can make that line to be progressBar and animate setting its progress.

This how animation is done: Animate ProgressBar update in Android

Or you can animate the view background, just using drawables with animations, check here: Animate change of view background color on Android

edited Apr 05 '18 at 08:19

answered Apr 05 '18 at 08:14

Maksym V.

2,877
17
27

Animate while setBackgroundColor in android

1 Answers1