一、布局
- activity_main：
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:orientation="vertical"
tools:context="com.example.ttt.wechattest.MainActivity">
<android.support.v4.view.ViewPager
android:id="@+id/view_pager"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#51bebebe"/>
<RadioGroup
android:id="@+id/radio_group"
android:layout_width="match_parent"
android:layout_height="60dp"
android:gravity="center"
android:orientation="horizontal">
<RadioButton
android:id="@+id/chat"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="微信"
// 文字上部图片
android:drawableTop="@drawable/chat_selector"
android:textSize="14sp"
android:textColor="@drawable/color_selector"
android:gravity="center"
// 取消自动添加的小圆点按钮
android:button="@null"
android:checked="true" />
<RadioButton
android:id="@+id/contacts"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="通讯录"
android:drawableTop="@drawable/contacts_selector"
android:textSize="14sp"
android:textColor="@drawable/color_selector"
android:gravity="center"
android:button="@null" />
<RadioButton
android:id="@+id/discovery"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="发现"
android:drawableTop="@drawable/discovery_selector"
android:textSize="14sp"
android:textColor="@drawable/color_selector"
android:gravity="center"
android:button="@null" />
<RadioButton
android:id="@+id/me"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="我"
android:drawableTop="@drawable/me_selector"
android:textSize="14sp"
android:textColor="@drawable/color_selector"
android:gravity="center"
android:button="@null"/>
</RadioGroup>
</LinearLayout>
- view_chat:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#66999999">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="微信"
android:textSize="30sp"/>
</RelativeLayout>
- view_contacts:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#66999999">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="通讯录"
android:textSize="30sp"/>
</RelativeLayout>
- view_discovery:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#66999999">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="发现"
android:textSize="30sp"/>
</RelativeLayout>
- view_me:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#66999999">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="我"
android:textSize="30sp"/>
</RelativeLayout>
二、代码
package com.example.ttt.wechattest;
import android.support.v4.app.Fragment;
import android.os.Bundle;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.widget.RadioGroup;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends AppCompatActivity {
private ViewPager viewPager;
private RadioGroup radioGroup;
private List<Fragment> fragmentList=new ArrayList<>();
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
viewPager=(ViewPager)findViewById(R.id.view_pager);
radioGroup=(RadioGroup)findViewById(R.id.radio_group);
ChatFragment chatFragment=new ChatFragment();
ContactsFragment contactsFragment=new ContactsFragment();
DiscoveryFragment discoveryFragment=new DiscoveryFragment();
MeFragment meFragment=new MeFragment();
fragmentList.add(chatFragment);
fragmentList.add(contactsFragment);
fragmentList.add(discoveryFragment);
fragmentList.add(meFragment);
viewPager.setAdapter(new MyFragmentPagerAdapter(getSupportFragmentManager(),fragmentList));
// ViewPager页面切换监听
viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
@Override
public void onPageSelected(int position) {
switch (position){
case 0:
radioGroup.check(R.id.chat);
break;
case 1:
radioGroup.check(R.id.contacts);
break;
case 2:
radioGroup.check(R.id.discovery);
break;
case 3:
radioGroup.check(R.id.me);
break;
default:
break;
}
}
@Override
public void onPageScrollStateChanged(int state) {
}
});
// RadioGroup选中状态改变监听
radioGroup.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(RadioGroup group, int checkedId) {
switch (checkedId){
case R.id.chat:
/**
* setCurrentItem第二个参数控制页面切换动画
* true:打开/false:关闭
*/
viewPager.setCurrentItem(0);
break;
case R.id.contacts:
viewPager.setCurrentItem(1);
break;
case R.id.discovery:
viewPager.setCurrentItem(2);
break;
case R.id.me:
viewPager.setCurrentItem(3);
break;
default:
break;
}
}
});
}
}
MyFragmentPagerAdapter：
package com.example.ttt.wechattest;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import java.util.List;
public class MyFragmentPagerAdapter extends FragmentPagerAdapter{
private List<Fragment> list;
public MyFragmentPagerAdapter(FragmentManager fm, List<Fragment> list){
super(fm);
this.list=list;
}
@Override
public Fragment getItem(int position) {
return list.get(position);
}
@Override
public int getCount() {
return list.size();
}
}
ChatFragment：（其他三个类似）
package com.example.ttt.wechattest;
import android.support.v4.app.Fragment;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
public class ChatFragment extends Fragment{
public ChatFragment(){
}
@Nullable
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
return inflater.inflate(R.layout.view_chat,container,false);
}
}
三、drawable 文件夹
- chat_selector
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:drawable="@mipmap/chat_press"/>
<item android:state_checked="false" android:drawable="@mipmap/chat_normal"/>
</selector>
- contacts_selector
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:drawable="@mipmap/contacts_press"/>
<item android:state_checked="false" android:drawable="@mipmap/contacts_normal"/>
</selector>
- discovery_selector
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:drawable="@mipmap/discovery_press"/>
<item android:state_checked="false" android:drawable="@mipmap/discovery_normal"/>
</selector>
- me_selector
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:drawable="@mipmap/me_press"/>
<item android:state_checked="false" android:drawable="@mipmap/me_normal"/>
</selector>
- color_selector
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:color="@color/green"/>
<item android:state_checked="false" android:color="@color/gray"/>
</selector>
四、效果
- 可拖动也可点击图标翻页。
