溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
引導頁是項目中很常見的東西了，在用戶下載app首次打開后，會進入引導界面，通常都是三四張圖片說明，簡單介紹下app的功能和使用方法之類，最后一張有著“進入應用”的按鈕，點擊即可進入主頁，之后打開app則不會再次進入啟動頁，話不多說，以下做個歸納。
效果圖：
實現步驟：
1.首先我們做個有漸變動畫的啟動頁面SplashActivity
在onCreate里設置核心方法setAlphaAnimation()
public void setAlphaAnimation(){
//生成AlphaAnimation的對象
AlphaAnimation animation= new AlphaAnimation(this);
//設置動畫的持續時間
animation.setDuration(3000);
//給要漸變的控件設置動畫，比如說imageview，textview，linearLayout之類的
ll.setAnimation(animation);
//設置動畫監聽，結束時跳轉到下一個頁面（首次打開就是引導頁面，反之就是主頁）
animation.setAnimationListener(new Animation.AnimationListener(){
public void onAnimationStart(Animation animation){ }
public void onAnimationEnd(Animation animation){
jump2Activity();
}
public void onAnimationRepeat(Animation animation){ }
});
}
分析一下這個跳轉方法jump2Activity()，我們這里使用SharedPeference來判斷應用是否首次打開，設變量isFirst默認值為0，進入引導頁跳轉到主頁時再把這個值設為1，這樣，每次跳轉時判斷isFirst的值，如果仍是默認值0則為首次打開進入引導頁，反之進入主頁。
public void jump2Activity(){
SharedPreferences sharedPreference= getSharedPreferences("data", MODE_PRIVATE);
String isFirst= sharedPreferences.getString("isFirst", "0");
Intent intent= new Intent();
if("0".equals(isFirst)){
intent.setClass(this, GuideActivity.class);
}else{
intent.setClass(this. MainActivity.class);
}
startActivity(intent);
finish();
}
2.接下來我們做引導頁面
引導頁面是由三個控件組成，Viewpager，圓點指示器的線性布局linearlayout， 最后一頁的 “進入應用” 按鈕。
<?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"> <android.support.v4.view.ViewPager android:id="@+id/guide_vp" android:layout_width="match_parent" android:layout_height="match_parent" /> <LinearLayout android:id="@+id/guide_ll" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_centerHorizontal="true" android:layout_marginBottom="100dp" android:orientation="horizontal" /> <Button android:id="@+id/guide_btn" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_above="@id/guide_ll" android:layout_centerHorizontal="true" android:text="進入應用" android:layout_marginBottom="10dp" android:visibility="gone"/> </RelativeLayout>
在GuideActivity中，首先初始化引導圖片
/**
* 初始化圖片
*/
private void initImgs() {
ViewPager.LayoutParams params= new ViewPager.LayoutParams();
imageViews= new ArrayList<ImageView>();
for (int i= 0; i< imgs.length; i++){
ImageView imageView= new ImageView(this);
imageView.setLayoutParams(params);
imageView.setImageResource(imgs[i]);
imageView.setScaleType(ImageView.ScaleType.FIT_XY);
imageViews.add(imageView);
}
}
初始化底部圓點指示器，這里值得一提的是我們給各圓點設置相應的點擊事件，當點擊某個位置的圓點時，viewpager自動切換到相應位置的圖片，不過實際應用中這里實用性不是很大，因為圓點太小，可觸摸范圍有限，點擊事件不太好觸發。
/**
* 初始化底部圓點指示器
*/
private void initDots() {
LinearLayout layout= findViewById(R.id.guide_ll);
LinearLayout.LayoutParams params= new LinearLayout.LayoutParams(20, 20);
params.setMargins(10, 0, 10, 0);
dotViews= new ImageView[imgs.length];
for (int i= 0; i< imageViews.size(); i++){
ImageView imageView= new ImageView(this);
imageView.setLayoutParams(params);
imageView.setImageResource(R.drawable.dotselector);
if (i== 0){
imageView.setSelected(true);
}else{
imageView.setSelected(false);
}
dotViews[i]= imageView;
final int finalI = i;
dotViews[i].setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
vp.setCurrentItem(finalI);
}
});
layout.addView(imageView);
}
}
設置viewpager的滑動事件
vp.addOnPageChangeListener(this);
生成三個方法，我們主要在onPageSelected()方法中做操作，當某個位置的圓點被選中時，顯示選中后的圖片，其余圓點顯示未選中的圖片，這里主要應用selector控制器，至于相應的選中未選中圓點圖片需要大家去找。當滑動到最后一個頁面時，將 "進入應用" 的按鈕顯示，反之隱藏。
@Override
public void onPageScrolled(int i, float v, int i1) {}
@Override
public void onPageScrollStateChanged(int i) {}
@Override
public void onPageSelected(int arg0) {
for (int i= 0; i< dotViews.length; i++){
if (arg0== i){
dotViews[i].setSelected(true);
}else {
dotViews[i].setSelected(false);
}
if (arg0== dotViews.length- 1){
btn.setVisibility(View.VISIBLE);
}else {
btn.setVisibility(View.GONE);
}
}
}
dotSelector.xml
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@drawable/focus_on" android:state_selected="true"/> <item android:drawable="@drawable/focus_nomal" android:state_selected="false"/> </selector>
在最后一個頁面點擊 "進入應用" 按鈕跳轉到主頁時，將緩存中的isFirst數據改為1，以后打開應用則不會再進入引導頁面了。
@Override
public void onClick(View view) {
switch (view.getId()){
case R.id.guide_btn:
setisFirst();
Intent intent= new Intent(GuideActivity.this, MainActivity.class);
startActivity(intent);
finish();
break;
}
}
/**
* 改變首次打開的狀態
*/
private void setisFirst() {
SharedPreferences.Editor editor= getSharedPreferences("data", MODE_PRIVATE).edit();
editor.putString("isFirst", "1");
editor.commit();
}
至此全部完成！demo附上
源碼下載
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持億速云。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
