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.

   public class WelcomeActivity extends Activity { 
 
 @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_welcome);
 }
 }

2. Define the guide page layout activity_welcome.xml

Without further ado, here is the code:

 <?xml version= "1.0" encoding= "utf-8" ?>
 <RelativeLayout xmlns:android= "http://schemas.android.com/apk/res/android"  
    android:layout_width= "match_parent"  
    android:layout_height= "match_parent" > 
 
 <ImageView
        android:id= "@+id/iv_entry"  
        android:layout_width= "match_parent"  
        android:layout_height= "match_parent"  
        android:scaleType= "fitXY"  
        android:src= "@drawable/welcomimg1" /> 
 
 < View  
        android:layout_width= "match_parent"  
        android:layout_height= "match_parent"  
        android:background= "@drawable/welcomimg_bg" /> 
 
 
 <TextView
        android:layout_width= "match_parent"  
        android:layout_height= "wrap_content"  
        android:layout_alignParentBottom= "true"  
        android:layout_marginBottom= "100dp"  
        android:gravity= "center"  
        android:text= "xialong"  
        android:textColor= "@android:color/white"  
        android:textSize= "23sp" /> 
 
 <ImageView
        android:layout_width= "wrap_content"  
        android:layout_height= "wrap_content"  
        android:src= "@mipmap/google_logo"  
        android:layout_alignParentBottom= "true"  
        android:layout_marginBottom= "60dp"  
        android:layout_centerInParent= "true"  
        android:tint= "@android:color/white" />
 </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:

 <?xml version= "1.0" encoding= "utf-8" ?>
 <shape xmlns:android= "http://schemas.android.com/apk/res/android" > 
 
 < gradient
 android:angle= "90"  
        android:startColor= "@color/black"  
        android:endColor= "@android:color/transparent"  
 /> 
 
 </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:

 public class WelcomeActivity extends Activity { 
 
 @Bind(R.id.iv_entry)
 ImageView mIVEntry; 
 
    private static final int ANIM_TIME = 2000; 
 
    private static final float SCALE_END = 1.15F; 
 
    private static final int [] Imgs={
            R.drawable.welcomimg1,R.drawable.welcomimg2,
            R.drawable.welcomimg3,R.drawable.welcomimg4,
            R.drawable.welcomimg5, R.drawable.welcomimg6,
            R.drawable.welcomimg7,R.drawable.welcomimg8,
            R.drawable.welcomimg9,R.drawable.welcomimg10,
            R.drawable.welcomimg11,R.drawable.welcomimg12,}; 
 
 @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_welcome);
        ButterKnife.bind(this); 
 
 Random random = new Random(SystemClock.elapsedRealtime()); //SystemClock.elapsedRealtime() The number of milliseconds from power on to now (including the sleep time of the phone)
        mIVEntry.setImageResource(Imgs[random.nextInt(Imgs.length)]); 
 
        Observable.timer(1000, TimeUnit.MILLISECONDS)
                .observeOn(AndroidSchedulers.mainThread())
                .subscribe(new Action1<Long>()
 { 
 
 @Override
 public void call(Long aLong)
 {
                        startAnim();
 }
 });
 } 
 
 
    private void startAnim() { 
 
        ObjectAnimator animatorX = ObjectAnimator.ofFloat(mIVEntry, "scaleX" , 1f, SCALE_END);
        ObjectAnimator animatorY = ObjectAnimator.ofFloat(mIVEntry, "scaleY" , 1f, SCALE_END); 
 
        AnimatorSet set = new AnimatorSet();
 set .setDuration(ANIM_TIME).play(animatorX) .with (animatorY);
 set .start(); 
 
 set .addListener(new AnimatorListenerAdapter()
 { 
 
 @Override
 public void onAnimationEnd(Animator animation)
 { 
 
                startActivity(new Intent(WelcomeActivity.this, MainActivity.class));
                WelcomeActivity.this.finish();
 }
 });
 }
 }

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

 #RxJava Android Startup Page