闪屏页的实现方式有多种,需要根据UI设计的闪屏页的效果图来决定最终选用哪一种。
先来看一下我最终的实现效果
这个方法是我试过的最和谐的一种方法了。先来讲一下实现步骤,然后再聊一下其他方法
1.首先在AndroidManifest.xml文件中,注册要启动的SplashActivity
<activity
android: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>
2.在styles.xml文件中配置自定义主题模式:因为我使用的是Activity加载xml文件的模式,所以应用启动的时候会有白屏或者黑屏的情况,为了解决这种效果,我把其他的主题色改为系统的主色调,跟闪屏页的背景图一样的颜色,看起来效果就没有那么突兀
<!-- 应用启动页(StartingWindow)的theme -->
<style name="StartingWindowTheme" parent="AppTheme">
<!-- 可以设置成纯颜色(设置一个和Activity UI相似的背景) -->
<item name="android:windowBackground">@color/color_CA4729</item>
<!--也可以设置成一张图片 -->
<!-- <item name="android:windowBackground">@drawable/startingwindow_bg</item>-->
</style>
3.实现SplashActivity代码,虽然把闪屏页的白屏改为跟图片一样的背景色,但是免不了闪一下的感觉,为了解决这种状况,在SplashActivity加了透明度渐变的效果,实现的效果就相当完美了!
/**
* 解决启动白屏问题
*
* @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);//恢复原有的样式
// 设置没有标题栏
this.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(0.1f,1.0f);
alphaAnimation.setDuration(1000);//设置动画播放时长1000毫秒(1秒)
layoutSplash.startAnimation(alphaAnimation);
//设置动画监听
alphaAnimation.setAnimationListener(new Animation.AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {
}
//动画结束
@Override
public void onAnimationEnd(Animation animation) {
//页面的跳转
startActivity(new Intent(SplashActivity.this, MainActivity.class));
finish();
}
@Override
public void onAnimationRepeat(Animation animation) {
}
});
}
@Override
public void onDestroy() {
super.onDestroy();
}
}
4.最后是activity_loading.xml布局文件
UI设计的效果图虽然做了屏幕适配,但是android的机型太太多了,免不了各种拉伸问题,因为图片是为了全屏显示,又不能做裁剪,所以我让UI把各个图片抠出来了。
start_bg.png是红色底部又波浪线的背景图,使其宽度全屏,高度自适应显示。
start_center.png是中间的圆圈,因为是圆形,所以一点都不能拉伸,否则就会变形,所以图片做根据自身大小居中显示即可。
剩下就是底部的logo图已经文本了,就不多做说明
<?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.5dp"
android:layout_gravity="center_horizontal"
android:src="@drawable/start_bottom"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="共享财富与健康"
android:textSize="16sp"
android:layout_marginTop="18dp"
android:layout_gravity="center_horizontal"
android:textColor="@color/color_333333"/>
</LinearLayout>
</layout>
我的实现到这里就已经结束了!!!
现在让我们来讲一下其他实现方式:
如何让闪屏页秒开!!!!
方式一:
1.首先在AndroidManifest.xml文件中,注册要启动的LoadingActivity
<activity
android: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>
2.在styles.xml文件中配置自定义主题模式
2.1 如果是单张背景图,可以直接设置android:windowBackground,引入图片start.png
<!--过渡图-->
<style name="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>
2.2 如果图片是多张,可以设置android:windowBackground,引入layer-list文件layer_splash.xml
<!--过渡图-->
<style name="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>
相关的layer_splash.xml代码如下:可以设置多个item,并且设置其位置
<?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">
<!-- 图片 clip_horizontal 如果尺寸不一致,那么周围的填充色就是背景色-->
<bitmap
android:gravity="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>
LoadingActivity.class代码如下:注意,这边就不需要setContentView显示layout文件了
public class LoadingActivity extends FragmentActivity {
private Handler handler;
@Override
protected void onCreate(Bundle savedInstanceState) {
setTheme(R.style.SplashTheme);//恢复原有的样式
super.onCreate(savedInstanceState);
// setContentView(R.layout.activity_loading);
// 后台返回时可能启动这个页面 http://blog.csdn.net/jianiuqi/article/details/54091181
if ((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 void onDestroy() {
handler = null;
super.onDestroy();
}
}
我想说明一点的是,利用配置Activity的启动theme来实现方式,我在实验中有太多坑了:
整张效果图引入的方式,必然会有图片拉伸变形的结果,除非你的图片能够适配到各种屏幕的手机;
利用layer-list方式,我的手机会有闪动一下的效果:
虽然秒开的效果实现了,而且图片也不会变形,但是那抖动一下,实在让我接受不了,如果有大神知道解决方式,烦请指点一二,感谢!