【问题标题】:Up navigation in fragment's toolbar片段工具栏中的向上导航
【发布时间】:2022-03-29 19:00:47
【问题描述】:

我正在尝试在我的应用中使用向上导航。向上导航按钮显示,但有时有效,有时无效。该应用程序可以在这里查看XYZReader on GitHub

期望的行为

主要活动显示一个卡片网格。当您选择卡片时,详细活动会显示文章。详细活动使用片段和视图分页器,以便人们可以向右/向左滑动到下一篇/上一篇文章。
在片段的(折叠)工具栏中,显示向上/返回导航按钮,当我单击该按钮时,我想返回主要活动

实际行为(向上导航不起作用)

我在主活动的网格中选择了一篇文章,详细活动显示了相应的片段。
我点击向上导航按钮,没有任何反应
我希望向上导航将我带回到主要活动以查看文章的网格列表。

实际行为(向上导航工作)

我在主活动的网格中选择一篇文章,详细活动显示相应的片段。
我向右滑动查看下一篇文章。然后我点击向上导航按钮并返回主活动以查看文章的网格列表

相关代码sn-ps

activity_article_detail.xml 是主机/细节活动的布局。它只包含一个视图分页器视图:

<android.support.v4.view.ViewPager
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/pager"
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>

fragment_article_detail.xml 是片段的布局。它包含折叠工具栏(以及嵌套滚动视图和浮动操作按钮):

<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:id="@+id/app_bar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/collapsing_toolbar_container"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:expandedTitleMarginBottom="@dimen/toolbar_title_bottom_margin"
            app:expandedTitleMarginStart="@dimen/detail_inner_horiz_margin"
            app:expandedTitleTextAppearance="@style/Toolbar_Title"
            app:layout_scrollFlags="scroll|exitUntilCollapsed|snap">

            <ImageView
                android:id="@+id/photo"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:contentDescription="@string/photo_of_the_article"
                android:scaleType="centerCrop"
                app:layout_collapseMode="parallax"
                app:layout_collapseParallaxMultiplier="0.1"/>

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?android:attr/actionBarSize"
                app:layout_collapseMode="pin">

            </android.support.v7.widget.Toolbar>

        </android.support.design.widget.CollapsingToolbarLayout>

    </android.support.design.widget.AppBarLayout>

    <android.support.v4.widget.NestedScrollView
        android:id="@+id/scrollview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <com.example.xyzreader.ui.MaxWidthLinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_gravity="center_horizontal"
            android:background="@android:color/white"
            android:maxWidth="@dimen/detail_card_max_width"
            android:orientation="vertical">

            <LinearLayout
                android:id="@+id/linear_layout_title_container"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:orientation="vertical"
                android:paddingBottom="@dimen/detail_metabar_vert_padding"
                android:paddingLeft="@dimen/detail_inner_horiz_margin"
                android:paddingRight="@dimen/detail_inner_horiz_margin"
                android:paddingTop="@dimen/detail_metabar_vert_padding">

                <TextView
                    android:id="@+id/article_byline"
                    style="?android:attr/textAppearanceSmall"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:textColor="@color/byline_text_color"/>

            </LinearLayout>

            <WebView
                android:id="@+id/article_body"
                style="?android:attr/textAppearanceMedium"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginLeft="@dimen/detail_inner_horiz_margin"
                android:layout_marginRight="@dimen/detail_inner_horiz_margin"
                android:lineSpacingMultiplier="@fraction/detail_body_line_spacing_multiplier"
                android:paddingBottom="@dimen/detail_body_bottom_margin"
                android:paddingTop="@dimen/body_padding_top"
                android:textColor="?android:attr/textColorPrimary"
                android:textColorLink="?attr/colorAccent"
                android:textSize="@dimen/detail_body_text_size"/>

        </com.example.xyzreader.ui.MaxWidthLinearLayout>

    </android.support.v4.widget.NestedScrollView>

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/floating_action_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_margin="@dimen/fab_margin"
        android:contentDescription="@string/action_share"
        app:fabSize="normal"
        app:srcCompat="@drawable/ic_share_white_24dp"/>

</android.support.design.widget.CoordinatorLayout>

在片段的onCreateView 中,我尝试对功能进行编程:

    mCollapsingToolbarLayout = mRootView.findViewById(R.id.collapsing_toolbar_container);
    mCollapsingToolbarLayout.setExpandedTitleTypeface(Typeface.create(mCollapsingToolbarLayout.getExpandedTitleTypeface(), Typeface.BOLD));
    mCollapsingToolbarLayout.setCollapsedTitleTypeface(Typeface.create(mCollapsingToolbarLayout.getExpandedTitleTypeface(), Typeface.BOLD));
    mCollapsingToolbarLayout.setCollapsedTitleTextColor(getResources().getColor(android.R.color.white));

    AppCompatActivity appCompatActivity = ((AppCompatActivity) getActivity());
    Toolbar toolbar = mRootView.findViewById(R.id.toolbar);
    toolbar.setNavigationIcon(R.drawable.ic_arrow_back_white_24dp);
    appCompatActivity.setSupportActionBar(toolbar);
    ActionBar actionBar = appCompatActivity.getSupportActionBar();
    actionBar.setDisplayHomeAsUpEnabled(true); //<-- DISPLAYS THE HOME BUTTON IN THE COLLAPSING TOOLBAR
    actionBar.setDisplayShowTitleEnabled(false);

我尝试过的

  1. 我已尝试将工具栏移至宿主活动的布局。我遇到了问题并放弃了这一点。无论如何我不想这样做,因为它看起来像一个有缺陷的设计。在我看来,每个片段都有一个工具栏。
  2. 我尝试在工具栏上设置导航图标和监听器。结果是一样的。有时有效,有时无效。

    toolbar.setNavigationIcon(nav_icon);
    toolbar.setNavigationOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            Log.d(TAG, "Up navigation button pressed.");
        }
    });
    
  3. 有人建议我尝试在片段中添加代码 sn-p。这也不起作用。

    public boolean onOptionsItemSelected(MenuItem item) {
        switch (item.getItemId()) {
            case android.R.id.home:
                Intent intent = NavUtils.getParentActivityIntent(getActivity());
                intent.setFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP | Intent.FLAG_ACTIVITY_SINGLE_TOP);
                NavUtils.navigateUpTo(getActivity(), intent);
                return true;
        }
        return super.onOptionsItemSelected(item);
    }
    

【问题讨论】:

  • 每个片段都将其工具栏设置为活动工具栏。因为您有一个带有多个片段的视图寻呼机,所以最后一个初始化“获胜”的片段有一个工作工具栏。如果这是正确的,我会考虑反转您的视图层次结构,例如在 activity.xml 中使用带有 viewpager 的协调器布局
  • @veritas1 你说的太对了。我不敢相信我没有看到。我应该花时间摆脱它,只是为了重新振作起来。它现在可以工作了(当然不是设置支持操作栏)。

标签: android android-fragments back


【解决方案1】:

问题是我试图为每个片段设置宿主活动的支持操作栏,这是错误的(我不敢相信我真的这样做了)。

我只是使用工具栏,设置导航图标和对应的监听器:

    Toolbar toolbar = mRootView.findViewById(R.id.toolbar);
    toolbar.setNavigationIcon(R.drawable.ic_arrow_back_white_24dp);
    toolbar.setNavigationOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            getActivity().onBackPressed();
        }
    });

【讨论】:

    【解决方案2】:
    binding.toolbar.setNavigationOnClickListener {
       activity!!.onBackPressed()
    }
    

    【讨论】:

    • 不鼓励仅代码答案请添加 onBackPressed 如何解决片段导航
    【解决方案3】:
    val navHostFragment =
            activity?.supportFragmentManager?.findFragmentById(R.id.main_nav_host_fragment) as NavHostFragment
        val navController = navHostFragment.navController
        val appBarConfiguration = AppBarConfiguration(
            topLevelDestinationIds = setOf()
        )
        binding.toolbar.setupWithNavController(navController, appBarConfiguration)
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2016-05-03
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多