android 练习之路 (四)
项目的github地址:https://github.com/Qunter/SearchAndCall
------------------------------------------------------------------------
今天应该勉强算是把fragment的最基本的框架搭好了吧
最终结果如下:
那么接着昨天的改,MainActivity的名字就不用变了,主页就叫这个吧,然而主页我决定丢四个fragment进去
暂定每个页面最后做到这些功能
1,学校咨询:用爬虫将用户学校的官网的内容获取到,并且显示出来
2,周边活动:用于发布活动以及显示活动
3,我的好友:用于添加删除好友以及聊天相关
4,我的设置:顾名思义也就是设置页面了
那么现在首先是建四个fragment然后丢到MainActivity里去,并且添加上面的标题栏以及下面的底部导航栏
那么从下面的底部导航栏说起吧,我个人比较喜欢Material design风格的底部导航栏
这个既然很多人都已经写好了相当不错的“模板”,那么我们就用其中一个框架来实现效果吧
这里选择的是:
AHBottomNavigation
https://github.com/aurelhubert/ahbottomnavigation/
添加起来也非常简单,首先在app的build.gradle里添加依赖
//BottomNavigationView依赖 compile 'com.aurelhubert:ahbottomnavigation:2.0.6'
国际惯例,sync一下
然后我们建四个fragment的Activity文件
就以其中一个举例吧
SchoolInfoFragmActivity.java
public class SchoolInfoFragmActivity extends Fragment { public static SchoolInfoFragmActivity newInstance() { return new SchoolInfoFragmActivity(); } @Nullable @Override public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {return inflater.inflate(R.layout.activity_school_info_fragm, container, false); } }
所以也必然需要四个layout文件了
activity_school_info_fragm.xml
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="学校咨询页面" android:textSize="24sp" android:layout_centerInParent="true"/> </RelativeLayout>
然后就可以开始重新写一下MainActivity了
先从layout开始吧
activity_main.xml
<?xml version="1.0" encoding="utf-8"?> <android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent"> <android.support.design.widget.AppBarLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" app:popupTheme="@style/ThemeOverlay.AppCompat.Light" app:theme="@style/Theme.AppCompat.Light"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:layout_gravity="center" android:text="@string/app_name" android:textSize="22sp" android:textColor="#dd000000" /> </android.support.v7.widget.Toolbar> </android.support.design.widget.AppBarLayout> <FrameLayout android:id="@+id/content" android:layout_width="match_parent" android:layout_height="match_parent" app:layout_behavior="@string/appbar_scrolling_view_behavior" /> <com.aurelhubert.ahbottomnavigation.AHBottomNavigation android:id="@+id/bottom_navigation_view" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_gravity="bottom" /> </android.support.design.widget.CoordinatorLayout>
然后是Activity
MainActivity.java
public class MainActivity extends AppCompatActivity { private AHBottomNavigation bottomNavigationView; private List<Fragment> fragments = new ArrayList<>(); private int currentTabIndex; @Override protected void onCreate(@Nullable Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); initViews(); } protected void initViews() { fragments.add(SchoolInfoFragmActivity.newInstance()); fragments.add(EventInfoFragmActivity.newInstance()); fragments.add(FriendInfoFragmActivity.newInstance()); fragments.add(UserInfoFragmActivity.newInstance()); showFragment(fragments.get(0)); initBottomNav(); } private void initBottomNav() { bottomNavigationView = (AHBottomNavigation) findViewById(R.id.bottom_navigation_view); AHBottomNavigationItem item1 = new AHBottomNavigationItem("学校资讯", R.drawable.ic_tab_temporary); AHBottomNavigationItem item2 = new AHBottomNavigationItem("周边活动", R.drawable.ic_tab_temporary); AHBottomNavigationItem item3 = new AHBottomNavigationItem("我的好友", R.drawable.ic_tab_temporary); AHBottomNavigationItem item4 = new AHBottomNavigationItem("我的设置", R.drawable.ic_tab_temporary); bottomNavigationView.addItem(item1); bottomNavigationView.addItem(item2); bottomNavigationView.addItem(item3); bottomNavigationView.addItem(item4); bottomNavigationView.setColored(false); bottomNavigationView.setForceTint(false); bottomNavigationView.setBehaviorTranslationEnabled(true); bottomNavigationView.setTitleState(AHBottomNavigation.TitleState.ALWAYS_SHOW); bottomNavigationView.setAccentColor(getResources().getColor(R.color.black_90)); bottomNavigationView.setInactiveColor(getResources().getColor(R.color.nav_text_color_mormal)); bottomNavigationView.setCurrentItem(0); bottomNavigationView.setDefaultBackgroundColor( getResources().getColor(R.color.bottom_tab_bar_color)); bottomNavigationView.setOnTabSelectedListener(new AHBottomNavigation.OnTabSelectedListener() { @Override public boolean onTabSelected(int position, boolean wasSelected) { if (currentTabIndex != position) { FragmentTransaction trx = getSupportFragmentManager().beginTransaction(); trx.hide(fragments.get(currentTabIndex)); if (!fragments.get(position).isAdded()) { trx.add(R.id.content, fragments.get(position)); } trx.show(fragments.get(position)).commit(); } currentTabIndex = position; return true; } }); } private void showFragment(Fragment fragment) { getSupportFragmentManager() .beginTransaction() .replace(R.id.content, fragment) .commit(); } }
这里话说回来感觉应该做一个基类,不过想起来可能之后fragment也需要,那就到时候再一起重构一次吧
当然这里还有些样式和颜色的定义,就不列出来了,图片是随便找的,之后也需要换,那么今天就到这吧