Android ViewPager Fragment实现选项卡

时间:2022-01-19 06:26:48

效果图:Android ViewPager Fragment实现选项卡

1.新建TestFragmen继承Fragment

 

public class TestFragment extends Fragment {
private static final String TAG = "TestFragment";
private String hello;// = "hello android";
private String defaultHello = "default value";
private Map<String, Object> maplist;
static TestFragment newInstance(String s, Map<String, Object> map) {
TestFragment newFragment = new TestFragment();
// Bundle bundle = new Bundle();
// bundle.putString("hello", s);
// newFragment.setArguments(bundle);

final SerializableMap myMap=new SerializableMap();
myMap.setMap(map);
Bundle bundle = new Bundle();



bundle.putSerializable("map", myMap);
newFragment.setArguments(bundle);
return newFragment;




}

@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
Log.d(TAG, "TestFragment-----onCreate");
Bundle args = getArguments();
// hello = args != null ? args.getString("hello") : defaultHello;



Bundle bundle = getArguments();
SerializableMap serializableMap = (SerializableMap) bundle.get("map");
maplist =serializableMap.getMap();

}

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {
Log.d(TAG, "TestFragment-----onCreateView");
View view = inflater.inflate(R.layout.lay1, container, false);



// TextView viewhello = (TextView) view.findViewById(R.id.tv_hello);
//viewhello.setText(maplist.get("userid")+"time");

ListView lv = (ListView) view.findViewById(R.id.listView3);
ContactAdapter hc = new ContactAdapter(getActivity().getApplicationContext(),getContact());
lv.setAdapter(hc);
lv.setCacheColorHint(0);

return view;

}
private ArrayList<Contact> getContact(){
ArrayList<Contact> hcList = new ArrayList<Contact>();

for(int i=0;i<10;i++)
{
Contact c0 = new Contact();
c0.setTxPath(R.drawable.more_game+"");

c0.setName(maplist.get("userid")+" 年龄:"+maplist.get("age"));
hcList.add(c0);
}



return hcList;
}

@Override
public void onDestroy() {
super.onDestroy();
Log.d(TAG, "TestFragment-----onDestroy");
}

}


2.MyFragmentPagerAdapter继承FragmentPagerAdapter

public class MyFragmentPagerAdapter extends FragmentPagerAdapter {
private ArrayList<Fragment> fragmentsList;

public MyFragmentPagerAdapter(FragmentManager fm) {
super(fm);
}

public MyFragmentPagerAdapter(FragmentManager fm, ArrayList<Fragment> fragments) {
super(fm);
this.fragmentsList = fragments;
}

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

@Override
public Fragment getItem(int arg0) {
return fragmentsList.get(arg0);
}

@Override
public int getItemPosition(Object object) {
return super.getItemPosition(object);
}

}
3.MainActivity 要继承FragmentActivity

public class MainActivity extends FragmentActivity {
private static final String TAG = "MainActivity";
private ViewPager mPager;
private ArrayList<Fragment> fragmentsList;
private ImageView ivBottomLine;
private TextView tvTabActivity, tvTabGroups, tvTabFriends, tvTabChat;

private int currIndex = 0;
private int bottomLineWidth;
private int offset = 0;
private int position_one;
private int position_two;
private int position_three;
private Resources resources;

@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.main);
resources = getResources();
InitWidth();
InitTextView();
InitViewPager();
}

private void InitTextView() {
tvTabActivity = (TextView) findViewById(R.id.tv_tab_activity);
tvTabGroups = (TextView) findViewById(R.id.tv_tab_groups);
tvTabFriends = (TextView) findViewById(R.id.tv_tab_friends);
tvTabChat = (TextView) findViewById(R.id.tv_tab_chat);

tvTabActivity.setOnClickListener(new MyOnClickListener(0));
tvTabGroups.setOnClickListener(new MyOnClickListener(1));
tvTabFriends.setOnClickListener(new MyOnClickListener(2));
tvTabChat.setOnClickListener(new MyOnClickListener(3));
}

private void InitViewPager() {
mPager = (ViewPager) findViewById(R.id.vPager);
fragmentsList = new ArrayList<Fragment>();

Map<String, Object> paramMap = new HashMap<String, Object>();
paramMap.put("userid","小洪");
paramMap.put("age",23);


Map<String, Object> paramMap2 = new HashMap<String, Object>();
paramMap2.put("userid","vatty");
paramMap2.put("age",24);

Map<String, Object> paramMap3 = new HashMap<String, Object>();
paramMap3.put("userid","小明");
paramMap3.put("age",25);


Map<String, Object> paramMap4 = new HashMap<String, Object>();
paramMap4.put("userid","hongshengpeng.com");
paramMap4.put("age",26);


Fragment activityfragment = TestFragment.newInstance("Hello Activity.",paramMap);
Fragment groupFragment = TestFragment.newInstance("Hello Group.",paramMap2);
Fragment friendsFragment=TestFragment.newInstance("Hello Friends.",paramMap3);
Fragment chatFragment=TestFragment.newInstance("Hello Chat.",paramMap4);

fragmentsList.add(activityfragment);
fragmentsList.add(groupFragment);
fragmentsList.add(friendsFragment);
fragmentsList.add(chatFragment);

mPager.setAdapter(new MyFragmentPagerAdapter(getSupportFragmentManager(), fragmentsList));
mPager.setCurrentItem(0);
mPager.setOnPageChangeListener(new MyOnPageChangeListener());
}

private void InitWidth() {
ivBottomLine = (ImageView) findViewById(R.id.iv_bottom_line);
bottomLineWidth = ivBottomLine.getLayoutParams().width;
Log.d(TAG, "cursor imageview width=" + bottomLineWidth);
DisplayMetrics dm = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(dm);
int screenW = dm.widthPixels;
offset = (int) ((screenW / 4.0 - bottomLineWidth) / 2);
Log.i("MainActivity", "offset=" + offset);

position_one = (int) (screenW / 4.0);
position_two = position_one * 2;
position_three = position_one * 3;
}

public class MyOnClickListener implements View.OnClickListener {
private int index = 0;

public MyOnClickListener(int i) {
index = i;
}

@Override
public void onClick(View v) {
mPager.setCurrentItem(index);
}
};

public class MyOnPageChangeListener implements OnPageChangeListener {

@Override
public void onPageSelected(int arg0) {
Animation animation = null;
switch (arg0) {
case 0:
if (currIndex == 1) {
animation = new TranslateAnimation(position_one, 0, 0, 0);
tvTabGroups.setTextColor(resources.getColor(R.color.lightwhite));
} else if (currIndex == 2) {
animation = new TranslateAnimation(position_two, 0, 0, 0);
tvTabFriends.setTextColor(resources.getColor(R.color.lightwhite));
} else if (currIndex == 3) {
animation = new TranslateAnimation(position_three, 0, 0, 0);
tvTabChat.setTextColor(resources.getColor(R.color.lightwhite));
}
tvTabActivity.setTextColor(resources.getColor(R.color.white));
break;
case 1:
if (currIndex == 0) {
animation = new TranslateAnimation(0, position_one, 0, 0);
tvTabActivity.setTextColor(resources.getColor(R.color.lightwhite));
} else if (currIndex == 2) {
animation = new TranslateAnimation(position_two, position_one, 0, 0);
tvTabFriends.setTextColor(resources.getColor(R.color.lightwhite));
} else if (currIndex == 3) {
animation = new TranslateAnimation(position_three, position_one, 0, 0);
tvTabChat.setTextColor(resources.getColor(R.color.lightwhite));
}
tvTabGroups.setTextColor(resources.getColor(R.color.white));
break;
case 2:
if (currIndex == 0) {
animation = new TranslateAnimation(0, position_two, 0, 0);
tvTabActivity.setTextColor(resources.getColor(R.color.lightwhite));
} else if (currIndex == 1) {
animation = new TranslateAnimation(position_one, position_two, 0, 0);
tvTabGroups.setTextColor(resources.getColor(R.color.lightwhite));
} else if (currIndex == 3) {
animation = new TranslateAnimation(position_three, position_two, 0, 0);
tvTabChat.setTextColor(resources.getColor(R.color.lightwhite));
}
tvTabFriends.setTextColor(resources.getColor(R.color.white));
break;
case 3:
if (currIndex == 0) {
animation = new TranslateAnimation(0, position_three, 0, 0);
tvTabActivity.setTextColor(resources.getColor(R.color.lightwhite));
} else if (currIndex == 1) {
animation = new TranslateAnimation(position_one, position_three, 0, 0);
tvTabGroups.setTextColor(resources.getColor(R.color.lightwhite));
} else if (currIndex == 2) {
animation = new TranslateAnimation(position_two, position_three, 0, 0);
tvTabFriends.setTextColor(resources.getColor(R.color.lightwhite));
}
tvTabChat.setTextColor(resources.getColor(R.color.white));
break;
}
currIndex = arg0;
animation.setFillAfter(true);
animation.setDuration(300);
ivBottomLine.startAnimation(animation);
}

@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
}

@Override
public void onPageScrollStateChanged(int arg0) {
}
}
}

4.分别新建lay1.xml、 lay2.xml 、lay3.xml

   lay1.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#fff"
android:orientation="vertical" >

<TextView
android:id="@+id/tv_hello"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView"
android:visibility="gone" />

<ListView
android:id="@+id/listView3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:cacheColorHint="@android:color/transparent"
android:divider="@drawable/reader_item_divider"
android:listSelector="@android:color/transparent" >
</ListView>

</LinearLayout>

lay2.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#FF8684" >


</LinearLayout>

lay3.xml与lay2.xml类型

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#1586FF" >


</LinearLayout>

main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:umadsdk="http://schemas.android.com/apk/res/com.LoveBus"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
>

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"

android:orientation="vertical" >

<LinearLayout
android:layout_width="match_parent"
android:layout_height="48dip"
android:background="@drawable/android_title_bg" >

<ImageView
android:id="@+id/imageView1"
android:layout_width="36dip"
android:layout_height="36dip"
android:layout_gravity="center_vertical"
android:layout_marginLeft="10dip"
android:src="@drawable/more_game"
/>

<TextView
android:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginLeft="10dip"
android:text="乐够GO"
android:textAppearance="?android:attr/textAppearanceLarge" />

<ImageView
android:id="@+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:paddingLeft="10dip"
android:src="@drawable/status_online"
android:visibility="gone" />
</LinearLayout>

<LinearLayout
android:id="@+id/linearLayout1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingBottom="5dip"
android:paddingTop="10dip"
android:background="@color/coral">

<TextView
android:id="@+id/tv_tab_activity"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1.0"
android:gravity="center"
android:text="@string/tab_1"
android:textColor="@color/white"
android:textSize="18sp" />

<TextView
android:id="@+id/tv_tab_groups"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1.0"
android:gravity="center"
android:text="@string/tab_2"
android:textColor="@color/lightwhite"
android:textSize="18sp" />

<TextView
android:id="@+id/tv_tab_friends"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1.0"
android:gravity="center"
android:text="@string/tab_3"
android:textColor="@color/lightwhite"
android:textSize="18sp" />

<TextView
android:id="@+id/tv_tab_chat"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1.0"
android:gravity="center"
android:text="@string/tab_4"
android:textColor="@color/lightwhite"
android:textSize="18sp" />
</LinearLayout>

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:orientation="vertical"
android:paddingBottom="3dip" >

<ImageView
android:id="@+id/iv_bottom_line"
android:layout_width="40dip"
android:layout_height="2dip"
android:layout_marginLeft="20dip"
android:scaleType="matrix"
android:src="#fff" />
</LinearLayout>
</LinearLayout>

<android.support.v4.view.ViewPager
android:id="@+id/vPager"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1.0"
android:background="#000000"
android:flipInterval="30"
android:persistentDrawingCache="animation" />

</LinearLayout>


   源码程序下载

网站/android 交流群154950206