There are many ways to realize the flash screen page, which one should be selected according to the effect diagram of the UI design of the flash screen page.
Let’s take a look at my final implementation
I’ll talk about the implementation steps first, and then I’ll talk about the other methods
1. First register the SplashActivity to start in the androidmanifest.xml file
<activity
android:name="The package name. SplashActivity"
android:screenOrientation="portrait"
android:theme="@style/StartingWindowTheme">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
Copy the code2. Configure the custom theme schema in the styles.xml file: Since I used the mode of the Activity loading XML file, the app would start with a white or black screen. To solve this problem, I changed the other theme colors to the main color of the system, which was the same color as the background image of the splash page, so it didn’t look so abrupt
<! -- Theme --> <style name="StartingWindowTheme" parent="AppTheme"> <! -- Can be set to a pure color (set a background similar to the Activity UI) --> <item name="android:windowBackground">@color/color_CA4729</item> <! -- Can also be set to a picture --> <! -- <item name="android:windowBackground">@drawable/startingwindow_bg</item>-->
</style>
Copy the code3. Implement the SplashActivity code, although the white screen of the splash screen is changed to the same as the background color of the image, but it is inevitable that the feeling of a flash, to solve this situation, add transparency gradient effect in the SplashActivity, the effect is quite perfect!
@author jingbin */ public class SplashActivity extends BaseActivity<NoViewModel, ActivityLoadingBinding> { private Handler handler; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState);setTheme(R.style.StartingWindowTheme); / / restore original style / / set has no title bar enclosing requestWindowFeature (Window. FEATURE_NO_TITLE);setContentView(R.layout.activity_loading);
showContentView();
if((getIntent().getFlags() & Intent.FLAG_ACTIVITY_BROUGHT_TO_FRONT) ! = 0) { finish();return; } LinearLayout layoutSplash=(LinearLayout) findViewById(R.id.activity_splash); AlphaAnimation AlphaAnimation = new AlphaAnimation (1.0 0.1 f, f); alphaAnimation.setDuration(1000); / / set the flash time 1000 milliseconds (1 second) layoutSplash. StartAnimation (alphaAnimation); / / set the Animation to monitor alphaAnimation. SetAnimationListener (new Animation.AnimationListener() {@override public void onAnimationStart(Animation Animation) { OnAnimationEnd (Animation Animation) {// startActivity(new Intent(splashactivity.this, mainactivity.class)); finish(); } @Override public void onAnimationRepeat(Animation animation) { } }); } @Override public voidonDestroy() { super.onDestroy(); }}Copy the code4. Finally, the activity_load.xml layout file
Although the UI design effect diagram has been screen adapted, but there are many Android models, it is inevitable that various stretching problems, because the picture is to display in full screen, and can not be cut, so I let the UI cut out each picture.
Start_bg.png is a background image with a red bottom and wavy lines, making it full screen wide and height adaptive.
Start_center. PNG is the middle circle. As it is round, it should not be stretched at all, otherwise it will distort.
The rest is the bottom of the LOGO has been text, not to do more explanation
<? xml version="1.0" encoding="utf-8"? > <layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools">
<LinearLayout
android:id="@+id/activity_splash"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorWhite"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:background="@drawable/start_bg">
<ImageView
android:id="@+id/image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:src="@drawable/start_center"/>
</RelativeLayout>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="17.5 dp"
android:layout_gravity="center_horizontal"
android:src="@drawable/start_bottom"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Shared wealth and Health"
android:textSize="16sp"
android:layout_marginTop="18dp"
android:layout_gravity="center_horizontal"
android:textColor="@color/color_333333"/>
</LinearLayout>
</layout>
Copy the codeMy implementation is over here!!
Now let’s talk about other implementations:
How to make the flash screen page second open ！！！！
A:
1. First register the LoadingActivity to start in the androidmanifest.xml file
<activity
android:name="The package name. LoadingActivity"
android:screenOrientation="portrait"
android:theme="@style/SplashTheme">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
Copy the code2. Configure the custom theme schema in the styles. XML file
2.1 If it is a single background image, you can directly set Android :windowBackground and introduce the image start. PNG
<! < span style = "max-width: 100%; clear: both; min-height: 1em"SplashTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:windowBackground">@drawable/start</item>
<item name="android:windowFullscreen">true</item>
<item name="android:navigationBarColor">@android:color/transparent</item>
<item name="android:statusBarColor">@android:color/transparent</item>
</style>
Copy the code2.2 If there are multiple images, you can set Android :windowBackground and introduce layer-list file layer_splash. XML
<! < span style = "max-width: 100%; clear: both; min-height: 1em"SplashTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:windowBackground">@drawable/layer_splash</item>
<item name="android:windowFullscreen">true</item>
<item name="android:navigationBarColor">@android:color/transparent</item>
<item name="android:statusBarColor">@android:color/transparent</item>
</style>
Copy the codeThe associated layer_splash. XML code is as follows: Multiple items can be set and their positions set
<? xml version="1.0" encoding="utf-8"? > <layer-list xmlns:android="http://schemas.android.com/apk/res/android"
android:opacity="opaque"> <! <item Android :drawable="@color/colorWhite" />
<item android:bottom="50dp"> <! <bitmap Android :gravity= -- gravity horizontal if the image size is not consistent, then the surrounding fill color is the background color"center|top|left|right"
android:src="@drawable/start_bg" />
</item>
<item android:top="90dp">
<bitmap
android:gravity="center|top"
android:src="@drawable/start_center" />
</item>
</layer-list>
Copy the codeThe loadingActivity. class code is as follows: Note that setContentView is not required to display the layout file
public class LoadingActivity extends FragmentActivity {
private Handler handler;
@Override
protected void onCreate(Bundle savedInstanceState) {
setTheme(R.style.SplashTheme); // Restore the original style super.onCreate(savedInstanceState); //setContentView(R.layout.activity_loading); / / returned background may start this page http://blog.csdn.net/jianiuqi/article/details/54091181if((getIntent().getFlags() & Intent.FLAG_ACTIVITY_BROUGHT_TO_FRONT) ! = 0) { finish();return;
}
handler = new Handler();
handler.postDelayed(new Runnable() {
@Override
public void run() { startActivity(new Intent(LoadingActivity.this, MainActivity.class)); finish(); }}, 3000); } @Override protected voidonDestroy() { handler = null; super.onDestroy(); }}Copy the codeI would like to point out that I have too many bugs in my experiments with the implementation of the Activity’s launch theme:
The whole effect is introduced in such a way that there is bound to be a result of stretching and deformation of the image, unless your image can be adapted to a variety of screens on the phone;
Using layer-list, my phone will flash:
