Forum Xamarin.Forms
We are excited to announce that the Xamarin Forums are moving to the new Microsoft Q&A experience. Q&A is the home for technical questions and answers at across all products at Microsoft now including Xamarin!

We encourage you to head over to Microsoft Q&A for .NET for posting new questions and get involved today.

How to animate change of background color?

JohnHardmanJohnHardman GBUniversity admin

Given a View such as a Label, if I want to animate a change of BackgroundColor (not Opacity) from one Color to another, how can this be done?

Many thanks,

John H.

Best Answers


  • AdamPAdamP AUUniversity ✭✭✭✭✭

    @JohnHardman - never done it before but I am going to guess Animations is the place to start looking. But I figure you already know that and looking into it further, I am suspecting that Fade, Scale and Rotate are about all you can do in forms.

    Hence its custom extension time :)

    Or you can cheat and set a timer to update the color but its a dirty hack.

    Never created a custom extension before, so will be back to give it a shot if you don't figure it out in the meantime. So busy at the moment, next time I decide to do a 14 post series on my blog, I need to take a week off.

  • JohnHardmanJohnHardman GBUniversity admin

    @ahmadmadi - Many thanks for your answer. Unfortunately, I asked the wrong question, or at least didn't make it as precise as it needed to be. The effect that I'm after is for the old background color to slide sideways, with the new background color sliding in to replace it (so, for instance, the old color sliding out to the right, being replaced by the new color sliding in from the left).

    I'll mark your answer as accepted, as it answered the question as I had worded it. If you have any thoughts about the how to implement the sliding background color, that would be much appreciated.

  • ahmadmadiahmadmadi USMember ✭✭✭

    Well the only thing that crosses my mind without trying , is to place two BoxViews on top of each other (over laying each other ) and you keep moving the one on the top (by using translating which will uncover the one below and you will have what you need. This is theory speaking .

  • JohnHardmanJohnHardman GBUniversity admin

    @ahmdamadi - a Label with a transparent background color, with two BoxViews behind (one of which is moved using Translate) should do the trick. Thanks again.

  • JohnHardmanJohnHardman GBUniversity admin

    @JensDemey - Yes, as the Label and BoxView(s) would be in a Grid with its own BackgroundColor property, the second BoxView is not required. Thanks.

  • JensDemeyJensDemey USMember ✭✭

    Oh sorry, I was typing this post a few hours ago but I forgot to post it and didn't notice the other answer. Slap myself

Sign In or Register to comment.