6

Following the question: Animate change of view background color on Android I am trying to make a TextView to fade between two backgrounds via TransitionDrawable resource. My transition xml file looks like this:

<?xml version="1.0" encoding="utf-8"?>
<transition xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:drawable="@drawable/gray_bar" />
    <item android:drawable="@drawable/green_bar" />
</transition>

And I try to set it as background on runtime by:

TextView answerBox = (TextView) findViewById(R.id.answerBox);
answerBox.setBackgroundResource(R.drawable.correct_transition);
TransitionDrawable transition = (TransitionDrawable) answerBox.getBackground();
transition.startTransition(1500);

The result is that the textview transforms from this:

Textview with gray_bar background to this: Textview with green_bar background

When the whole gray bar should be transformed into the green one.

Both are 9-patch png images. These are the originals:

gray_bar green_bar

My guess is that the green bar is filling the space available for text inside the gray bar, but I don't know why. Any clues? The gray one also appears much bigger than it should, but does not change size before, during or after the transition, despite the appearance of the included images. It may be an issue with the 9-patch images cause I have tested normal images and the transition works great.

Thanks for any help!

Community
  • 1
  • 1
viridis
  • 177
  • 10
  • I have the exact same issue... did you manage to solve this in any way? – zwebie Jun 14 '12 at 12:47
  • hmmm, in google's example they use setImageDrawable maybe the setbackground is not an expected behavior, if not, then you could put an imageview as a "background" (using relative layout place it under the textview) and just run the transition on that maybe? – MikeIsrael Jun 14 '12 at 12:57
  • No, that is not working either. I have switched to color instead of images. I suggest it's a 9-patch issue cause I tested the same code with normal images and worked as expected. So, zwebie, it's working with color instead of 9-patch images, and in my case it works with normal (non 9-patch) images. – viridis Jun 17 '12 at 11:16

1 Answers1

0

I was able to reproduce the issue you're seeing with the green bar not taking up the full space of the gray one. To fix it, take the gray bar 9-patch and extend the lines on the bottom and right side to one pixel away from the corners.

On a side note, another potential issue with your 9-patches is that, as the contents increase in height, your image will have visual artifacts as it stretches vertically. This is a result of the height of the black bar on the left side of your image, which determines which part of the 9-patch should stretch. A further improvement to these 9-patches would be to reduce the black line on the left to just a single pixel in the very center of the left edge. Since only one pixel is marked as stretchable, this should give you a nice crisp vertical edge if your drawable increases in height.

If you include your layout code, I may be able to help you with your other sizing issues.

samurai413x
  • 22
  • 3