
1、在主页面(activity引用Fragment )的布局文件中定义FrameLayout ,加载Fragment
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/fl_content"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</FrameLayout>
2、初始化Fragment
private void initFragment() {
// Fragment管理器
FragmentManager fm = getSupportFragmentManager();
FragmentTransaction transaction = fm.beginTransaction();// 开始事务
// 将帧布局替换为对应的Fragment
transaction
.replace(R.id.fl_content, new ContentFragment(), TAG_CONTENT);
transaction.replace(R.id.fl_left_menu, new LeftMenuFragment(),
TAG_LEFT_MENU);
transaction.commit();// 提交事务
// fm.findFragmentByTag(TAG_CONTENT);
}
3、定义Fragment基类
public abstract class BaseFragment extends Fragment { public Activity mActivity; // Fragment被创建
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
mActivity = getActivity();// 获取所在的activity对象
} // 初始化Fragment布局
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View view = initView();
return view;
} // activity创建结束
@Override
public void onActivityCreated(Bundle savedInstanceState) {
super.onActivityCreated(savedInstanceState);
initData();
} /**
* 初始化布局, 子类必须实现
*/
public abstract View initView(); /**
* 初始化数据, 子类可以不实现
*/
public void initData() { }
}
4、定义下方菜单
<?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" /> <RadioGroup
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/bottom_tab_bg"
android:gravity="center"
android:orientation="horizontal" > <RadioButton
android:id="@+id/rb_home"
style="@style/BottomTabStyle"
android:drawableTop="@drawable/btn_home_selector"
android:checked="true"
android:text="首页" /> <RadioButton
android:id="@+id/rb_news"
style="@style/BottomTabStyle"
android:drawableTop="@drawable/btn_news_selector"
android:text="新闻中心" /> <RadioButton
android:id="@+id/rb_smart"
style="@style/BottomTabStyle"
android:drawableTop="@drawable/btn_smart_selector"
android:text="智慧服务" /> <RadioButton
android:id="@+id/rb_gov"
style="@style/BottomTabStyle"
android:drawableTop="@drawable/btn_gov_selector"
android:text="政务" /> <RadioButton
android:id="@+id/rb_setting"
style="@style/BottomTabStyle"
android:drawableTop="@drawable/btn_setting_selector"
android:text="设置" />
</RadioGroup> </LinearLayout>
布局文件
<resources> <!--
Base application theme, dependent on API level. This theme is replaced
by AppBaseTheme from res/values-vXX/styles.xml on newer devices. -->
<style name="AppBaseTheme" parent="android:Theme.Light">
<!--
Theme customizations available in newer API levels can go in
res/values-vXX/styles.xml, while customizations related to
backward-compatibility can go here. -->
</style> <!-- Application theme. -->
<style name="AppTheme" parent="AppBaseTheme">
<!-- All customizations that are NOT specific to a particular API-level can go here. -->
</style> <style name="BottomTabStyle">
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:layout_weight">1</item>
<item name="android:button">@null</item>
<item name="android:gravity">center</item>
<item name="android:padding">5dp</item>
<item name="android:drawablePadding">3dp</item>
<item name="android:textColor">@color/txt_bottom_tab_selector</item>
</style> </resources>
样式文件
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@drawable/home_press" android:state_checked="true"></item>
<item android:drawable="@drawable/home"></item> </selector>
selector
5、定义Fragment
利用XUtils findViewById
ViewUtils使用方法 完全注解方式就可以进行UI绑定和事件绑定。
无需findViewById和setClickListener等。
// xUtils的view注解要求必须提供id,以使代码混淆不受影响。
@ViewInject(R.id.textView)
TextView textView; //@ViewInject(vale=R.id.textView, parentId=R.id.parentView)
//TextView textView; @ResInject(id = R.string.label, type = ResType.String)
private String label; // 取消了之前使用方法名绑定事件的方式,使用id绑定不受混淆影响
// 支持绑定多个id @OnClick({R.id.id1, R.id.id2, R.id.id3})
// or @OnClick(value={R.id.id1, R.id.id2, R.id.id3}, parentId={R.id.pid1, R.id.pid2, R.id.pid3})
// 更多事件支持参见ViewCommonEventListener类和包com.lidroid.xutils.view.annotation.event。
@OnClick(R.id.test_button)
public void testButtonClick(View v) { // 方法签名必须和接口中的要求一致
...
}
...
//在Activity中注入:
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
ViewUtils.inject(this); //注入view和事件
...
textView.setText("some text...");
...
}
//在Fragment中注入:
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.bitmap_fragment, container, false); // 加载fragment布局
ViewUtils.inject(this, view); //注入view和事件
...
}
//在PreferenceFragment中注入:
public void onActivityCreated(Bundle savedInstanceState) {
super.onActivityCreated(savedInstanceState);
ViewUtils.inject(this, getPreferenceScreen()); //注入view和事件
...
}
// 其他重载
// inject(View view);
// inject(Activity activity)
// inject(PreferenceActivity preferenceActivity)
// inject(Object handler, View view)
// inject(Object handler, Activity activity)
// inject(Object handler, PreferenceGroup preferenceGroup)
// inject(Object handler, PreferenceActivity preferenceActivity)
xutils
public class ContentFragment extends BaseFragment { @ViewInject(R.id.vp_content)
private ViewPager mViewPager; private ArrayList<BasePager> mPagers; @Override
public View initView() {
View view = View.inflate(mActivity, R.layout.fragment_content, null);
ViewUtils.inject(this, view); // 注入view和事件
// mViewPager = (ViewPager) view.findViewById(R.id.vp_content);
return view;
} @Override
public void initData() {
// 初始化5个标签页面
mPagers = new ArrayList<BasePager>();
mPagers.add(new HomePager(mActivity));
mPagers.add(new NewsCenterPager(mActivity));
mPagers.add(new SmartServicePager(mActivity));
mPagers.add(new GovAffairsPager(mActivity));
mPagers.add(new SettingPager(mActivity)); mViewPager.setAdapter(new ContentAdapter());
} class ContentAdapter extends PagerAdapter { @Override
public int getCount() {
return mPagers.size();
} @Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
} @Override
public Object instantiateItem(ViewGroup container, int position) {
BasePager pager = mPagers.get(position);
container.addView(pager.mRootView);// 将页面布局添加到容器中
pager.initData();//初始化数据
return pager.mRootView;
} @Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View) object);
} } }
ContentFragment
6、定义ViewPager页面
<?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/title_bar" /> <FrameLayout
android:id="@+id/fl_content"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</FrameLayout> </LinearLayout>
layout/base_pager.xml
<?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="wrap_content"
android:background="@drawable/title_red_bg" > <TextView
android:id="@+id/tv_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="标题"
android:textColor="#fff"
android:textSize="22sp" /> <ImageButton
android:id="@+id/btn_menu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:background="@null"
android:src="@drawable/img_menu" /> </RelativeLayout>
layout/title_bar.xml
public abstract class BasePager { public Activity mActivity; public View mRootView; public TextView tvTitle;
public ImageButton btnMenu;
public FrameLayout flContent; public BasePager(Activity activity) {
mActivity = activity;
initView();
} /**
* 初始化布局
*/
public void initView() {
mRootView = View.inflate(mActivity, R.layout.base_pager, null);
tvTitle = (TextView) mRootView.findViewById(R.id.tv_title);
btnMenu = (ImageButton) mRootView.findViewById(R.id.btn_menu);
flContent = (FrameLayout) mRootView.findViewById(R.id.fl_content);
} /**
* 初始化数据
*/
public abstract void initData();
}
BasePager
public class NewsCenterPager extends BasePager { public NewsCenterPager(Activity activity) {
super(activity);
} @Override
public void initData() {
tvTitle.setText("新闻"); TextView view = new TextView(mActivity);
view.setText("新闻中心");
view.setTextColor(Color.RED);
view.setTextSize(22);
view.setGravity(Gravity.CENTER); flContent.addView(view);
} }
NewsCenterPager
public class SettingPager extends BasePager { public SettingPager(Activity activity) {
super(activity);
} @Override
public void initData() {
tvTitle.setText("设置"); TextView view = new TextView(mActivity);
view.setText("设置");
view.setTextColor(Color.RED);
view.setTextSize(22);
view.setGravity(Gravity.CENTER); flContent.addView(view);
} }
SettingPager