fragment的切换以及toolbar在不同页面下显示的menu不同
LatMilerum
9年前
来自: http://blog.csdn.net//chenguang79/article/details/49486723
上一篇我们已经把首页的一个基本框架搭起来了,今天我们继续我们的工作,左侧侧滑菜单已经有了,我们就为它加载上相应的页面吧。我们在看知乎的时候,你会发现,首页,发现,关注,收藏,草稿这五项,你在点击之后进入到相应页面之后,侧滑菜单还在,你左侧滑一下,这个侧滑菜单还在,而提问,左滑屏幕,这个页面就没有,有点像返回上一页的感觉。
从操作来看,五页面应该是fragment之间的切换,而提问是单独的activity。
我们先从几个fragment入手,这里我们建立五fragment页,选择继承自android.support.v4.app.Fragment,因为这五个页面基本上都一样,就是简单的一个布局,然后显示一个标题。分别是
首页: IndexFragment.java
发现: FindFragment.java
关注: AttentionFragment.java
收藏: CollectionFragment.java
草稿: DraftFragment.java
代码就以首页为例:
fragment_index.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"> <TextView android:layout_width="fill_parent" android:layout_height="fill_parent" android:text="我是首页" android:gravity="center"/> </LinearLayout>
IndexFragment.java
import android.os.Bundle; import android.support.v4.app.Fragment; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; /** * 首页 * Created by cg on 2015/10/27. */ public class IndexFragment extends Fragment { @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { View view = inflater.inflate(R.layout.fragment_index,container,false); return view; } }
fragment页面之间的切换,这个大家都会,这里就不细说了,如果有感觉这方面还不是很明确的,给推荐一个blog,里面说的很不错。http://blog.csdn.net/lmj623565791/article/details/42628537
这里我要强调的是,一般我们来进行fragment页面切换的时候,都是采用replace方法,进行切换,其实replace方就是remove方法和add方法的一个合体,使我们的代码变得简单了。可是这里就出现一个问题,这个方法,是移除与添加,也就是说,我们在切换的时候,它会重新加载,也就是说如果是读取数据,它就会重新去读数据,重新加载。这个在读本地数据库的时候,可能不算什么,可是在读网络数据的时候,这就浪费了流量,所以我们不能使用这个方法,我们这里使用hide,show,方法,用隐藏和显示的方法来进行切换。下面是一个通用的方法,代码如下:
/** * 当fragment进行切换时,采用隐藏与显示的方法加载fragment以防止数据的重复加载 * @param from * @param to */ public void switchContent(Fragment from, Fragment to) { if (isFragment != to) { isFragment = to; FragmentManager fm = getSupportFragmentManager(); //添加渐隐渐现的动画 FragmentTransaction ft = fm.beginTransaction(); if (!to.isAdded()) { // 先判断是否被add过 ft.hide(from).add(R.id.frame_main, to).commit(); // 隐藏当前的fragment,add下一个到Activity中 } else { ft.hide(from).show(to).commit(); // 隐藏当前的fragment,显示下一个 } } }
好,我们解决了fragment切换的问题,哪么下面我们就要来看一下,如何去触发这个方法,当我们点击左侧侧滑菜单按钮的时候,我们如何去进行触发这个点击事件呢。 其实也很简单,我们只要在侧滑菜单页页,定义一个点击事件的接口,然后让mainActivity页面,implements它就行了, 我们来修改一下我们的tool_NavigationDrawerFragment.java。代码如下:
import android.app.Fragment; import android.content.res.TypedArray; import android.os.Bundle; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.AdapterView; import android.widget.ListView; import com.example.cg.zhihu_one.Adapters.Main_Drawer_lv_Adapter; import com.example.cg.zhihu_one.models.MainDrawerMenu; import java.util.ArrayList; import java.util.List; /** * 左侧侧滑页面 * Created by cg on 2015/10/23. */ public class tool_NavigationDrawerFragment extends Fragment { private ListView lv_main_drawer_leftmenu; //定义菜单的listView private List<MainDrawerMenu> list_menu; /** * 设置菜单点击接口,以方便外部Activity调用 */ public interface menuClickListener { void menuClick(String menuName); } @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { View view = inflater.inflate(R.layout.fragment_main_drawer,container,false); initleftMenuContral(view); return view; } /** * 初始化左侧菜单列表listView,并为菜单,设置点击事件 * @param view */ private void initleftMenuContral(View view) { lv_main_drawer_leftmenu = (ListView)view.findViewById(R.id.lv_main_drawer_leftmenu); list_menu = getMenuItem(); lv_main_drawer_leftmenu.setAdapter(new Main_Drawer_lv_Adapter(getActivity(),list_menu)); lv_main_drawer_leftmenu.setOnItemClickListener(new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView<?> parent, View view, int position, long id) { if(getActivity() instanceof menuClickListener) { ((menuClickListener)getActivity()).menuClick(list_menu.get(position).getMainDrawer_menuName()); } } }); } /** * 从arrays.xml中取出数据,装入list<T>中 * @return */ private List<MainDrawerMenu> getMenuItem() { List<MainDrawerMenu> list_menu = new ArrayList<MainDrawerMenu>(); String[] itemTitle = getResources().getStringArray(R.array.item_title); TypedArray itemIconRes = getResources().obtainTypedArray(R.array.item_icon_res); for(int i=0;i<itemTitle.length;i++) { MainDrawerMenu lmi = new MainDrawerMenu(); lmi.setMainDrawer_icon(itemIconRes.getResourceId(i,0)); lmi.setMainDrawer_menuName(itemTitle[i]); list_menu.add(lmi); } return list_menu; } } 好了,现在我们再来修改一下我们的 MainActivity.java代码。 这里我们要添加三个地方,一是初始的时候,我们把首页的fragment给它加载进去,二是把implements自tool_NavigationDrawerFragment的点击方法实现了, 三是实现页面之间的切换。下面直接看代码吧 <pre name="code" class="java">import android.os.Bundle; import android.support.v4.app.Fragment; import android.support.v4.app.FragmentManager; import android.support.v4.app.FragmentTransaction; import android.support.v4.widget.DrawerLayout; import android.support.v7.app.ActionBarDrawerToggle; import android.support.v7.app.AppCompatActivity; import android.support.v7.widget.Toolbar; import android.view.Menu; import android.view.MenuItem; public class MainActivity extends AppCompatActivity implements tool_NavigationDrawerFragment.menuClickListener { private Toolbar toolbar; //定义toolbar private ActionBarDrawerToggle mDrawerToggle; //定义toolbar左上角的弹出左侧菜单按钮 private DrawerLayout drawer_main; //定义左侧滑动布局,其实就是主布局 private IndexFragment iFragment; //定义首页fragment private FindFragment fFragment; //定义发现fragment private AttentionFragment aFragment; //定义关注fragment private CollectionFragment cFragment; //定义收藏fragment private DraftFragment dFragment; //定义草稿fragment private Fragment isFragment; //记录当前正在使用的fragment @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); initToolbar(); initFragment(savedInstanceState); } /** * 初始化Toolbar,并设置Toolbar中的菜单与标题,并与DrawerLayout.DrawerListener相关联,设置动态图标 */ public void initToolbar() { toolbar = (Toolbar)this.findViewById(R.id.toolbar); toolbar.setTitle(R.string.menu_index); // 标题的文字需在setSupportActionBar之前,不然会无效 setSupportActionBar(toolbar); //为了生成,工具栏左上角的动态图标,要使用下面的方法 drawer_main = (DrawerLayout) findViewById(R.id.drawer_main); mDrawerToggle = new ActionBarDrawerToggle(this, drawer_main, toolbar, R.string.drawer_open, R.string.drawer_close); mDrawerToggle.syncState(); drawer_main.setDrawerListener(mDrawerToggle); } @Override public boolean onCreateOptionsMenu(Menu menu) { // Inflate the menu; this adds items to the action bar if it is present. getMenuInflater().inflate(R.menu.menu_main, menu); return true; } @Override public boolean onOptionsItemSelected(MenuItem item) { // Handle action bar item clicks here. The action bar will // automatically handle clicks on the Home/Up button, so long // as you specify a parent activity in AndroidManifest.xml. int id = item.getItemId(); //noinspection SimplifiableIfStatement if (id == R.id.main_toolbar_shuffle) { return true; } return super.onOptionsItemSelected(item); } /** * 为页面加载初始状态的fragment */ public void initFragment(Bundle savedInstanceState) { //判断activity是否重建,如果不是,则不需要重新建立fragment. if(savedInstanceState==null) { FragmentManager fm = getSupportFragmentManager(); FragmentTransaction ft = fm.beginTransaction(); if(iFragment==null) { iFragment = new IndexFragment(); } isFragment = iFragment; ft.replace(R.id.frame_main, iFragment).commit(); } } /** * 接收左侧侧滑菜单的点击事件 * @param menuName 菜单名称 */ @Override public void menuClick(String menuName) { getSupportActionBar().setTitle(menuName); //修改Toolbar菜单的名字 FragmentManager fm = getSupportFragmentManager(); FragmentTransaction ft = fm.beginTransaction(); switch (menuName) { case "首页" : if(iFragment!=null) { iFragment = new IndexFragment(); } switchContent(isFragment,iFragment); break; case "发现" : if(fFragment==null) { fFragment = new FindFragment(); } switchContent(isFragment,fFragment); break; case "关注" : if(aFragment==null) { aFragment = new AttentionFragment(); } switchContent(isFragment,aFragment); break; case "收藏" : if(cFragment==null) { cFragment = new CollectionFragment(); } switchContent(isFragment,cFragment); break; case "草稿" : if(dFragment==null) { dFragment = new DraftFragment(); } switchContent(isFragment,dFragment); break; case "提问" : break; } invalidateOptionsMenu(); /** * 关闭左侧滑出菜单 */ drawer_main.closeDrawers(); } /** * 当fragment进行切换时,采用隐藏与显示的方法加载fragment以防止数据的重复加载 * @param from * @param to */ public void switchContent(Fragment from, Fragment to) { if (isFragment != to) { isFragment = to; FragmentManager fm = getSupportFragmentManager(); //添加渐隐渐现的动画 FragmentTransaction ft = fm.beginTransaction(); if (!to.isAdded()) { // 先判断是否被add过 ft.hide(from).add(R.id.frame_main, to).commit(); // 隐藏当前的fragment,add下一个到Activity中 } else { ft.hide(from).show(to).commit(); // 隐藏当前的fragment,显示下一个 } } } }
来看一下,我们运行的效果,如图
当我们点击左侧菜单的时候,你会发现里面的fragment进行切换。同时toolbar左上角的标题也跟着变了。左上角的标题主要是代码getSupportActionBar().setTitle(menuName) ;它是用来动态修改toolbar的title的。在initFragment方法有一个很重要的知识点,就是if(savedInstanceState==null)的判断,它的作用就是在我们进行横竖屏切换时不会 出现页面叠加,我在一开始给的blog里面有两个连接也其中一个就是讲这个的,大家有兴趣可以去看一下。
现在我们已经可以很轻松的切换左侧侧滑菜单的各页面了,这时候我们会现一个问题,就是在toolbar上,第一个menu,这个menu在知乎里只有当菜单是发现时,才会出来, 而在别的页面时,它是不会显示的,也就是说,toolbar里面的menu是可以动态改变的。
我们知道,菜单是可以在onCreateOptionsMenu中进行处理的,可是这个方法,有一个问题,它在menu刚建立时才会执行,因此想动态修改menu它是不行的。onPrepareOptionsMenu这个方法,是每次点击menu时就会被触发,可是这个方法也是我们用的,因为我们是要点击左侧侧滑菜单来改变menu啊。
还有一个方法是invalidateOptionsMenu();这个方法是使原填充的menu无效,那么我们在每次点击侧滑菜单时,加上这句就OK了。
MainActivty.java代码如下:
import android.os.Bundle; import android.support.v4.app.Fragment; import android.support.v4.app.FragmentManager; import android.support.v4.app.FragmentTransaction; import android.support.v4.widget.DrawerLayout; import android.support.v7.app.ActionBarDrawerToggle; import android.support.v7.app.AppCompatActivity; import android.support.v7.widget.Toolbar; import android.view.Menu; import android.view.MenuItem; import android.widget.Toast; public class MainActivity extends AppCompatActivity implements tool_NavigationDrawerFragment.menuClickListener { private Toolbar toolbar; //定义toolbar private ActionBarDrawerToggle mDrawerToggle; //定义toolbar左上角的弹出左侧菜单按钮 private DrawerLayout drawer_main; //定义左侧滑动布局,其实就是主布局 private IndexFragment iFragment; //定义首页fragment private FindFragment fFragment; //定义发现fragment private AttentionFragment aFragment; //定义关注fragment private CollectionFragment cFragment; //定义收藏fragment private DraftFragment dFragment; //定义草稿fragment private Fragment isFragment; //记录当前正在使用的fragment private boolean isMenuShuffle = false; //判断是否显示toolbar上的随机菜单 @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); initToolbar(); initFragment(savedInstanceState); } /** * 初始化Toolbar,并设置Toolbar中的菜单与标题,并与DrawerLayout.DrawerListener相关联,设置动态图标 */ public void initToolbar() { toolbar = (Toolbar)this.findViewById(R.id.toolbar); toolbar.setTitle(R.string.menu_index); // 标题的文字需在setSupportActionBar之前,不然会无效 setSupportActionBar(toolbar); //为了生成,工具栏左上角的动态图标,要使用下面的方法 drawer_main = (DrawerLayout) findViewById(R.id.drawer_main); mDrawerToggle = new ActionBarDrawerToggle(this, drawer_main, toolbar, R.string.drawer_open, R.string.drawer_close); mDrawerToggle.syncState(); drawer_main.setDrawerListener(mDrawerToggle); } @Override public boolean onCreateOptionsMenu(Menu menu) { // Inflate the menu; this adds items to the action bar if it is present. getMenuInflater().inflate(R.menu.menu_main, menu); return true; } @Override public boolean onOptionsItemSelected(MenuItem item) { switch (item.getItemId()) { case R.id.main_toolbar_search: Toast.makeText(this, "main_toolbar_search", Toast.LENGTH_LONG).show(); break; case R.id.main_toolbar_notify: Toast.makeText(this, "main_toolbar_notify", Toast.LENGTH_LONG).show(); break; case R.id.main_toolbar_about: Toast.makeText(this, "main_toolbar_about", Toast.LENGTH_LONG).show(); break; case R.id.main_toolbar_register: Toast.makeText(this,"main_toolbar_register",Toast.LENGTH_LONG).show(); break; case R.id.main_toolbar_shuffle: Toast.makeText(this,"main_toolbar_shuffle",Toast.LENGTH_LONG).show(); break; } return super.onOptionsItemSelected(item); } @Override public boolean onPrepareOptionsMenu(Menu menu) { //Log.e("isMenuShuffle",isMenuShuffle + ""); if(isMenuShuffle) { menu.findItem(R.id.main_toolbar_shuffle).setVisible(true); }else { menu.findItem(R.id.main_toolbar_shuffle).setVisible(false); } return super.onPrepareOptionsMenu(menu); } /** * 为页面加载初始状态的fragment */ public void initFragment(Bundle savedInstanceState) { //判断activity是否重建,如果不是,则不需要重新建立fragment. if(savedInstanceState==null) { FragmentManager fm = getSupportFragmentManager(); FragmentTransaction ft = fm.beginTransaction(); if(iFragment==null) { iFragment = new IndexFragment(); } isFragment = iFragment; ft.replace(R.id.frame_main, iFragment).commit(); } } /** * 接收左侧侧滑菜单的点击事件 * @param menuName 菜单名称 */ @Override public void menuClick(String menuName) { getSupportActionBar().setTitle(menuName); //修改Toolbar菜单的名字 FragmentManager fm = getSupportFragmentManager(); FragmentTransaction ft = fm.beginTransaction(); switch (menuName) { case "首页" : if(iFragment!=null) { iFragment = new IndexFragment(); } switchContent(isFragment,iFragment); isMenuShuffle = false; break; case "发现" : if(fFragment==null) { fFragment = new FindFragment(); } switchContent(isFragment,fFragment); isMenuShuffle = true; break; case "关注" : if(aFragment==null) { aFragment = new AttentionFragment(); } switchContent(isFragment,aFragment); isMenuShuffle = false; break; case "收藏" : if(cFragment==null) { cFragment = new CollectionFragment(); } switchContent(isFragment,cFragment); isMenuShuffle = false; break; case "草稿" : if(dFragment==null) { dFragment = new DraftFragment(); } switchContent(isFragment,dFragment); isMenuShuffle = false; break; case "提问" : isMenuShuffle = false; /*Intent qIntent = new Intent(); qIntent.setClass(this,QuestionAcivity.class); startActivity(qIntent);*/ break; } invalidateOptionsMenu(); /** * 关闭左侧滑出菜单 */ drawer_main.closeDrawers(); } /** * 当fragment进行切换时,采用隐藏与显示的方法加载fragment以防止数据的重复加载 * @param from * @param to */ public void switchContent(Fragment from, Fragment to) { if (isFragment != to) { isFragment = to; FragmentManager fm = getSupportFragmentManager(); //添加渐隐渐现的动画 FragmentTransaction ft = fm.beginTransaction(); if (!to.isAdded()) { // 先判断是否被add过 ft.hide(from).add(R.id.frame_main, to).commit(); // 隐藏当前的fragment,add下一个到Activity中 } else { ft.hide(from).show(to).commit(); // 隐藏当前的fragment,显示下一个 } } }
最后的结果如下图:
是不是达到了我们想要的效果呢