约束布局作为屏幕高度的50%?

3
我在Android Studio中有一个ConstraintLayout,我希望它的高度能够根据设备屏幕大小的60%来设置。我想知道如何在xml中实现这个功能。
目前,我的代码是:
<androidx.constraintlayout.widget.ConstraintLayout
     android:id="@+id/recycler_view_container"
     android:layout_width="match_parent"
     android:layout_height="372dp" // BAD!! HARDCODED
     android:background="@color/white">

     ...

</androidx.constraintlayout.widget.ConstraintLayout>

我该怎么做呢?就像你看到的,layout_height现在是硬编码的。

3个回答

6

以下是我的回答。我认为它应该能够满足您的要求。

<androidx.constraintlayout.widget.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:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorWhite">

<androidx.constraintlayout.widget.ConstraintLayout 
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="@color/colorRed"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintHeight_percent="0.50">

</androidx.constraintlayout.widget.ConstraintLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

您可以根据您的需要更改高度百分比。谢谢。


3

直接做不到,不过您可以在ConstraintLayout中放置一个高度占比指南。 然后子视图可以使用该约束设置其高度。

<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_height="match_parent"
    android:layout_width="match_parent"
    >

    <androidx.constraintlayout.widget.Guideline
        android:id="@+id/guide"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.6"
        />

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/rcv"
        android:layout_height="0dp"
        android:layout_width="0dp"
        app:layout_constraintBottom_toTopOf="@id/guide"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        />

</androidx.constraintlayout.widget.ConstraintLayout>

我猜你的ConstraintLayout是用来包含RecyclerView的?

是的,约束布局包含了RecyclerView,我会试一下的,谢谢! - testingsah

0

你需要使用不等的LayoutWeight。

LinearLayout支持使用android:layout_weight属性为单个子项分配权重。该属性根据视图在屏幕上应占用的空间量分配“重要性”值。将子视图的layout_height设置为0,并按所需的比例为每个子视图分配屏幕比例。

这是我为您的规格设置XML的方式,代码中包括注释。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"> // Note: set orientation to vertical 

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="0dp" // Note: Set the layout_height to 0
        android:layout_weight="6" // Note: Set weight to 6
        android:background="@color/colorAccent"/>

     // Framelayout need to fill remain space
    <FrameLayout 
        android:layout_width="match_parent"
        android:layout_height="0dp" // Set the layout_height to 0
        android:layout_weight="4"/> // set the weight to 4
</LinearLayout>


约束布局的权重为6,FrameLayout的权重为4,LinearLayout的总权重为10。6/10是60%,约束布局将填充屏幕的60%。
问题在我发布答案后已更改,您还可以进行平均分配,即对每个子视图分配相同的权重值,屏幕将在子视图之间平均分配。
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:background="@color/colorAccent"/>

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"/>
</LinearLayout>

ConstraintLayout的权重为1,而FrameLayout的权重也为1,总布局权重为2。1/2等于50%,因此ConstraintLayout将占据屏幕的50%。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接