ViewPager+TabLayout
开发工具：Android Studio1.4
步骤：
效果预览
1. 自定义ListView适配器MyAdapter与其关联的子布局content.xml
content.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent">
<TextView android:id="@+id/tv" android:layout_width="match_parent" android:layout_height="100dp" />
</LinearLayout>MyAdapter
package com.app.listViewAdapter;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.TextView;
import java.util.List;
/** * Created by Administrator on 2016/4/28. */
public class MyAdapter extends ArrayAdapter<String> {
private int resourceId;
public MyAdapter(Context context, int resource, List<String> objects) {
super(context, resource, objects);
resourceId = resource;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
String content = getItem(position);
View view;
ViewHolder viewHolder;
if(convertView == null){
view = LayoutInflater.from(getContext()).inflate(resourceId,null);
viewHolder = new ViewHolder();
viewHolder.tv = (TextView) view.findViewById(R.id.tv);
view.setTag(viewHolder);
}else{
view = convertView;
viewHolder = (ViewHolder) view.getTag();
}
viewHolder.tv.setText(content);
return view;
}
class ViewHolder{
TextView tv;
}
}
2. 定义了四个碎片Fragment1、Fragment2、Fragment3、Fragment4
fragment1.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" >
<ListView android:id="@+id/wei_xin" android:layout_width="match_parent" android:layout_height="match_parent">
</ListView>
</LinearLayout>
Fragment1
package com.app.fragment;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ListView;
import com.app.listViewAdapter.MyAdapter;
import java.util.ArrayList;
import java.util.List;
/** * Created by Administrator on 2016/4/28. */
public class Fragment1 extends Fragment {
private ListView listView;
private MyAdapter adapter;
private List<String> item;
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment1,container,false);
initListView(view);
return view;
}
private void initListView(View view) {
listView = (ListView) view.findViewById(R.id.wei_xin);
item = new ArrayList<>();
item.add("1");
item.add("2");
item.add("3");
item.add("4");
item.add("5");
item.add("6");
item.add("7");
item.add("8");
adapter = new MyAdapter(getContext(),R.layout.content,item);
listView.setAdapter(adapter);
}
}
fragment2.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" >
<ListView android:id="@+id/contact" android:layout_width="match_parent" android:layout_height="match_parent">
</ListView>
</LinearLayout>
Fragment2
package com.app.fragment;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ListView;
import com.app.listViewAdapter.MyAdapter;
import java.util.ArrayList;
import java.util.List;
/** * Created by Administrator on 2016/4/28. */
public class Fragment2 extends Fragment {
private ListView listView;
private MyAdapter adapter;
private List<String> item;
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment2,container,false);
initListView(view);
return view;
}
private void initListView(View view) {
listView = (ListView) view.findViewById(R.id.contact);
item = new ArrayList<>();
item.add("1");
item.add("2");
item.add("3");
item.add("4");
item.add("5");
item.add("6");
item.add("7");
item.add("8");
adapter = new MyAdapter(getContext(),R.layout.content,item);
listView.setAdapter(adapter);
}
}
fragment3.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" >
<ListView android:id="@+id/found" android:layout_width="match_parent" android:layout_height="match_parent">
</ListView>
</LinearLayout>
Fragment3
package com.app.fragment;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ListView;
import com.app.listViewAdapter.MyAdapter;
import java.util.ArrayList;
import java.util.List;
/** * Created by Administrator on 2016/4/28. */
public class Fragment3 extends Fragment {
private ListView listView;
private MyAdapter adapter;
private List<String> item;
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment3,container,false);
initListView(view);
return view;
}
private void initListView(View view) {
listView = (ListView) view.findViewById(R.id.found);
item = new ArrayList<>();
item.add("1");
item.add("2");
item.add("3");
item.add("4");
item.add("5");
item.add("6");
item.add("7");
item.add("8");
adapter = new MyAdapter(getContext(),R.layout.content,item);
listView.setAdapter(adapter);
}
}
fragment4.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" >
<ListView android:id="@+id/me" android:layout_width="match_parent" android:layout_height="match_parent">
</ListView>
</LinearLayout>
Fragment4
package com.app.fragment;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ListView;
import com.app.listViewAdapter.MyAdapter;
import java.util.ArrayList;
import java.util.List;
/** * Created by Administrator on 2016/4/28. */
public class Fragment4 extends Fragment {
private ListView listView;
private MyAdapter adapter;
private List<String> item;
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment4,container,false);
initListView(view);
return view;
}
private void initListView(View view) {
listView = (ListView) view.findViewById(R.id.me);
item = new ArrayList<>();
item.add("1");
item.add("2");
item.add("3");
item.add("4");
item.add("5");
item.add("6");
item.add("7");
item.add("8");
adapter = new MyAdapter(getContext(),R.layout.content,item);
listView.setAdapter(adapter);
}
}
3. 在主布局activity_main.xml中引入了ViewPager、TabLayout控件
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"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical">
<android.support.v4.view.ViewPager
android:id="@+id/view_pager"
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="0dp">
</android.support.v4.view.ViewPager>
<android.support.design.widget.TabLayout
android:id="@+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="50dp"
app:tabIndicatorColor="#000000"
app:tabMode="fixed"
app:tabIndicatorHeight="0dp"
>
</android.support.design.widget.TabLayout>
</LinearLayout>
4. 完成MainActivity，注意继承FragmentActivity
MainActivity
package com.app;
import android.os.Bundle;
import android.support.design.widget.TabLayout;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import com.app.fragment.Fragment1;
import com.app.fragment.Fragment2;
import com.app.fragment.Fragment3;
import com.app.fragment.Fragment4;
import com.example.ww.R;
public class MainActivity extends FragmentActivity {
private ViewPager viewPager;
private TabLayout tabLayout;
private TabLayout.Tab tabOne;
private TabLayout.Tab tabTwo;
private TabLayout.Tab tabThree;
private TabLayout.Tab tabFour;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
initEvent();
}
private void initView() {
viewPager = (ViewPager) findViewById(R.id.view_pager);
tabLayout = (TabLayout) findViewById(R.id.tab_layout);
viewPager.setAdapter(new FragmentPagerAdapter(getSupportFragmentManager()) {
String[] mTitles = {"微信", "通信录", "发现", "我"};
@Override
public Fragment getItem(int position) {
switch (position) {
case 0:
return new Fragment1();
case 1:
return new Fragment2();
case 2:
return new Fragment3();
default:
return new Fragment4();
}
}
@Override
public int getCount() {
return mTitles.length;
}
@Override
public CharSequence getPageTitle(int position) {
return mTitles[position];
}
});
tabLayout.setupWithViewPager(viewPager);
}
private void initEvent() {
tabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
@Override
public void onTabSelected(TabLayout.Tab tab) {
if(tab == tabLayout.getTabAt(0)){
tab.setIcon(android.R.drawable.btn_star_big_on);
viewPager.setCurrentItem(0);
}else if(tab == tabLayout.getTabAt(1)){
tab.setIcon(android.R.drawable.btn_star_big_on);
viewPager.setCurrentItem(1);
}else if(tab == tabLayout.getTabAt(2)){
tab.setIcon(android.R.drawable.btn_star_big_on);
viewPager.setCurrentItem(2);
}else if(tab == tabLayout.getTabAt(3)){
tab.setIcon(android.R.drawable.btn_star_big_on);
viewPager.setCurrentItem(3);
}
}
@Override
public void onTabUnselected(TabLayout.Tab tab) {
tab.setIcon(android.R.drawable.btn_star_big_off);
}
@Override
public void onTabReselected(TabLayout.Tab tab) {
}
});
tabOne = tabLayout.getTabAt(0);
tabTwo = tabLayout.getTabAt(1);
tabThree = tabLayout.getTabAt(2);
tabFour = tabLayout.getTabAt(3);
tabOne.setIcon(android.R.drawable.btn_star_big_off);
tabTwo.setIcon(android.R.drawable.btn_star_big_off);
tabThree.setIcon(android.R.drawable.btn_star_big_off);
tabFour.setIcon(android.R.drawable.btn_star_big_off);
}
}