主界面
本项目导入的是 v4 包的Fragment
package com.gaoo.tab04;
import com.viewpagerindicator.TabPageIndicator;
import java.util.List;
/**
* 使用 ViewPagerIndicator + FragmentPagerAdapter 实现 tab 切换
* //导入 Indicator_library
*/
public class MainActivity extends FragmentActivity {
private ViewPager mViewPager; //viewpager
TabPageIndicator mTabPageIndicator; //指示器
List<Fragment> mFragmentList; //数据源,类型是 Fragment
private TabAdapter mAdapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_main);
initView();
}
private void initView() {
mViewPager = (ViewPager) findViewById(R.id.id_viewPager);
mTabPageIndicator = (TabPageIndicator) findViewById(R.id.id_indicator);
mAdapter = new TabAdapter(getSupportFragmentManager());
mViewPager.setAdapter(mAdapter);
mTabPageIndicator.setViewPager(mViewPager,0); //设置默认选中页
}
}
Adapter 继承自 FragmentPagerAdapter
实现了2个方法和另外一个 getPageTitle(int position) 方法.
package com.gaoo.tab04;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
/**
* 指示器的 适配器 adapter
*/
public class TabAdapter extends FragmentPagerAdapter {
public static String[] TITLES = new String[]{"金系掌门","木系掌门","土系掌门","水系","火系"};
public TabAdapter(FragmentManager fm) {
super(fm);
}
@Override
public Fragment getItem(int position) {
TabFragment tabFragment = new TabFragment(position); //在这里把 position传入 是为了不同的位置显示不同的标题
return tabFragment;
}
@Override
public int getCount() {
return TITLES.length;
}
@Override
public CharSequence getPageTitle(int position) {
return TITLES[position];
}
}
Fragment
/**
* Fragment的内容区域
*/
public class TabFragment extends Fragment {
public TabFragment() { }
private int pos;
public TabFragment(int position) {
this.pos = position;
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.frag, null);
TextView tv = (TextView) view.findViewById(R.id.id_text);
tv.setText(TabAdapter.TITLES[pos]);
return view;
}
}
布局文件 activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<include layout="@layout/top"/>
<com.viewpagerindicator.TabPageIndicator
android:id="@+id/id_indicator"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@android:color/transparent">
</com.viewpagerindicator.TabPageIndicator>
<android.support.v4.view.ViewPager
android:id="@+id/id_viewPager"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v4.view.ViewPager>
</LinearLayout>
顶部布局 top.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="48dp"
android:background="#51badd"
android:orientation="horizontal">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="3dp"
android:background="@drawable/logo"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginLeft="3dp"
android:text="大运河"
android:textColor="#ebeceaea"
android:textSize="20sp"/>
</LinearLayout>
项目中需要用到 library_viewpagerindicator 类库
源码下载地址:
链接:
http://pan.baidu.com/s/1c2iaxBq
密码:522p
项目运行效果图
版权声明:本文为blueshell001原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。