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;
    }
}

 

到此,代码结束,可实现上面的效果。

 

posted on 2018-06-29 10:34  手撕高达的村长  阅读(17688)  评论(0编辑  收藏  举报

导航