Question

I have a RadioGroup with four check buttons. I’d like to create a “slide” transition animation so that if the user clicks the bottom most radiobuttom while the topmost is currently checked, my custom checkbox graphic would slide from the top position to the bottom. Any ideas? I’d like this to work on Android 2.0 and above.

Answer 1

If I am imagining the same thing as you (which I might not be) you’re going to need 2 Animations. One to scoot the disabled buttons down, and one to scoot the chosen button up to the top.

You are going to use TranslateAnimation. You can find some more info about view Animations here

You’ll want to define your TranslateAnimations in xml or in java then you can call radioBtn.startAnimation(myAnim); you pass it the Animation object that you create or that you inflate from xml.

Edit: Unfortunately I think it is going to end up being a fairly complex process to make it work that way. I can think of two ways to achieve that effect. But neither is particularly straight forward.

Make yourself an ImageView that contains the CHECKED_ON graphic as its picture. Set its position over top of whatever is currently selected. when something new is selected use TranslateAnimation to move the ImageView to the position of the newly selected item. If you are going this route I think you’ll have to change your CheckBox graphic to use the CHECKED OFF image in both states (on and off) otherwise as soon as you click on a new one its going to change to ON, even though the graphic will be in the process of flying toward the newly selected one.

Another potential solution would be make a vertical seek bar object and hook up the Label names to set the seek bar to the correct position when they are touched. To get an animated effect you could use a for loop and just increase/decrease the seek bar position by some small amount over and over until you arrive at your destination. The logic could work the same as check boxes, they would just be considered CHECKED_ON whenever the seekbar position is in line with them and off otherwise. This approach might actually end up being simpler to implement than using Animations to achieve it.

although I’ve only pondered it briefly I would probably lean towards the second option. I have used TranslateAnimations in the past to simulate drag & drop actions on some custom Views that I made for a game. This was one of the most difficult things I worked on related to that game.