【问题标题】:Navigation Drawer in bottomappbar androidbottomappbar android中的导航抽屉
【发布时间】:2018-09-27 05:40:57
【问题描述】:

class BottomNavigationDrawerFragment: BottomSheetDialogFragment(), 
   NavigationView.OnNavigationItemSelectedListener {

    override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
        return inflater.inflate(R.layout.fragment_bottomsheet, container, false)
    }

    override fun onNavigationItemSelected(item : MenuItem): Boolean {
        // Bottom Navigation Drawer menu item clicks
        when (item.itemId) {
            R.id.nav1 -> context!!.toast("oneeeeee")
            R.id.nav2 -> context!!.toast("twoooooo")
            R.id.nav3 -> context!!.toast("threeeee")

            return true
        }
        // Add code here to update the UI based on the item selected
        // For example, swap
    }
    override fun onActivityCreated(savedInstanceState: Bundle?) {
        super.onActivityCreated(savedInstanceState)

        navigation_view.setNavigationItemSelectedListener(this)

        // Add code here to update the UI based on the item selected
        // For example, swap
    }
}

// This is an extension method for easy Toast call
fun Context.toast(message: CharSequence) {
    val toast = Toast.makeText(this, message, Toast.LENGTH_SHORT)
    toast.setGravity(Gravity.BOTTOM, 0, 600)
    toast.show()
}

我想要实现的是图像中给出的东西。我想在底部应用栏中创建一个navigation drawer。上面的代码不起作用,它告诉未解析的引用类型setNavigationItemSelectedListener。我的代码有什么错误?

【问题讨论】:

  • 使用底部导航抽屉
  • 我想使用底部应用栏。我不能在底部应用栏中使用导航抽屉吗?
  • 看图片。在左侧下方我们有一个抽屉。当我们点击它时,它将打开一个底部工作表,其中将有导航。与谷歌任务相同的情况。
  • 是的,这只是一个导航图标
  • 在我点击导航图标后,我可以使用一个底部有导航抽屉的工作表

标签: android navigation-drawer


【解决方案1】:

您应该在bottomAppbar 中添加一个抽屉图标,然后使用bottomsheet 作为抽屉。

对于您的抽屉,您有两种选择:

1- 遵循谷歌标准并在菜单文件夹中添加抽屉项目(似乎你不想要这个)

2- 替换底部表格中的片段,这样您就可以自定义片段并做任何您喜欢的事情

-------------------- 替换底部工作表中的片段 -------------

你的 activity.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout 
 xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:custom="http://schemas.android.com/tools"
        android:id="@+id/main_content"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layoutDirection="ltr"
        android:background="@color/white"
        android:orientation="vertical">

            <FrameLayout
                android:id="@+id/bottom_sheet"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:clipToPadding="false"
                android:elevation="6dp"
                android:visibility="visible"
                app:layout_behavior="@string/bottom_sheet_behavior">

                 <FrameLayout
                    android:id="@+id/menu"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:orientation="vertical" />
            </FrameLayout>

  </androidx.coordinatorlayout.widget.CoordinatorLayout>

你的 Activity.java

public class Activity extends AppCompatActivity implements 
FragmentNavigation.OnFragmentInteractionListener {
    private CoordinatorLayout coordinatorLayout;
    private View bottomSheet;
    private BottomSheetBehavior<View> behavior;

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity);

        FrameLayout bottomSheetLayout = (FrameLayout) 
        findViewById(R.id.menu);

        FragmentNavigation fragmentNavigation = new FragmentNavigation();

        androidx.fragment.app.FragmentTransaction fragmentTransaction = 
        getSupportFragmentManager().beginTransaction();

        fragmentTransaction.replace(bottomSheetLayout.getId(), 
        fragmentNavigation, "k");

        fragmentTransaction.commit();


        coordinatorLayout = (CoordinatorLayout) 
        findViewById(R.id.main_content);
        bottomSheet = coordinatorLayout.findViewById(R.id.bottom_sheet);
        behavior = BottomSheetBehavior.from(bottomSheet);
    }

    @Override
    public void onFragmentInteraction(Uri uri) {

    }
}

您的片段导航

    public class FragmentNavigation extends androidx.fragment.app.Fragment {
    private String descriptions;

    public FragmentNavigation () {
    }

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
    }


    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // TODO Auto-generated method stub

        View view = inflater.inflate(R.layout.fragment_navigation, container, false);

        return view;
    }
}

您的 fragment_navigation.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
 xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:custom="http://schemas.android.com/tools"
        android:id="@+id/main_content"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/white"
        android:orientation="vertical">

                <TextView
                    android:id="@+id/bottom_sheet"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:clipToPadding="false"
                    android:elevation="6dp"
                    android:visibility="visible"
                    android:text="here is the navigation menu"
                    app:layout_behavior="@string/bottom_sheet_behavior"/>



      </LinearLayout>

【讨论】:

  • 你能告诉我在底页回复片段是什么意思吗?以及它将如何实现与导航抽屉相同的工作
  • 您的底部工作表是一个空白布局,您可以在其中放置项目,对吧?当您替换底片中的片段时,实际上您的片段以底片的形状打开。然后,当您打开底页时,您将看到您的片段内容。就如此容易。如果你还没有明白,请告诉我
  • 看起来很混乱!!
【解决方案2】:

查看此代码,它有一个 navigationIcon 属性,但您可以用作底部应用栏。如果您需要此点击的导航抽屉,那么您必须由我们自己定制。

<com.google.android.material.bottomappbar.BottomAppBar
  android:id="@+id/bottom_app_bar"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:layout_gravity="bottom"
  app:elevation="5dp"
  android:elevation="5dp"
  app:fabAttached="true"
  app:fabCradleDiameter="0dp"
  app:backgroundTint="@color/colorPrimary"
  app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
  app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
  app:fabAlignmentMode="center"
  app:menu="@menu/bottom_bar_menu"/>

在 res>menu>bottom_bar_menu 中,将 showAsAction 更改为 always 或 ifRoom,为 action_settings 放置一个图标并删除 orderInCategory

<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
    <item
        android:id="@+id/action_settings"
        android:title="@string/action_settings"
        android:showAsAction="always"
        android:icon="" />
    <item
        android:title="@string/search"
        android:id="@+id/search"
        android:icon="@drawable/ic_search_black_24dp"
        android:showAsAction="always" />

    <item
        android:id="@+id/app_bar_archieve"
        android:icon="@drawable/ic_bottom_bar_hamburger" // navigation icon
        android:title="@string/action_archieve"
        app:showAsAction="ifRoom"/>
</menu>

在java中:

BottomAppBar bar = (BottomAppBar) findViewById(R.id.bar);
setSupportActionBar(bar);

bar.setNavigationOnClickListener(new OnClickListener() {
    @Override
    public void onClick(View v) {
        // Handle the navigation click by showing a BottomDrawer etc.
    }
});

bar.setOnMenuItemClickListener(new OnMenuItemClickListener() {
    @Override
    public boolean onMenuItemClick(MenuItem item) {
        // Handle actions based on the menu item
        return true;
    }
});

参考链接:https://material.io/develop/android/components/bottom-app-bar/

【讨论】:

  • 我想知道我的代码有什么问题?为什么它告诉未解析的类型导航侦听器?我如何处理用 kotlin 点击的抽屉菜单项?
  • 第二个函数是否会处理底部表单中抽屉的点击事件
  • @VipinDubey 是的,所有菜单项,如导航图标也
  • 检查我在答案中添加了参考链接
  • 我已经在我的答案中添加了所有内容请再次检查
【解决方案3】:
bottom_bar.replaceMenu(R.menu.bottomappbar_menu)
    bottom_bar.setOnMenuItemClickListener {
        when (it.itemId) {
            R.id.app_bar_copy -> {

            }
            R.id.app_bar_fav -> {

            }
            R.id.app_bar_tra -> {

            }
            else -> {

            }
        }
         true
    }

只需在片段中添加代码来处理菜单项。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2017-08-01
    • 1970-01-01
    • 1970-01-01
    • 2013-06-20
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多