In my app, I have a button to show a drop-down menu, inside of that menu we have some options, one of this is “flip A coin”, the purpose of this option is to flip a coin easy animation, that animation appears inside a textView, and show a head-side or a tail-side of a coin instead of the text in the textView. I have two problems:
- The animation doesn’t work how I want, it should appear in 1 second a coin instead of the text inside the textView, it stays there and after 2 seconds he disappears, but after the disappearance, the coin image come back inside the textView, it shouldn’t reappear.
- This is not a real question for a problem but more an optional question like “you know how to do that?”. I ‘don’t know how to create a flip animation with a coin multiple rotations.
XML drop down menu:
<item android:id="@+id/flipacoin" android:title="@string/flipACoin" /> <item android:id="@+id/rolladice" android:title="@string/rollADice" /> <item android:id="@+id/imagebackground" android:title="@string/changeImage" />
JAVA code that calls the animation function:
@Override public boolean onMenuItemClick(MenuItem item) { switch (item.getItemId()){ case R.id.flipacoin: flipACoin(); return true; case R.id.rolladice: Toast.makeText(this,"TODO roll a dice",Toast.LENGTH_SHORT).show(); return true; case R.id.imagebackground: Toast.makeText(this,"TODO image background",Toast.LENGTH_SHORT).show(); return true; default: return false; } }
JAVA animation function:
public void flipACoin(){ coin.setText(null); //this is for remove the text inside the textView coin.setBackground(RANDOM.nextFloat() > 0.5f ? getResources().getDrawable(R.drawable.tails) : getResources().getDrawable(R.drawable.heads)); Animation fadeIn = new AlphaAnimation(0, 1); fadeIn.setInterpolator(new DecelerateInterpolator()); fadeIn.setDuration(1000); Animation fadeOut = new AlphaAnimation(1, 0); fadeOut.setInterpolator(new AccelerateInterpolator()); fadeOut.setStartOffset(2000); fadeOut.setDuration(1000); AnimationSet animation = new AnimationSet(false); animation.addAnimation(fadeIn); animation.addAnimation(fadeOut); coin.setAnimation(animation); }
Advertisement
Answer
When You set background at the beginning it just stays after animation. To set back text and background to null You can add Animation listener. Below is sample application which does it:
public class MainActivity extends AppCompatActivity { TextView coin; Random RANDOM; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); RANDOM = new Random(); coin = findViewById(R.id.coin); (findViewById(R.id.click)).setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { flipACoin(); } }); } public void flipACoin() { coin.setText(null); coin.setBackground(ResourcesCompat.getDrawable(getResources(), RANDOM.nextFloat() > 0.5f ? R.drawable.ic_launcher_background : R.drawable.ic_launcher_foreground, null )); Animation fadeIn = new AlphaAnimation(0, 1); fadeIn.setInterpolator(new DecelerateInterpolator()); fadeIn.setDuration(1000); Animation fadeOut = new AlphaAnimation(1, 0); fadeOut.setInterpolator(new AccelerateInterpolator()); fadeOut.setStartOffset(2000); fadeOut.setDuration(1000); AnimationSet animation = new AnimationSet(false); animation.addAnimation(fadeIn); animation.addAnimation(fadeOut); // listener, it will execute function when animation starts/ends/repeats animation.setAnimationListener(new Animation.AnimationListener() { @Override public void onAnimationStart(Animation animation) { Log.d("MyTag", "onAnimationStart:"); } @Override public void onAnimationEnd(Animation animation) // when animation ends, set text and background to null { Log.d("MyTag", "onAnimationEnd:"); coin.setBackground(null); coin.setText("Default"); } @Override public void onAnimationRepeat(Animation animation) { Log.d("MyTag", "onAnimationRepeat:"); } }); coin.setAnimation(animation); } }
activity_main.xml:
<?xml version="1.0" encoding="utf-8"?> <androidx.appcompat.widget.LinearLayoutCompat xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <Button android:id="@+id/click" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="click" /> <TextView android:id="@+id/coin" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Default" /> </androidx.appcompat.widget.LinearLayoutCompat>