RxJava practice to create a cool startup page

RxJava practice to create a cool startup page

I noticed before that the coding APP startup page is very cool. Today we use RxJava and attribute animation to imitate its effect.

[[170939]]

1. Create a new startup page WelcomeActivity

Note that we let WelcomeActivity inherit Activity instead of AppCompatActivity, because AppCompatActivity will load the theme by default, causing lag.

  1.   public class WelcomeActivity extends Activity {
  2.  
  3. @Override
  4. protected void onCreate(Bundle savedInstanceState) {
  5. super.onCreate(savedInstanceState);
  6. setContentView(R.layout.activity_welcome);
  7. }
  8. }

2. Define the guide page layout activity_welcome.xml

Without further ado, here is the code:

  1. <?xml version= "1.0" encoding= "utf-8" ?>
  2. <RelativeLayout xmlns:android= "http://schemas.android.com/apk/res/android"  
  3. android:layout_width= "match_parent"  
  4. android:layout_height= "match_parent" >
  5.  
  6. <ImageView
  7. android:id= "@+id/iv_entry"  
  8. android:layout_width= "match_parent"  
  9. android:layout_height= "match_parent"  
  10. android:scaleType= "fitXY"  
  11. android:src= "@drawable/welcomimg1" />
  12.  
  13. < View  
  14. android:layout_width= "match_parent"  
  15. android:layout_height= "match_parent"  
  16. android:background= "@drawable/welcomimg_bg" />
  17.  
  18.  
  19. <TextView
  20. android:layout_width= "match_parent"  
  21. android:layout_height= "wrap_content"  
  22. android:layout_alignParentBottom= "true"  
  23. android:layout_marginBottom= "100dp"  
  24. android:gravity= "center"  
  25. android:text= "xialong"  
  26. android:textColor= "@android:color/white"  
  27. android:textSize= "23sp" />
  28.  
  29. <ImageView
  30. android:layout_width= "wrap_content"  
  31. android:layout_height= "wrap_content"  
  32. android:src= "@mipmap/google_logo"  
  33. android:layout_alignParentBottom= "true"  
  34. android:layout_marginBottom= "60dp"  
  35. android:layout_centerInParent= "true"  
  36. android:tint= "@android:color/white" />
  37. </RelativeLayout>

Here we use a relative layout and overlay a View on the ImageView. The View uses a gradient background welcomimg_bg.xml to darken the image. The welcomimg_bg.xml code is as follows:

  1. <?xml version= "1.0" encoding= "utf-8" ?>
  2. <shape xmlns:android= "http://schemas.android.com/apk/res/android" >
  3.  
  4. < gradient
  5. android:angle= "90"  
  6. android:startColor= "@color/black"  
  7. android:endColor= "@android:color/transparent"  
  8. />
  9.  
  10. </shape>

Where startColor represents the starting color, endColor represents the ending color, and angle=90 represents that the color changes gradually from bottom to top.

3. Randomly select pictures and start animation using RxJava

***Our WelcomeActivity.java looks like this:

  1. public class WelcomeActivity extends Activity {
  2.  
  3. @Bind(R.id.iv_entry)
  4. ImageView mIVEntry;
  5.  
  6. private static final int ANIM_TIME = 2000;
  7.  
  8. private static final float SCALE_END = 1.15F;
  9.  
  10. private static final int [] Imgs={
  11. R.drawable.welcomimg1,R.drawable.welcomimg2,
  12. R.drawable.welcomimg3,R.drawable.welcomimg4,
  13. R.drawable.welcomimg5, R.drawable.welcomimg6,
  14. R.drawable.welcomimg7,R.drawable.welcomimg8,
  15. R.drawable.welcomimg9,R.drawable.welcomimg10,
  16. R.drawable.welcomimg11,R.drawable.welcomimg12,};
  17.  
  18. @Override
  19. protected void onCreate(Bundle savedInstanceState) {
  20. super.onCreate(savedInstanceState);
  21. setContentView(R.layout.activity_welcome);
  22. ButterKnife.bind(this);
  23.  
  24. Random random = new Random(SystemClock.elapsedRealtime()); //SystemClock.elapsedRealtime() The number of milliseconds from power on to now (including the sleep time of the phone)
  25. mIVEntry.setImageResource(Imgs[random.nextInt(Imgs.length)]);
  26.  
  27. Observable.timer(1000, TimeUnit.MILLISECONDS)
  28. .observeOn(AndroidSchedulers.mainThread())
  29. .subscribe(new Action1<Long>()
  30. {
  31.  
  32. @Override
  33. public void call(Long aLong)
  34. {
  35. startAnim();
  36. }
  37. });
  38. }
  39.  
  40.  
  41. private void startAnim() {
  42.  
  43. ObjectAnimator animatorX = ObjectAnimator.ofFloat(mIVEntry, "scaleX" , 1f, SCALE_END);
  44. ObjectAnimator animatorY = ObjectAnimator.ofFloat(mIVEntry, "scaleY" , 1f, SCALE_END);
  45.  
  46. AnimatorSet set = new AnimatorSet();
  47. set .setDuration(ANIM_TIME).play(animatorX) .with (animatorY);
  48. set .start();
  49.  
  50. set .addListener(new AnimatorListenerAdapter()
  51. {
  52.  
  53. @Override
  54. public void onAnimationEnd(Animator animation)
  55. {
  56.  
  57. startActivity(new Intent(WelcomeActivity.this, MainActivity.class));
  58. WelcomeActivity.this.finish();
  59. }
  60. });
  61. }
  62. }

Here, RxJava uses the timer operator, which means to delay the execution of an operation. The first parameter represents the delay time, and the second parameter is the time unit.

Okay, that’s it.

If you need the complete code, you can click here to transfer the code

  1. #RxJava Android Startup Page

<<:  As tech giants race to seize the VR virtual reality market, has Google taken the lead?

>>:  Huawei Developer Competition offline sharing session @ Huawei Connect Conference

Recommend

Let's have a cup of ice beauty with pictures and texts. Buying point 1 document

Have a cup of iced beauty with pictures and texts ...

Tik Tok live broadcast room FEED stream promotion marketing strategy

one. Merchant access requirements 1. Selling good...

Dissecting the three strategies of brand private domain KOC incubation

KOC is the key node in the current private domain...

3 key points for optimizing Google advertising!

The quality score of your ads plays a very import...

What is brand planning?

When we can't figure out a problem, the best ...

With concerns and doubts lingering, can Samsung TV continue its success?

Samsung Note7 explosion may be a rift in Samsung&...

The most-liked answer on Zhihu: How are marketers made?

Today I saw some people who can analyze the suppl...

"Super Moon" appears tonight!

Your browser does not support the video tag Xinhu...