快捷導(dǎo)航

android實現(xiàn)歡迎界面效果

更新時間：2021年09月16日 17:30:22 作者：學(xué)渣的第六感

這篇文章主要為大家詳細(xì)介紹了android實現(xiàn)歡迎界面效果，涉及到頁面的滑動實現(xiàn)方法，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下

現(xiàn)在許多流行的軟件中都有歡迎界面，今天就介紹一下歡迎界面的制作，由于界面涉及到頁面的滑動，因此要采用ViewPager，sdk在4.0一下的都要引入“android-support-v4.jar”這個包。

第一步：main.xml設(shè)計，其中ViewPager為多頁顯示控件，其中button是為了在最后一頁顯示開始按鈕，其中android:visibility="invisible"是保證在其他頁面不顯示button，只有在最后一頁才顯示button,下面的linearlayout里的image是圓點展示當(dāng)前頁狀態(tài)和總頁數(shù)：

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >  
    <android.support.v4.view.ViewPager
        android:id="@+id/guide_viewpager"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center" > 
    </android.support.v4.view.ViewPager>    
    <Button 
      android:text="開始體驗" 
      android:id="@+id/startButton"       
         android:layout_marginBottom="50dp"
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content"
      android:layout_gravity="bottom|center_horizontal"
      android:visibility="invisible">
    </Button>   
    <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
         android:layout_marginBottom="30dp" 
         android:gravity="center_horizontal"     >
            
            <ImageView
             android:id="@+id/page0"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"              
          android:scaleType="matrix"
          android:src="@drawable/page_now" />
            <ImageView
             android:id="@+id/page1"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:layout_marginLeft="10dp"              
          android:scaleType="matrix"
          android:src="@drawable/page" />
            <ImageView
             android:id="@+id/page2"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:layout_marginLeft="10dp"                 
          android:scaleType="matrix"
          android:src="@drawable/page" />
        </LinearLayout>
        
   
</FrameLayout>

第二步：創(chuàng)建MyPagerAdapter 繼承PagerAdapter這個適配器比較簡單，如下：

package com.crtk.adapter;
 
import java.util.ArrayList;
 
import android.R;
import android.os.Parcelable;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;
public class PageviewAdapter extends PagerAdapter{
 private ArrayList<View> views;
   
 public PageviewAdapter(ArrayList<View> views){
  this.views = views;
  
 } 
 //頁面view
 public Object instantiateItem(View container, int position) {
  ((ViewPager)container).addView(views.get(position));
             
  return views.get(position);
 }
  
 @Override
 public int getCount() {
  return this.views.size();
 }
 @Override
 public boolean isViewFromObject(View arg0, Object arg1) {
  return arg0 == arg1;
 }
 public void destroyItem(View container, int position, Object object) {
  ((ViewPager)container).removeView(views.get(position));
 }
 @Override
 public void finishUpdate(View arg0) {
  // TODO Auto-generated method stub
  
 }
 @Override
 public void restoreState(Parcelable arg0, ClassLoader arg1) {
  // TODO Auto-generated method stub
  
 }
 @Override
 public Parcelable saveState() {
  // TODO Auto-generated method stub
  return null;
 }
 @Override
 public void startUpdate(View arg0) {
  // TODO Auto-generated method stub
  
 }
}

第三步：寫Activity，如下：

package com.crtk.main;
 
import java.util.ArrayList;
import java.util.List;
 
import com.crtk.adapter.PageviewAdapter;
 
import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.ImageView;
 
public class GuideActivity extends Activity implements OnPageChangeListener{
 
 static final int PAGE_NUM = 3;//歡迎界面共3頁
 private ArrayList<View> views;//保存viewpager的各個view
 private ViewPager viewPager;
 private LayoutInflater inflater;
 private ImageView []dots; //小點數(shù)組
 
    private Intent intent ;
    private Button startButton;
    
 /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.guide);
        inflater = LayoutInflater.from(this);  
        
        intent = new Intent(GuideActivity.this, MainActivity.class);
        //初始化page
        initPage();
        //初始化小點。。。
        initDots();
        
    }
    private void initPage(){     
                 
         views = new ArrayList<View>(); 
         
 //guide_01,guide_02，guide_03 為3個歡迎頁面，將其加入views數(shù)組中
         views.add(inflater.inflate(R.layout.guide_01, null));
         views.add(inflater.inflate(R.layout.guide_02, null));
         views.add(inflater.inflate(R.layout.guide_03, null));
         
         PageviewAdapter pageAdapter = new PageviewAdapter(views);
         viewPager = (ViewPager)findViewById(R.id.guide_viewpager);
        //綁定adapter 
 viewPager.setAdapter(pageAdapter);
         
         //重要！?。〗壎╬ageseleted等函數(shù)
         viewPager.setOnPageChangeListener(this);
         
           
         //綁定開始鍵，開始使用，只有在最后一頁button才能顯示
         startButton = (Button)findViewById(R.id.startButton);
         
         startButton.setOnClickListener(new  OnClickListener(){
 
   @Override
   public void onClick(View arg0) {
    // TODO Auto-generated method stub
    GuideActivity.this.startActivity(intent); //跳轉(zhuǎn)activity 
    GuideActivity.this.finish(); 
   }
         
         });
         
    }
    private void initDots(){
     dots = new ImageView[3];//底部小圓點數(shù)組
     //View guidePage = (View)findViewById();
     dots[0] = (ImageView) findViewById(R.id.page0);
     dots[1] = (ImageView) findViewById(R.id.page1);
     dots[2] = (ImageView) findViewById(R.id.page2);
     
    }
    
 @Override
 public void onPageScrollStateChanged(int arg0) {
  // TODO Auto-generated method stub
  
 }
 @Override
 public void onPageScrolled(int arg0, float arg1, int arg2) {
  // TODO Auto-generated method stub
  
 }
 @Override
 public void onPageSelected(int arg0) {
  // TODO Auto-generated method stub
  System.out.println("the page now is " + arg0);
  
  dots[arg0].setImageDrawable(getResources().getDrawable(R.drawable.page_now));
 //選中的頁面設(shè)置小圓點為亮點，其余的都為暗點
  for (int i = 0; i < 3 ;i ++)
  {
   if (i == arg0) {continue;}
   else 
   {
    dots[i].setImageDrawable(getResources().getDrawable(R.drawable.page));
 
   }
  }
  
  //如果切換到最后一頁，顯示開始button，其余的都隱藏
  if(arg0 == PAGE_NUM -1)
  {
   startButton.setVisibility(View.VISIBLE);//.setVisibility();
  }
 }
}

其他：上述只是簡單實現(xiàn)了歡迎界面，有的blog里建議最后一頁的開始button放在viewpager里，本人試了一下不是太好用，如果功能要求不是特別多，上述做法還是挺簡單的。

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章: