Android 底部按钮BottomNavigationView + Fragment 的使用(二)
这里来试验BottomNavigationView + Fragment
底部按钮通过点击底部选项,实现中间的Fragment进行页面的切换。
使用BottomNavigationView 控件,实现底部按钮的布局,然后给按钮加上监听,监听选择后,实现中间Fragment页面的切换
上代码:found_main.xml 其他两个文件为menu_main.xml 和 user_main.xml ,从found_main.xml copy 过去就行,修改下里面的样式,便于区分。
<?xml version="1.0" encoding="utf-8"?> <android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_height="match_parent"> <!--用来显示具体内容--> <LinearLayout android:id="@+id/linearLayout2" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="horizontal" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent"> <TextView android:id="@+id/titlename" android:layout_width="match_parent" android:layout_height="45dp" android:layout_weight="1" android:background="#2b5361" android:drawablePadding="3dp" android:gravity="center" android:text="发现" /> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:layout_marginTop="45dp" android:background="@android:color/holo_blue_bright" android:orientation="vertical" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintTop_toBottomOf="@+id/linearLayout2"> <ImageView android:id="@+id/imageView2" android:layout_width="match_parent" android:layout_height="wrap_content" app:srcCompat="@android:drawable/arrow_down_float" /> </LinearLayout> </android.support.constraint.ConstraintLayout>
创建主页面,activity_main.xml
<?xml version="1.0" encoding="utf-8"?> <android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/container" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MenuActivity"> <FrameLayout android:id="@+id/FramePage" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@android:color/holo_purple" app:layout_constraintBottom_toTopOf="@+id/viewline"> </FrameLayout> <View android:id="@+id/viewline" android:layout_width="match_parent" android:layout_height="5dp" android:layout_above="@id/navigation" android:background="@android:color/darker_gray" app:layout_constraintBottom_toTopOf="@+id/navigation" /> <android.support.design.widget.BottomNavigationView android:id="@+id/navigation" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="?android:attr/windowBackground" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" app:menu="@menu/navigation" /> </android.support.constraint.ConstraintLayout>
创建BottomNavigationView需要显示的item文件 nabigation.xml
<?xml version="1.0" encoding="utf-8"?> <menu xmlns:android="http://schemas.android.com/apk/res/android"> <item android:id="@+id/navigation_home" android:icon="@drawable/ic_home_black_24dp" android:title="@string/title_home" /> <item android:id="@+id/navigation_dashboard" android:icon="@drawable/ic_dashboard_black_24dp" android:title="@string/title_dashboard" /> <item android:id="@+id/navigation_notifications" android:icon="@drawable/ic_notifications_black_24dp" android:title="@string/title_notifications" /> </menu>
最后上主程序 MenuActivity.java
package action.sun.com.hello; import android.app.FragmentManager; import android.app.FragmentTransaction; import android.os.Bundle; import android.support.annotation.NonNull; import android.support.design.widget.BottomNavigationView; import android.support.v4.view.ViewPager; import android.support.v7.app.AppCompatActivity; import android.util.Log; import android.view.MenuItem; import android.widget.FrameLayout; import android.widget.TextView; import action.sun.com.hello.action.sun.com.hello.until.FirstFragment; public class MenuActivity extends AppCompatActivity { private String className= "MenuActivity"; // private ViewPager viewPager; String msg = "Android : "; //继承Activity 不会显示APP头上的标题 private FirstFragment f1,f2,f3; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_menu); final BottomNavigationView bottomNavigationView = (BottomNavigationView) findViewById(R.id.navigation); //bottomNavigationView Item 选择监听 bottomNavigationView.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() { @Override public boolean onNavigationItemSelected(@NonNull MenuItem item) { Log.d("123", "onNavigationItemSelected is click: "); FragmentTransaction transaction = getFragmentManager().beginTransaction(); hideAllFragment(transaction); switch (item.getItemId()){ case R.id.navigation_home: Log.d(className, "R.id.navigation_home: "); if(f1==null){ f1 = FirstFragment.newInstance("发现",R.layout.found_main); transaction.add(R.id.FramePage,f1); }else{ transaction.show(f1); } break; case R.id.navigation_dashboard: Log.d(className, "R.id.navigation_dashboard: "); if(f2==null){ f2 =FirstFragment.newInstance("我的",R.layout.user_main);//"第二个Fragment" transaction.add(R.id.FramePage,f2); }else{ transaction.show(f2); } break; case R.id.navigation_notifications: Log.d(className, "R.string.title_notification: "); if(f3==null){ f3 = FirstFragment.newInstance("关于",R.layout.menu_main);//"第三个Fragment" transaction.add(R.id.FramePage,f3); }else{ transaction.show(f3); } break; } transaction.commit(); Log.d(msg, "xxxxx "); return false; } }); } //隐藏所有Fragment public void hideAllFragment(FragmentTransaction transaction){ if(f1!=null){ transaction.hide(f1); } if(f2!=null){ transaction.hide(f2); } if(f3!=null){ transaction.hide(f3); } } }
FirstFragment.java
package action.sun.com.hello.action.sun.com.hello.until; import android.graphics.drawable.Drawable; import android.support.annotation.Nullable; import android.app.Fragment; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.TextView; import android.os.Bundle; import action.sun.com.hello.R; public class FirstFragment extends Fragment{ private String context="xxxxxxxxxxxxx"; private TextView mTextView; //要显示的页面 private int FragmentPage; public static FirstFragment newInstance(String context,int iFragmentPage){ FirstFragment myFragment = new FirstFragment(); myFragment.context = context; myFragment.FragmentPage = iFragmentPage; return myFragment; } @Nullable @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { this.context = context; View view = inflater.inflate(FragmentPage,container,false); //mTextView = (TextView)view.findViewById(R.id.titlename); //mTextView = (TextView)getActivity().findViewById(R.id.txt_content); ///mTextView.setText(context); //mTextView.setBackgroundColor(20); return view; } }
到此,代码结束,可实现上面的效果。