Android知识点九(ViewPager + Fragment 实现底部菜单栏)

来源:互联网 发布:农村淘宝招聘司机吗 编辑:程序博客网 时间:2024/05/22 01:50

  1.common_title_layout.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="@dimen/common_title_bar_height"    android:background="#FA3E63" >    <ImageButton        android:id="@+id/left_ib"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_alignParentLeft="true"        android:layout_centerVertical="true"        android:layout_marginLeft="10dp"        android:background="@android:color/transparent"        android:padding="5dp"        android:src="@drawable/com_return" />    <TextView        android:id="@+id/middle_title_tv"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_centerVertical="true"        android:background="@android:color/transparent"        android:ellipsize="end"        android:gravity="center_horizontal"        android:maxEms="10"        android:padding="5dp"        android:singleLine="true"        android:text="测试1"        android:textColor="#FFFF"        android:textSize="@dimen/common_title_size"        android:textStyle="bold" /></RelativeLayout>
2.activity_main.xml(主页布局)
<RelativeLayout 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:background="@android:color/white" >    <include        android:id="@+id/common_title_bar"        android:layout_width="match_parent"        android:layout_height="@dimen/common_title_bar_height"        android:layout_alignParentTop="true"        layout="@layout/common_title_layout" />    <LinearLayout        android:id="@+id/bottom_guide_layout"        android:layout_width="match_parent"        android:layout_height="60dp"        android:layout_alignParentBottom="true"        android:baselineAligned="false"        android:orientation="horizontal" >        <!-- 测试1-->        <LinearLayout            android:id="@+id/heart_word_item"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:gravity="center"            android:orientation="vertical"            android:padding="3dp" >            <ImageView                android:id="@+id/heart_word_iv"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_gravity="center_horizontal"                android:src="@drawable/main_heart_word_selector" />            <TextView                android:id="@+id/heart_word_tv"                android:layout_width="match_parent"                android:layout_height="wrap_content"                android:gravity="center_horizontal"                android:text="@string/heart_word"                android:textColor="@drawable/main_guide_text_color_selector"                android:textSize="@dimen/common_text_size" />        </LinearLayout>        <!-- 测试2-->        <LinearLayout            android:id="@+id/record_item"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:gravity="center"            android:orientation="vertical"            android:padding="3dp" >            <ImageView                android:id="@+id/record_iv"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_gravity="center_horizontal"                android:src="@drawable/main_recored_selector" />            <TextView                android:id="@+id/record_tv"                android:layout_width="match_parent"                android:layout_height="wrap_content"                android:gravity="center_horizontal"                android:text="@string/record"                android:textColor="@drawable/main_guide_text_color_selector"                android:textSize="@dimen/common_text_size" />        </LinearLayout>       <!-- 测试3-->        <LinearLayout            android:id="@+id/paradise_item"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:gravity="center"            android:orientation="vertical"            android:padding="3dp" >            <ImageView                android:id="@+id/paradise_iv"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_gravity="center_horizontal"                android:src="@drawable/main_paradise_selector" />            <TextView                android:id="@+id/paradise_tv"                android:layout_width="match_parent"                android:layout_height="wrap_content"                android:gravity="center_horizontal"                android:text="@string/paradise"                android:textColor="@drawable/main_guide_text_color_selector"                android:textSize="@dimen/common_text_size" />        </LinearLayout>       <!-- 测试4-->        <LinearLayout            android:id="@+id/discover_item"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:gravity="center"            android:orientation="vertical"            android:padding="3dp" >            <ImageView                android:id="@+id/discover_iv"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_gravity="center_horizontal"                android:src="@drawable/main_discover_selector" />            <TextView                android:id="@+id/discover_tv"                android:layout_width="match_parent"                android:layout_height="wrap_content"                android:gravity="center_horizontal"                android:text="@string/discover"                android:textColor="@drawable/main_guide_text_color_selector"                android:textSize="@dimen/common_text_size" />        </LinearLayout>       <!-- 测试5-->        <LinearLayout            android:id="@+id/setting_item"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:gravity="center"            android:orientation="vertical"            android:padding="3dp" >            <ImageView                android:id="@+id/setting_iv"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_gravity="center_horizontal"                android:src="@drawable/main_setting_selector" />            <TextView                android:id="@+id/setting_tv"                android:layout_width="match_parent"                android:layout_height="wrap_content"                android:gravity="center_horizontal"                android:text="@string/setting"                android:textColor="@drawable/main_guide_text_color_selector"                android:textSize="@dimen/common_text_size" />        </LinearLayout>    </LinearLayout>    <View        android:id="@+id/line"        android:layout_width="match_parent"        android:layout_height="1px"        android:layout_above="@id/bottom_guide_layout"        android:background="@color/record_line_color" />    <android.support.v4.view.ViewPager        android:id="@+id/content_pager"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:layout_above="@id/line"        android:layout_below="@id/common_title_bar"        android:fadingEdge="none"        android:overScrollMode="never" >    </android.support.v4.view.ViewPager></RelativeLayout>
3.MainActivity.java(启动页面)

public class MainActivity extends FragmentActivity {private View mHeartWordView, mRecordView, mParadiseView, mDiscoverView,mSettingView;private ImageView mHeartWordIV, mRecordIV, mParadiseIV, mDiscoverIV,mSettingIV;private TextView mTitleTV, mHeartWordTV, mRecordTV, mParadiseTV,mDiscoverTV, mSettingTV;private FragmentManager mFragmentManager;private HeartWordFragment mWordFragment;private DiscoverFragment mDiscoverFragment;private RecordFragment mRecordFragment;private SettingFragment mSettingFragment;private ParadiseFragment mParadiseFragment;private ArrayList<Fragment> mFragmentList;private ViewPager mainPager;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);initView();}private void initView() {BottomItemOnClickListener mClickListener = new BottomItemOnClickListener();mTitleTV = (TextView) findViewById(R.id.middle_title_tv);mHeartWordView = findViewById(R.id.heart_word_item);mHeartWordIV = (ImageView) findViewById(R.id.heart_word_iv);mHeartWordTV = (TextView) findViewById(R.id.heart_word_tv);mRecordView = findViewById(R.id.record_item);mRecordIV = (ImageView) findViewById(R.id.record_iv);mRecordTV = (TextView) findViewById(R.id.record_tv);mParadiseView = findViewById(R.id.paradise_item);mParadiseIV = (ImageView) findViewById(R.id.paradise_iv);mParadiseTV = (TextView) findViewById(R.id.paradise_tv);mDiscoverView = findViewById(R.id.discover_item);mDiscoverIV = (ImageView) findViewById(R.id.discover_iv);mDiscoverTV = (TextView) findViewById(R.id.discover_tv);mSettingView = findViewById(R.id.setting_item);mSettingIV = (ImageView) findViewById(R.id.setting_iv);mSettingTV = (TextView) findViewById(R.id.setting_tv);mHeartWordView.setOnClickListener(mClickListener);mRecordView.setOnClickListener(mClickListener);mParadiseView.setOnClickListener(mClickListener);mDiscoverView.setOnClickListener(mClickListener);mSettingView.setOnClickListener(mClickListener);mFragmentManager = getSupportFragmentManager();mWordFragment = new HeartWordFragment();mDiscoverFragment = new DiscoverFragment();mRecordFragment = new RecordFragment();mParadiseFragment = new ParadiseFragment();mSettingFragment = new SettingFragment();mFragmentList = new ArrayList<Fragment>();mFragmentList.add(mWordFragment);mFragmentList.add(mRecordFragment);mFragmentList.add(mParadiseFragment);mFragmentList.add(mDiscoverFragment);mFragmentList.add(mSettingFragment);mainPager = (ViewPager) findViewById(R.id.content_pager);mainPager.setAdapter(new MainPagerAdapter(mFragmentManager));// 初始化mainPager.setCurrentItem(0);updataBottomStatu(0);/** * 若禁止ViewPager滑动可以自定义ViewPager重写scrollTo方法 */mainPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {@Overridepublic void onPageSelected(int position) {updataBottomStatu(position);}@Overridepublic void onPageScrolled(int arg0, float arg1, int arg2) {}@Overridepublic void onPageScrollStateChanged(int arg0) {}});}protected class BottomItemOnClickListener implements OnClickListener {@Overridepublic void onClick(View v) {switch (v.getId()) {case R.id.heart_word_item: {mainPager.setCurrentItem(0);updataBottomStatu(0);}break;case R.id.record_item: {mainPager.setCurrentItem(1);updataBottomStatu(1);}break;case R.id.paradise_item: {mainPager.setCurrentItem(2);updataBottomStatu(2);}break;case R.id.discover_item: {mainPager.setCurrentItem(3);updataBottomStatu(3);}break;case R.id.setting_item: {mainPager.setCurrentItem(4);updataBottomStatu(4);}break;}}}private void setHeartWord(boolean isSelect) {mHeartWordView.setSelected(isSelect);mHeartWordIV.setSelected(isSelect);mHeartWordTV.setSelected(isSelect);}private void setRecord(boolean isSelect) {mRecordView.setSelected(isSelect);mRecordIV.setSelected(isSelect);mRecordTV.setSelected(isSelect);}private void setParadise(boolean isSelect) {mParadiseView.setSelected(isSelect);mParadiseIV.setSelected(isSelect);mParadiseTV.setSelected(isSelect);}private void setDiscover(boolean isSelect) {mDiscoverView.setSelected(isSelect);mDiscoverIV.setSelected(isSelect);mDiscoverTV.setSelected(isSelect);}private void setSetting(boolean isSelect) {mSettingView.setSelected(isSelect);mSettingIV.setSelected(isSelect);mSettingTV.setSelected(isSelect);}private void updataBottomStatu(int index) {switch (index) {case 0:if (!mHeartWordView.isSelected()) {setTitle(R.string.angle_word);setHeartWord(true);setRecord(false);setParadise(false);setDiscover(false);setSetting(false);}break;case 1:if (!mRecordView.isSelected()) {setTitle(R.string.record);setHeartWord(false);setRecord(true);setParadise(false);setDiscover(false);setSetting(false);}break;case 2:if (!mParadiseView.isSelected()) {setTitle(R.string.paradise);setHeartWord(false);setRecord(false);setParadise(true);setDiscover(false);setSetting(false);}break;case 3:if (!mDiscoverView.isSelected()) {setTitle(R.string.discover);setHeartWord(false);setRecord(false);setParadise(false);setDiscover(true);setSetting(false);}break;case 4:if (!mSettingView.isSelected()) {setTitle(R.string.setting);setHeartWord(false);setRecord(false);setParadise(false);setDiscover(false);setSetting(true);}break;}}class MainPagerAdapter extends FragmentStatePagerAdapter {public MainPagerAdapter(FragmentManager fm) {super(fm);}@Overridepublic Fragment getItem(int arg0) {return mFragmentList.get(arg0);}@Overridepublic int getCount() {return mFragmentList == null ? 0 : mFragmentList.size();}@Overridepublic void destroyItem(ViewGroup container, int position, Object object) {}}public void setTitle(CharSequence title) {mTitleTV.setText(title);}public void setTitle(int resId) {mTitleTV.setText(getString(resId));}}

4.HeartWordFragment.java(子界面)

public class HeartWordFragment extends Fragment {private View rootView;private TextView mytxt;@Overridepublic View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {rootView = inflater.inflate(R.layout.heart_word_layout, null);initViews();return rootView;}private void initViews() {MainActivity mainActivity = (MainActivity) getActivity();mainActivity.setTitle("测试2");mytxt = (TextView) rootView.findViewById(R.id.mytxt);mytxt.setOnClickListener(new OnClickListener() {@Overridepublic void onClick(View arg0) {Toast.makeText(getActivity(), "点击了文本", Toast.LENGTH_LONG).show();}});}}

5.最后在给个drawable(main_heart_word_selector.xml)

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android">    <item android:drawable="@drawable/heart_select" android:state_selected="true"></item>    <item android:drawable="@drawable/heart_normal"></item></selector>

6.效果


0 0