Как установить высоту для дочерних элементов макета координатора в процентах?

Я хочу создать макет, состоящий из: панели инструментов в верхней части макета (которая должна занимать 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 в процентах?


person Raducu Mihai    schedule 07.11.2018    source источник


Ответы (2)


В вашем вопросе есть две вещи, на которые следует обратить внимание. Во-первых, как заставить нижний лист заполнить родительский лист, когда он развернут.

Это довольно просто: установите 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);
    }
});
person Ben P.    schedule 07.11.2018
comment
Во-первых, извините, что так поздно отвечаю. Во-вторых, я использую C# и Xamarin, но проблем нет. Итак, согласно тому, что вы говорите, мой эскиз макета должен выглядеть так: <CoordinatorLayout> <LinearLayout> <Toolbar> <ViewPager> </LinearLayout> <BottomSheet> </CoordinatorLayout> ‹Toolbar› и ‹ViewPager› размещены внутри ‹LinearLayout›, поэтому я могу установить их precentage с помощью атрибута layout_weight. ‹br› После того, как я объявлю файл макета таким образом, я должен использовать ваш код, чтобы BottomSheet заполнил 20% экрана, верно? - person Raducu Mihai; 16.11.2018
comment
Я думаю, просто <CoordinatorLayout><Toolbar/><ViewPager/><BottomSheet/></CoordinatorLayout>. Нет необходимости в LinearLayout в любом месте. - person Ben P.; 16.11.2018
comment
Хорошо, но если я не использую LinearLayout в качестве родителя для панели инструментов и ViewPager, как я могу установить их высоту на 20% и 60% экрана? - person Raducu Mihai; 16.11.2018
comment
@RaducuMihai смотрите мой обновленный ответ. Это своего рода облом, что вам нужно делать все это ручное позиционирование представлений, но CoordinatorLayout просто не поддерживает это из коробки, поэтому вам нужно делать это самостоятельно. - person Ben P.; 16.11.2018
comment
Я это понимаю. У меня было так много попыток, чтобы сделать это, я думаю, что уже пытался сделать это по вашему методу, может быть, я сделал что-то не так. Я попробую ваш код и сообщу, работает ли он. Большое тебе спасибо. - person Raducu Mihai; 16.11.2018

Я знаю, что уже слишком поздно, но этот ответ может кому-то помочь...

Я достиг макета половины экрана с помощью кода ниже.

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

Я хотел покрыть половину экрана устройства любого размера, поэтому я разделил на 2, вы можете покрыть желаемый размер экрана устройства с помощью приведенного выше кода, изменив разделитель.

поместите этот код в действие, где появится ваш нижний лист. (в методе onCreate)

в коде bottom_sheet — это идентификатор корневого макета нижнего листа.

person JaiminKumar Patel    schedule 03.06.2020