Android——TabページジェスチャースライドのViewPager
5442 ワード
前の文章はページの抽象を実現することを言って、背景も説明して、1つの左右のスライドスクリーンの機能をするので、この文章の小編はtabページの左右のスライドスクリーンを実現する方法について話します.ページにはメインインタフェースが含まれており、中間の共通部分の抽象は後述されず、スライドスクリーンの4つのサブページも含まれており、異なる機能に対応しています.
メインインタフェースに4つのページが盛られている場所--ViewPager:
Activityの制御:
1、まずページコントロールを定義する:tab、button、ViewPager、PagerAdapter
ViewPager:現在のViewを左右に切り替える
PagerAdapter:ページを埋めるアダプタを提供
2、初期化ページ
LayoutInflater:res/layout/のxmlレイアウトファイルを探してインスタンス化します.作用はfindViewById()に似ています.xmlレイアウトファイルの下にある具体的なwidgetコントロール(Button、TextViewなど)を探しています.
inflate関数:指定したXMLリソースファイルから新しいビュー階層を入力します.
役割:指定したXMLリソースファイルから新しいビュー階層を入力します.
reSource:ViewのlayoutのID
root:生成された階層のルートビュー
returnで埋め込まれた階層のルートビュー.パラメータrootが提供されている場合、rootはルートビューです.そうでなければ、埋め込まれたXMLファイルのルートはルートビューです.
2、リスナーの設定:onclickイベントのバインド
3、onclickイベント:現在表示されているページを設定する
4、onCreateイベントでスレッドを起動する
携帯電話のスライドスクリーンは実は簡単で、アダプタを利用して私たちのサブページを盛って、それから事件を傍受して現在のページを表示します.
メインインタフェースに4つのページが盛られている場所--ViewPager:
<android.support.v4.view.ViewPager
android:id="@+id/id_viewpager"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1" >
</android.support.v4.view.ViewPager>
Activityの制御:
1、まずページコントロールを定義する:tab、button、ViewPager、PagerAdapter
ViewPager:現在のViewを左右に切り替える
PagerAdapter:ページを埋めるアダプタを提供
private RequestQueue mQueue;
private ViewPager mViewPager;
private PagerAdapter mAdapter;
private List<View> mViews = new ArrayList<View>();
// LinearLayout
private LinearLayout mTabPersonInfo;
private LinearLayout mTabCourse;
private LinearLayout mTabExperience;
private LinearLayout mTabEvaluate;
// ImageButton
private ImageButton mPersonInfoImg;
private ImageButton mCourseImg;
private ImageButton mExperienceImg;
private ImageButton mEvaluateImg;
2、初期化ページ
LayoutInflater:res/layout/のxmlレイアウトファイルを探してインスタンス化します.作用はfindViewById()に似ています.xmlレイアウトファイルの下にある具体的なwidgetコントロール(Button、TextViewなど)を探しています.
inflate関数:指定したXMLリソースファイルから新しいビュー階層を入力します.
役割:指定したXMLリソースファイルから新しいビュー階層を入力します.
reSource:ViewのlayoutのID
root:生成された階層のルートビュー
returnで埋め込まれた階層のルートビュー.パラメータrootが提供されている場合、rootはルートビューです.そうでなければ、埋め込まれたXMLファイルのルートはルートビューです.
//
private void initView(){
txtAge=(TextView)findViewById(R.id.txtAge);
mViewPager = (ViewPager) findViewById(R.id.id_viewpager);
// tabs
mTabPersonInfo = (LinearLayout) findViewById(R.id.id_tab_personinfo);
mTabCourse = (LinearLayout) findViewById(R.id.id_tab_course);
mTabExperience = (LinearLayout) findViewById(R.id.id_tab_workexperience);
mTabEvaluate = (LinearLayout) findViewById(R.id.id_tab_evaluate);
// ImageButton
mPersonInfoImg = (ImageButton) findViewById(R.id.id_tab_personinfo_img);
mCourseImg = (ImageButton) findViewById(R.id.id_tab_course_img);
mExperienceImg = (ImageButton) findViewById(R.id.id_tab_workexperience_img);
mEvaluateImg = (ImageButton) findViewById(R.id.id_tab_evaluate_img);
//
LayoutInflater mInflater = LayoutInflater.from(this);
// xml ,
View tabpersoninfo = mInflater.inflate(R.layout.activity_teacher_personinfo, null);
View tabcourse = mInflater.inflate(R.layout.activity_teacher_course, null);
View tabexperience = mInflater.inflate(R.layout.activity_teacher_experience, null);
View tabevaluate = mInflater.inflate(R.layout.activity_teacher_evaluate, null);
mViews.add(tabpersoninfo);
mViews.add(tabcourse);
mViews.add(tabexperience);
mViews.add(tabevaluate);
mAdapter = new PagerAdapter()
{
@Override
public void destroyItem(ViewGroup container, int position,
Object object)
{
container.removeView(mViews.get(position));
}
@Override
public Object instantiateItem(ViewGroup container, int position)
{
View view = mViews.get(position);
container.addView(view);
return view;
}
@Override
public boolean isViewFromObject(View arg0, Object arg1)
{
return arg0 == arg1;
}
@Override
public int getCount()
{
return mViews.size();
}
};
mViewPager.setAdapter(mAdapter);
}
2、リスナーの設定:onclickイベントのバインド
private void initEvents(){
//
mPersonInfoImg.setOnClickListener(this);
mCourseImg.setOnClickListener(this);
mExperienceImg.setOnClickListener(this);
mEvaluateImg.setOnClickListener(this);
mViewPager.setOnPageChangeListener(new OnPageChangeListener()
{
@Override
public void onPageSelected(int arg0)
{
int currentItem = mViewPager.getCurrentItem();
resetImg();
switch (currentItem)
{
case 0:
mPersonInfoImg.setImageResource(R.drawable.back);
break;
case 1:
mCourseImg.setImageResource(R.drawable.back);
break;
case 2:
mExperienceImg.setImageResource(R.drawable.back);
break;
case 3:
mEvaluateImg.setImageResource(R.drawable.back);
break;
}
}
@Override
public void onPageScrolled(int arg0, float arg1, int arg2)
{
}
@Override
public void onPageScrollStateChanged(int arg0)
{
}
});
}
3、onclickイベント:現在表示されているページを設定する
@Override
public void onClick(View v) {
resetImg();
switch (v.getId())
{
case R.id.id_tab_personinfo:
mViewPager.setCurrentItem(0);
mPersonInfoImg.setImageResource(R.drawable.back);
break;
case R.id.id_tab_course:
mViewPager.setCurrentItem(1);
mCourseImg.setImageResource(R.drawable.back);
break;
case R.id.id_tab_workexperience:
mViewPager.setCurrentItem(2);
mExperienceImg.setImageResource(R.drawable.back);
break;
case R.id.id_tab_evaluate:
mViewPager.setCurrentItem(3);
mEvaluateImg.setImageResource(R.drawable.back);
break;
default:
break;
}
}
4、onCreateイベントでスレッドを起動する
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.teacher_main);
initView();
initEvents();
}
携帯電話のスライドスクリーンは実は簡単で、アダプタを利用して私たちのサブページを盛って、それから事件を傍受して現在のページを表示します.