【问题标题】:How to set height for Coordinator Layout's childs in percentage?如何以百分比设置 Coordinatorlayout 孩子的高度?
【发布时间】:2019-04-11 09:08:23
【问题描述】:

我想设计一个布局,由以下部分组成:布局顶部的工具栏(应占屏幕的 20%),然后是垂直下方的 ViewPager(应占屏幕的 60%)和然后,仍然在垂直下方,一个 BottomSheet(折叠时应占屏幕的 20%,展开时应占屏幕的 100%)。
现在我已像这样声明底部表:

<LinearLayout
    android:id="@+id/BSSECONDTOOLBAR"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="???"
    app:layout_behavior="android.support.design.widget.BottomSheetBehavior"
    android:layout_gravity="bottom"
    android:gravity="bottom"
    android:background="#f44242" />

由于这应该是 CoordinatorLayout 的直接子代,因此我不能使用 layout_weight 属性。

我的问题是如何以百分比设置 BottomSheet 高度?

【问题讨论】:

    标签: android android-coordinatorlayout bottom-sheet


    【解决方案1】:

    您的问题有两点需要解决。第一个是如何让底部的sheet在展开时填充父级。

    这很简单:设置android:layout_height="match_parent"

    然后我们必须解决将底部工作表的窥视高度设置为父级的 20% 的问题。这在 XML 中是不可能的,因为CoordinatorLayout 不支持权重或百分比​​。因此,我们必须在 Java 中设置它。您可以将此代码添加到您的 onCreate() 方法中:

    // assume `coordinator` is your CoordinatorLayout
    
    coordinator.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
        @Override
        public void onGlobalLayout() {
            coordinator.getViewTreeObserver().removeOnGlobalLayoutListener(this);
    
            int twentyPercent = (coordinator.getHeight() / 5);
    
            // make the toolbar 20% of the screen
            View toolbar = findViewById(R.id.your_toolbar_id);
            ViewGroup.LayoutParams toolbarParams = toolbar.getLayoutParams();
            toolbarParams.height = twentyPercent;
            toolbar.setLayoutParams(toolbarParams);
    
            // make the viewpager the rest of the screen (60%)
            View pager = findViewById(R.id.your_viewpager_id);
            ViewGroup.MarginLayoutParams pagerParams = (ViewGroup.MarginLayoutParams) pager.getLayoutParams();
            pagerParams.topMargin = twentyPercent;
            pagerParams.height = (coordinator.getHeight() - (twentyPercent * 2));
            pager.setLayoutParams(pagerParams);
    
            // make the bottomsheet 20% of the screen
            View bottomSheet = findViewById(R.id.BSSECONDTOOLBAR);
            BottomSheetBehavior<View> behavior = BottomSheetBehavior.from(bottomSheet);
            behavior.setPeekHeight(twentyPercent);
        }
    });
    

    【讨论】:

    • 首先很抱歉这么晚才回复。其次,我使用的是 C# 和 Xamarin,但没有问题。所以,根据你所说,我的布局草图应该如下所示:&lt;CoordinatorLayout&gt; &lt;LinearLayout&gt; &lt;Toolbar&gt; &lt;ViewPager&gt; &lt;/LinearLayout&gt; &lt;BottomSheet&gt; &lt;/CoordinatorLayout&gt; 放在 内,所以我可以使用 layout_weight 属性设置它们的百分比。
      以这种方式声明布局文件后,我应该使用您的代码使 BottomSheet 填充 20% 的屏幕,对吗?
    • 我认为只是&lt;CoordinatorLayout&gt;&lt;Toolbar/&gt;&lt;ViewPager/&gt;&lt;BottomSheet/&gt;&lt;/CoordinatorLayout&gt;。任何地方都不需要 LinearLayout。
    • 好的,但是如果我不使用 LinearLayout 作为 Toolbar 和 ViewPager 的父级,如何将它们的高度设置为屏幕的 20% 和 60%?
    • @RaducuMihai 看到我更新的答案。您必须手动定位视图,这有点令人遗憾,但CoordinatorLayout 根本不支持开箱即用的东西,所以您必须自己做。
    • 我明白这一点。为了完成这项工作,我进行了很多尝试,我想我已经尝试使用您的方法来完成它,也许我做错了什么。我会试试你的代码,让你知道它是否有效。非常感谢。
    【解决方案2】:

    我知道这为时已晚,但这个答案可能会对某人有所帮助......

    我通过下面的代码实现了半屏布局。

    BottomSheetBehavior.from(bottom_sheet).peekHeight =
            (Resources.getSystem().getDisplayMetrics().heightPixels)/2
    

    我想覆盖任何尺寸设备的半屏,因此我将其除以 2,您可以通过上面的代码通过更改分隔符来覆盖您想要的设备屏幕尺寸。

    将此代码放在将弹出底部工作表的活动中。 (在onCreate方法中)

    在代码中,bottom_sheet 是给底部工作表根布局的 id。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2021-03-13
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2012-04-05
      • 2013-03-24
      • 2012-10-03
      相关资源
      最近更新 更多