您的位置:首页 > 移动开发 > 微信开发

Android中ViewPager常用功能3----仿微信既能点击又能滑动的选项卡

2017-07-26 13:23 411 查看
效果图:
MainActivity中

package com.example.viewpagertest4;

import android.app.Activity;
import android.graphics.Color;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.TextView;

import java.util.ArrayList;
import java.util.List;

/**
* viewPager结合Fragment
* 实现既能点击又能滑动的选项卡,仿微信
* 这里要继承的FragmentActivity
*/
public class MainActivity extends FragmentActivity {
//  viewPager
private ViewPager viewPager;
private TextView tvPage1;
private TextView tvPage2;
private TextView tvPage3;
private TextView tvPage4;
//  存放下面4个textView的list
private List<TextView>tvList;
//  存放fragment的list
private List<Fragment>fragmentList;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
myOnclick();
}
private void initView(){
tvPage1 = (TextView)findViewById(R.id.tvPage1);
tvPage2 = (TextView)findViewById(R.id.tvPage2);
tvPage3 = (TextView)findViewById(R.id.tvPage3);
tvPage4 = (TextView)findViewById(R.id.tvPage4);
tvList=new ArrayList<>();
tvList.add(tvPage1);
tvList.add(tvPage2);
tvList.add(tvPage3);
tvList.add(tvPage4);
fragmentList=new ArrayList<>();
Fragment01 fragment01=new Fragment01();
Fragment02 fragment02=new Fragment02();
Fragment03 fragment03=new Fragment03();
Fragment04 fragment04=new Fragment04();
fragmentList.add(fragment01);
fragmentList.add(fragment02);
fragmentList.add(fragment03);
fragmentList.add(fragment04);
//      初始化viewPager
viewPager = (ViewPager)findViewById(R.id.viewPager);
//      绑定适配器
MyPagerAdapter myPagerAdapter =new MyPagerAdapter(getSupportFragmentManager(),  fragmentList);
viewPager.setAdapter(myPagerAdapter);

}
private void myOnclick() {
//      监听事件
viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
//          这个方法会在屏幕滚动过程中不断被调用。
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

}
// 当前选择的页面
@Override
public void onPageSelected(int position) {
switch (position) {
case  0:
for (TextView textView  : tvList) {
textView.setTextColor(Color.parseColor("#CCCCCC"));
}
tvPage1.setTextColor(Color.parseColor("#FF3399"));
break;
case  1:
for (TextView textView  : tvList) {
textView.setTextColor(Color.parseColor("#CCCCCC"));
}
tvPage2.setTextColor(Color.parseColor("#FF3399"));
break;
case  2:
for (TextView textView  : tvList) {
textView.setTextColor(Color.parseColor("#CCCCCC"));
}
tvPage3.setTextColor(Color.parseColor("#FF3399"));
break;
case  3:
for (TextView textView  : tvList) {
textView.setTextColor(Color.parseColor("#CCCCCC"));
}
tvPage4.setTextColor(Color.parseColor("#FF3399"));
break;
}

}
//          这个方法在手指操作屏幕的时候发生变化。有三个值:0(END),1(PRESS) , 2(UP) 。
@Override
public void onPageScrollStateChanged(int state) {

}
});
//      page1点击事件
tvPage1.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//              滑到第一页
viewPager.setCurrentItem(0);
}
});
//      page2点击事件
tvPage2.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//              滑到第二页
viewPager.setCurrentItem(1);
}
});
//      tvPage3点击事件
tvPage3.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//              滑到第三页
viewPager.setCurrentItem(2);
}
});
//      tvPage4点击事件
tvPage4.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//              滑到第四页
viewPager.setCurrentItem(3);
}
});

}
// 绑定Fragment的适配器
class MyPagerAdapter extends FragmentPagerAdapter {

private List<Fragment> fragments;

public MyPagerAdapter(FragmentManager fm, List<Fragment> fragments) {
super(fm);
this.fragments = fragments;
}

@Override
public Fragment getItem(int i) {
return fragments.get(i);
}

@Override
public int getCount() {
return fragments.size();
}

}
}
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.viewpagertest4.MainActivity">
<android.support.v4.view.ViewPager
android:id="@+id/viewPager"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#FF66FF"
android:layout_marginBottom="50dp"
>
</android.support.v4.view.ViewPager>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:orientation="horizontal"
android:layout_alignParentBottom="true"
>
<TextView
android:id="@+id/tvPage1"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="page1"
android:textSize="16sp"
android:gravity="center"
android:textColor="#FF3399"
/>
<TextView
android:id="@+id/tvPage2"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="page2"
android:textSize="16sp"
android:gravity="center"
/>
<TextView
android:id="@+id/tvPage3"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="page3"
android:textSize="16sp"
android:gravity="center"
/>
<TextView
android:id="@+id/tvPage4"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="page4"
android:textSize="16sp"
android:gravity="center"
/>

</LinearLayout>

</RelativeLayout>
创建4个fragment,这里这些一个
Fragment01
package com.example.viewpagertest4;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

/**
* A simple {@link Fragment} subclass.
*/
public class Fragment01 extends Fragment {

public Fragment01() {
// Required empty public constructor
}

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Inflate the layout for this fragment
return inflater.inflate(R.layout.fragment_fragment01, container, false);
}

}
fragment_fragment01.xml
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.viewpagertest4.Fragment01">

<!-- TODO: Update blank fragment layout -->
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="第一页" />

</FrameLayout>
源码下载
ViewPadeDemo----viewpagertest4

http://download.csdn.net/detail/zhaihaohao1/9911113


                                            
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐