android ViewPager实现App主界面Tab菜单页面切换和点击事件

最新推荐文章于 2024-07-12 20:42:27 发布

双斜杠少年

最新推荐文章于 2024-07-12 20:42:27 发布

阅读量7.1k

点赞数

分类专栏： 1.android 文章标签： android viewpager

本文链接：https://blog.csdn.net/u012373815/article/details/47701209

版权

1.android 专栏收录该内容

38 篇文章 2 订阅

订阅专栏

Tabhost实现页面滑动切换比较麻烦，这里介绍一下viewPage 控件。

实现了三屏滑动带标题点击和tab页面内按钮的的点击事件实现；

viewPage 的优点是可以滑动切换缺点是MainActivity 代码冗余。

关于其他的实现方式可以参考我的其他博客

Fragment实现APP主界面Tab页面切换和点击事件

viewpager+FragmentAdapter实现App主界面Tab

效果图关于下边的三个标题我是写了3个textview 大家可以改进为3个LinearLayout 布局在布局中加入imageview 就变成了有图标有文字的底部菜单了这里我就不写了

源代码我已经上传了资源页下载请去（免积分）

http://download.csdn.net/detail/u012373815/9012723

import java.util.ArrayList;

import java.util.List;

import android.os.Bundle;

import android.app.Activity;

import android.content.Context;

import android.support.v4.view.PagerAdapter;

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.view.ViewGroup;

import android.widget.TextView;

importandroid.widget.Toast;

publicclassMainActivityextends Activityimplements OnClickListener {

Contextcontext=null;

ViewPagerpager=null;

TextViewt1,t2,t3;

Viewview1,view2,view3;

@Override

publicvoid onCreate(BundlesavedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

context = MainActivity.this;

initTextView();

initPagerViewer();

}

/**

* 初始化标题

privatevoid initTextView() {

t1 = (TextView)findViewById(R.id.text1);

t2 = (TextView)findViewById(R.id.text2);

t3 = (TextView)findViewById(R.id.text3);

t1.setOnClickListener(this);

t2.setOnClickListener(this);

t3.setOnClickListener(this);

}

/**

* 初始化PageViewer

privatevoid initPagerViewer() {

pager = (ViewPager)findViewById(R.id.viewpage);

LayoutInflaterli = LayoutInflater.from(this);

final ArrayList<View>list =newArrayList<View>();

view1 = li.inflate(R.layout.tab1,null);

view2 = li.inflate(R.layout.tab2,null);

view3 = li.inflate(R.layout.tab3,null);

list.add(view1);

list.add(view2);

list.add(view3);

pager.setAdapter(new MyPagerAdapter(list));

pager.setCurrentItem(0);

pager.setOnPageChangeListener(newMyOnPageChangeListener());

}

/**

* Pager适配器

publicclass MyPagerAdapterextends PagerAdapter {

List<View>list=newArrayList<View>();

publicMyPagerAdapter(ArrayList<View> list) {

this.list = list;

}

@Override

publicvoid destroyItem(ViewGroupcontainer,intposition, Object object) {//销毁view

ViewPagerpViewPager = ((ViewPager) container);

pViewPager.removeView(list.get(position));

}

@Override

publicboolean isViewFromObject(Viewarg0, Object arg1) {

return arg0 == arg1;

}

@Override

publicint getCount() {

returnlist.size();

}

@Override

public ObjectinstantiateItem(View arg0,int arg1) {//初始化Item

//通过位置arg1拿到view

ViewPagerpViewPager = ((ViewPager) arg0);

pViewPager.addView(list.get(arg1));

returnlist.get(arg1);

}

/**

* 页卡切换监听

publicclass MyOnPageChangeListenerimplementsOnPageChangeListener {

@Override

publicvoid onPageSelected(int arg0) {//通过view的位置来更改按钮的text

resert();

int currentItems =pager.getCurrentItem();

switch (currentItems) {

case 0:

t1.setText("选中");

break;

case 1:

t2.setText("选中");

break;

case 2:

t3.setText("选中");

break;

default:

break;

}

@Override

publicvoidonPageScrollStateChanged(int arg0) {

}

@Override

publicvoid onPageScrolled(int arg0,float arg1, int arg2) {

}

// 点击按钮

publicvoid button2(View v) {

Toast.makeText(this,"点击了我", Toast.LENGTH_SHORT).show();

}

@Override

publicvoid onClick(View v) {

resert();

//TODO Auto-generated method stub

switch (v.getId()) {

case R.id.text1:

pager.setCurrentItem(0);

t1.setText("选中");

break;

case R.id.text2:

pager.setCurrentItem(1);

t2.setText("选中");

break;

case R.id.text3:

pager.setCurrentItem(2);

t3.setText("选中");

break;

}

//初始化按钮的选中情况

publicvoid resert()

{

t1.setText("标题1");

t2.setText("标题2");

t3.setText("标题3");

}

activity_main.xml 文件如下关于下边的三个标题我们可以改进为3个LinearLayout 布局在布局中加入image 就变成了有图标有文字的底部菜单了这里我就不写了（android:layout_height="0dp"android:layout_weight="1"）就是占用屏幕剩余的高度

<?xmlversion="1.0"encoding="utf-8"?>

<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:background="#EEEEEE"

android:orientation="vertical">

<LinearLayout

android:layout_width="wrap_content"

android:layout_height="0dp"

android:layout_weight="1"

android:orientation="vertical">

<android.support.v4.view.ViewPager