第二章--extendsPagerAdapter
備註:
- 此章節的View Pager Adapter是屬於
Outer Class
- 每個Silder的元件可以自定義(比較耗RAM的資源,但畫面可以自定義、比較多樣)
- 此章節第一步驟~第七步驟跟前章節(First Chapter)幾乎一模一樣,所以這裡不再重複贅述。
Step 6:
第六步驟大致上跟First Chapter一樣,只有一個小地方不太一樣,注意上一章節的welcome_side1.xml
~welcome_side4.xml
的<ImageView/>
的圖片都是在xml裡面做設定(android:src="@drawable/xxxxxx"),但是這樣的方式比較死、比較不彈性,所以在這一章節的第六步驟就沒有android:src="@drawable/xxxxxx"
這行程式碼,改在WelcomeActivity.java
為每個畫面設定圖片。
Step 8:
第八步驟大致上跟First Chapter一樣,在沒有(androidTest)
和(test)
的那個Package上面按右鍵再新增1個Java class,名稱可以自行命名(這裡以WelcomeActivity為例)只有一些小地方不太一樣,不一樣的地方都有註解:
package com.epp.yangrex.introsilder;
import android.content.Context;
import android.content.Intent;
import android.graphics.Color;
import android.os.Build;
import android.os.Bundle;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.text.Html;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.view.Window;
import android.view.WindowManager;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;
import java.util.ArrayList;
import java.util.List;
public class WelcomeActivity extends AppCompatActivity {
private ViewPager viewPager;
private InnerViewPagerAdapter myViewPagerAdapter;
private LinearLayout dotsLayout;
private TextView[] dots;
private int[] layouts;
public int[] titles;
public int[] descrs;
public int[] images;
private Button btnSkip, btnNext;
private PrefManager prefManager;
private LayoutInflater layoutInflater;
private List<SilderModel> silders;
private List<View> silderview;
private List<Integer> silderview_Integer;
private List<Integer> sildertitle_Integer;
private List<Integer> silderdescr_Integer;
private List<Integer> silderimage_Integer;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// Checking for first time launch - before calling setContentView()
prefManager = new PrefManager(this);
if (!prefManager.isFirstTimeLaunch()) {
/*
* App第一次啟動,會呼叫在PreManager.java的isFirstTimeLaunch()判斷App是不是第一起啟動
* 如果是第一次啟動,getBoolean() 會傳回一個布林值
* 但是因為是第一次啟動,這個布林值尚未被設定為true或false,所以 getBoolean() 會傳回()內的第二個參數(也就是"預設值"true)
*
* 但是當true遇到! 就會變成false
* 所以就不會執行下面兩行程式
* */
launchHomeScreen();
finish();//結束這個Activity
}
// Making notification bar transparent
if (Build.VERSION.SDK_INT >= 21) {
getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_STABLE | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN);
}
setContentView(R.layout.activity_welcome);
//region FindView()
viewPager = (ViewPager) findViewById(R.id.view_pager);
dotsLayout = (LinearLayout) findViewById(R.id.layoutDots);
btnSkip = (Button) findViewById(R.id.btn_skip);
btnNext = (Button) findViewById(R.id.btn_next);
//endregion
//region 方法一(First Chapter的用法,PagerAdapter屬Inner Class)
// layouts of all welcome sliders
// add few more layouts if you want
// layouts = new int[]{
// R.layout.welcome_side1,
// R.layout.welcome_side2,
// R.layout.welcome_side3,
// R.layout.welcome_side4};
//
//
// myViewPagerAdapter = new InnerViewPagerAdapter();
// viewPager.setAdapter(myViewPagerAdapter);
// viewPager.addOnPageChangeListener(viewPagerPageChangeListener);
//endregion
//region 方法二(Second Chapter的用法,PagerAdapter屬Outer Class用法)
//region 方法二之一
layoutInflater = getLayoutInflater().from(this);
View v1 = layoutInflater.inflate(R.layout.welcome_side1, null);
View v2 = layoutInflater.inflate(R.layout.welcome_side2, null);
View v3 = layoutInflater.inflate(R.layout.welcome_side3, null);
View v4 = layoutInflater.inflate(R.layout.welcome_side4, null);
silderview = new ArrayList<View>();
silderview.add(v1);
silderview.add(v2);
silderview.add(v3);
silderview.add(v4);
//設定每個畫面的圖片
images = new int[]{
R.drawable.ic_food,
R.drawable.ic_movie,
R.drawable.ic_discount,
R.drawable.ic_travel};
silderimage_Integer = new ArrayList<Integer>();
for(int i : images){
silderimage_Integer.add(i);
}
//設定每個畫面的Title
titles = new int[]{
R.string.slide_1_title,
R.string.slide_2_title,
R.string.slide_3_title,
R.string.slide_4_title};
sildertitle_Integer = new ArrayList<Integer>();
for(int i : titles){
sildertitle_Integer.add(i);
}
//設定每個畫面的Description
descrs = new int[]{
R.string.slide_1_desc,
R.string.slide_2_desc,
R.string.slide_3_desc,
R.string.slide_4_desc};
silderdescr_Integer = new ArrayList<Integer>();
for(int i : descrs){
silderdescr_Integer.add(i);
}
viewPager.setAdapter(new OutterViewPagerAdapter(silderview,silderimage_Integer,sildertitle_Integer,silderdescr_Integer));
viewPager.setCurrentItem(0);
viewPager.addOnPageChangeListener(viewPagerPageChangeListener);
//endregion
//endregion
// adding bottom dots
addBottomDots(0);
// making notification bar transparent
changeStatusBarColor();
btnSkip.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
launchHomeScreen();//只要User按下SKIP的按鈕,就呼叫launchHomeScreen(),設定為false,這樣之後開啟App就不會再次出現Silder
}
});
btnNext.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// checking for last page
// if last page home screen will be launched
int current = getItem(+1);
//這裡用的是silderview.size()
if (current < silderview.size()) {
// move to next screen
viewPager.setCurrentItem(current);
} else {
launchHomeScreen();//只要User按下NEXT的按鈕,就呼叫launchHomeScreen(),設定為false,這樣之後開啟App就不會再次出現Silder
}
}
});
}
private void addBottomDots(int currentPage) {
//region 方法一(First Chapter的用法,PagerAdapter屬Inner Class)
//dots = new TextView[layouts.length];
//endregion
//region 方法二(Second Chapter的用法,PagerAdapter屬Outer Class用法)
dots = new TextView[silderview.size()];
//endregion
int[] colorsActive = getResources().getIntArray(R.array.array_dot_active);
int[] colorsInactive = getResources().getIntArray(R.array.array_dot_inactive);
dotsLayout.removeAllViews();
for (int i = 0; i < dots.length; i++) {
dots[i] = new TextView(this);
dots[i].setText(Html.fromHtml("•"));
dots[i].setTextSize(35);
dots[i].setTextColor(colorsInactive[currentPage]);
dotsLayout.addView(dots[i]);
}
if (dots.length > 0)
dots[currentPage].setTextColor(colorsActive[currentPage]);
}
private int getItem(int i) {
return viewPager.getCurrentItem() + i;
}
private void launchHomeScreen() {
prefManager.setFirstTimeLaunch(false);//WelcomeActivity.java被啟動一次之後,則設定為false
startActivity(new Intent(WelcomeActivity.this, MainActivity.class));
finish();
}
// viewpager change listener
ViewPager.OnPageChangeListener viewPagerPageChangeListener = new ViewPager.OnPageChangeListener() {
@Override
public void onPageSelected(int position) {
addBottomDots(position);
//region 方法一(First Chapter的用法,PagerAdapter屬Inner Class)
// changing the next button text 'NEXT' / 'GOT IT'
// if (position == layouts.length - 1) {
// // last page. make button text to GOT IT
// btnNext.setText(getString(R.string.start));
// btnSkip.setVisibility(View.GONE);
// } else {
// // still pages are left
// btnNext.setText(getString(R.string.next));
// btnSkip.setVisibility(View.VISIBLE);
// }
//endregion
//region 方法二(Second Chapter的用法,PagerAdapter屬Outer Class用法)
// changing the next button text 'NEXT' / 'GOT IT'
if (position == silderview.size() - 1) {
// last page. make button text to GOT IT
btnNext.setText(getString(R.string.start));
btnSkip.setVisibility(View.GONE);
} else {
// still pages are left
btnNext.setText(getString(R.string.next));
btnSkip.setVisibility(View.VISIBLE);
}
//endregion
}
@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
}
@Override
public void onPageScrollStateChanged(int arg0) {
}
};
/**
* Making notification bar transparent
*/
private void changeStatusBarColor() {
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
Window window = getWindow();
window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
window.setStatusBarColor(Color.TRANSPARENT);
}
}
/**
* 原本這裡有一個class extends PagerAdapter,因為本章節示範的View pager Adapter屬於Outer Class,所以刪除原本存在這裡的程式碼,改成Step 9的用法。
*/
}
Step 9:
繼續在java這個資料夾內,在沒有(androidTest)
和(test)
的那個Package上面按右鍵再新增1個Java class,名稱可以自行命名(這裡以OutterViewPagerAdapter為例),這個class主要作為View pager adapter
:
package com.epp.yangrex.introsilder;
import android.content.Context;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageButton;
import android.widget.ImageView;
import android.widget.TextView;
import java.util.List;
public class OutterViewPagerAdapter extends PagerAdapter {
private Context context;
private List<View> mSilderViews;
private LayoutInflater inflater;
private List<Integer> mSilderViews_image;
private List<Integer> mSilderViews_title;
private List<Integer> mSilderViews_descr;
public int [] mSilderViews_layout;
//region Outter Class 第二之一種方法(每個Silder的元件可以自定義)(比較耗RAM的資源,但畫面可以自定義、比較多樣)
public OutterViewPagerAdapter(List<View> mSilderViews,List<Integer> mSilderViews_image,List<Integer> mSilderViews_title,List<Integer> mSilderViews_descr) {
this.mSilderViews = mSilderViews;
this.mSilderViews_image = mSilderViews_image;
this.mSilderViews_title = mSilderViews_title;
this.mSilderViews_descr = mSilderViews_descr;
}
//endregion
public OutterViewPagerAdapter() {
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
//region Outter Class 第二之一種方法(每個Silder的元件可以自定義)
//佈局
View view = mSilderViews.get(position);
ImageView imageView = (ImageView) view.findViewById(R.id.imageview_1);
TextView text_title = (TextView) view.findViewById(R.id.textview_title);
TextView text_descr = (TextView) view.findViewById(R.id.textview_descr);
imageView.setImageResource(mSilderViews_image.get(position));
text_title.setText(mSilderViews_title.get(position));
text_descr.setText(mSilderViews_descr.get(position));
//endregion
//加載
container.addView(view);
return view;
}
@Override
public int getCount() {
//region Outter Class 第二之一種方法(每個Silder的元件可以自定義)
return mSilderViews.size();
//endregion
}
// 來判斷顯示的是否是同一張圖片,這裡我們將兩個參數相比較返回即可
@Override
public boolean isViewFromObject(View view, Object obj) {
return view == obj;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
View view = (View) object;
container.removeView(view);
}
}