您的位置:首页 > 产品设计 > UI/UE

Android UI-实现底部切换标签之方式二 ──Activity(底部采用radioGroup+rutton)添加5个子fragment

2017-04-04 14:01 661 查看
此篇博客与http://blog.csdn.net/k2514091675/article/details/69053676类似,唯一区别是将主页面Fragment换成Activity

效果图如下



首先是布局文件

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">

<android.support.v4.view.ViewPager
android:id="@+id/vp_content"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">

</android.support.v4.view.ViewPager>

<RadioGroup
android:id="@+id/rg_content"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">

<RadioButton
android:id="@+id/rb_home"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:button="@null"
android:drawableTop="@mipmap/ic_launcher"
android:gravity="center"
android:textColor="#9b979a"
android:text="首页"/>

<RadioButton
android:id="@+id/rb_news"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:button="@null"
android:drawableTop="@mipmap/ic_launcher"
android:gravity="center"
android:textColor="#9b979a"
android:text="新闻"/>

<RadioButton
android:id="@+id/rb_setting"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:button="@null"
android:drawableTop="@mipmap/ic_launcher"
android:gravity="center"
android:textColor="#9b979a"
android:text="设置"/>
</RadioGroup>
</LinearLayout>


view_base_pager:

<?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">

<!--标题-->

<include layout="@layout/view_pager_title"/>

<!--内容-->
<FrameLayout
android:id="@+id/fl_pager_content"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout>


view+pager_title:

<?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="45dp"
android:background="#9b979a">

<TextView
android:id="@+id/tv_head_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="标题"
android:textColor="#fff"
android:textSize="20sp"
android:layout_centerInParent="true"
/>
</RelativeLayout>


写好子Fragment的基类,提高代码的复用性

public abstract class BasePager {
public Context mContext;
public final View rootView;
private final FrameLayout mFlContent;
public final TextView tvTitle;

public BasePager(final Context mContext) {
this.mContext = mContext;
rootView = View.inflate(mContext, R.layout.view_base_pager, null);
tvTitle = (TextView) rootView.findViewById(R.id.tv_head_title);
mFlContent = (FrameLayout) rootView.findViewById(R.id.fl_pager_content);
mFlContent.addView(initView());
}

public abstract View initView();

public void initData() {

}
}


子Fragment,此处只列举一个,其它两个类似
public class HomePager extends BasePager {
public HomePager(Context mContext) {
super(mContext);
}

@Override
public View initView() {
TextView tv=new TextView(mContext);
tv.setText("首页");
tv.setGravity(Gravity.CENTER);
tv.setTextSize(17);
return  tv;
}

@Override
public void initData() {

tvTitle.setText("首页");
}
}


将子Fragment添加到MainActivity

public class MainActivity extends AppCompatActivity {

private ViewPager vpMain;
private RadioGroup rgMain;
private List<BasePager> pagers = new ArrayList<BasePager>();

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
vpMain = (ViewPager) findViewById(R.id.vp_content);
rgMain = (RadioGroup) findViewById(R.id.rg_content);
pagers.add(new HomePager(getApplicationContext()));
pagers.add(new NewsPager(getApplicationContext()));
pagers.add(new SettingPager(getApplicationContext()));
MainAdapter adapter = new MainAdapter();
vpMain.setAdapter(adapter);
initEvent();

}

private void initEvent() {

rgMain.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(RadioGroup radioGroup, @IdRes int checkId) {
switch (checkId) {
case R.id.rb_home:
vpMain.setCurrentItem(0);
break;

case R.id.rb_news:
vpMain.setCurrentItem(1);
break;

case R.id.rb_setting:
vpMain.setCurrentItem(2);
break;
}
}
});
vpMain.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

}

@Override
public void onPageSelected(int position) {
BasePager basePager = pagers.get(position);
basePager.initData();
}

@Override
public void onPageScrollStateChanged(int state) {

}
});
}

public class MainAdapter extends PagerAdapter {

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

@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}

@Override
public Object instantiateItem(ViewGroup container, int position) {
BasePager basePager = pagers.get(position);
container.addView(basePager.rootView);
return basePager.rootView;
}

@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View) object);
}
}

}


完成!!!

Demo下载地址:http://download.csdn.net/detail/k2514091675/9803221
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: