【问题标题】:How can I space out a vertical LinearLayout within a parent vertical LinearLayout so that it fills out the screen?如何在父垂直 LinearLayout 中隔开垂直 LinearLayout 以填充屏幕?
【发布时间】:2017-07-12 17:54:55
【问题描述】:

我目前有以下布局:

突出显示的布局是一个 LinearLayout,其中包含三个额外的水平线性布局(每个 text+seekbar 组合一个)。

我希望突出显示的 LinearLayout 扩展并填充屏幕空间,使“SAVE”按钮位于屏幕底部。

我尝试使用android:layout_weight 并为突出显示布局的每个子项分配相同的权重,但似乎没有什么区别。

以下是我的布局xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/add_mood_layout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginEnd="@dimen/activity_horizontal_margin"
        android:layout_marginStart="@dimen/activity_horizontal_margin"
        android:orientation="horizontal">

        <TextView
            android:id="@+id/because_text"
            style="@style/TextAppearance.AppCompat.Subhead"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:maxLines="1"
            android:text="@string/because" />

        <EditText
            android:id="@+id/moodCommentEditText"
            style="@style/Base.TextAppearance.AppCompat.Body1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginStart="8dp"
            android:hint="@string/add_a_comment_here" />

    </LinearLayout>

<!-- HIGHLIGHTED LAYOUT -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:weightSum="3"
        android:orientation="vertical"
        android:paddingEnd="@dimen/activity_vertical_margin"
        android:paddingStart="@dimen/activity_vertical_margin">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:orientation="horizontal">

            <TextView
                android:id="@+id/happy_text"
                style="@style/TextAppearance.AppCompat.Subhead"
                tools:text="Unhappy"
                android:layout_width="65sp"
                android:layout_height="wrap_content"
                android:maxLines="1" />

            <SeekBar
                android:id="@+id/happiness_seekbar"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:max="100"
                android:theme="@style/happinessSeekbarTheme" />

        </LinearLayout>

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

            <TextView
                android:id="@+id/stress_text"
                style="@style/TextAppearance.AppCompat.Subhead"
                android:layout_width="65sp"
                android:layout_height="wrap_content"

                android:maxLines="1"
                android:text="@string/stress" />

            <SeekBar
                android:id="@+id/stress_seekbar"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:max="100"
                android:theme="@style/stressSeekbarTheme" />
        </LinearLayout>

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

            <TextView
                android:id="@+id/pain_text"
                style="@style/TextAppearance.AppCompat.Subhead"
                android:layout_width="65sp"
                android:layout_height="wrap_content"
                android:maxLines="1"
                android:text="@string/pain" />

            <SeekBar
                android:id="@+id/pain_seekbar"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:max="100"
                android:maxHeight="3dp"
                android:theme="@style/painSeekbarTheme" />

        </LinearLayout>

    </LinearLayout>

    <Button
        android:id="@+id/saveButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:background="@android:color/transparent"
        android:text="@string/save"
        android:textColor="@color/colorPrimary"
        android:textSize="15dp" />
</LinearLayout>

【问题讨论】:

  • 你尝试过使用RelativeLayout吗?
  • @damememan 预期输出将有助于给出更好的答案
  • @Goran 我想避免使用RelativeLayout,因为据我所知,分隔事物的唯一方法是使用边距和填充,这可能会导致不同屏幕尺寸的行为不可预测。

标签: android android-linearlayout android-view spacing android-layout-weight


【解决方案1】:

尝试将最顶部的LinearLayoutandroid:layout_height 设置为match_parent - 目前设置为wrap_content,这意味着它将缩小到允许其正确渲染其子级的最小高度。

【讨论】:

    【解决方案2】:
    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/add_mood_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginEnd="@dimen/activity_horizontal_margin"
        android:layout_marginStart="@dimen/activity_horizontal_margin"
        android:orientation="horizontal">
    
        <TextView
            android:id="@+id/because_text"
            style="@style/TextAppearance.AppCompat.Subhead"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:maxLines="1"
            android:text="@string/because" />
    
        <EditText
            android:id="@+id/moodCommentEditText"
            style="@style/Base.TextAppearance.AppCompat.Body1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginStart="8dp"
            android:layout_marginLeft="8dp"
            android:hint="@string/add_a_comment_here" />
    
    </LinearLayout>
    
    <!-- HIGHLIGHTED LAYOUT -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:orientation="vertical"
        android:paddingEnd="@dimen/activity_vertical_margin"
        android:paddingStart="@dimen/activity_vertical_margin">
    
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:orientation="horizontal">
    
            <TextView
                android:id="@+id/happy_text"
                style="@style/TextAppearance.AppCompat.Subhead"
                tools:text="Unhappy"
                android:layout_width="65sp"
                android:layout_height="wrap_content"
                android:maxLines="1" />
    
            <SeekBar
                android:id="@+id/happiness_seekbar"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:max="100"
                android:theme="@style/happinessSeekbarTheme" />
    
        </LinearLayout>
    
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1">
    
            <TextView
                android:id="@+id/stress_text"
                style="@style/TextAppearance.AppCompat.Subhead"
                android:layout_width="65sp"
                android:layout_height="wrap_content"
    
                android:maxLines="1"
                android:text="@string/stress" />
    
            <SeekBar
                android:id="@+id/stress_seekbar"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:max="100"
                android:theme="@style/stressSeekbarTheme" />
        </LinearLayout>
    
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1">
    
            <TextView
                android:id="@+id/pain_text"
                style="@style/TextAppearance.AppCompat.Subhead"
                android:layout_width="65sp"
                android:layout_height="wrap_content"
                android:maxLines="1"
                android:text="@string/pain" />
    
            <SeekBar
                android:id="@+id/pain_seekbar"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:max="100"
                android:maxHeight="3dp"
                android:theme="@style/painSeekbarTheme" />
    
        </LinearLayout>
    
    </LinearLayout>
    
    <Button
        android:id="@+id/saveButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:background="@android:color/transparent"
        android:text="@string/save"
        android:textColor="@color/colorPrimary"
        android:textSize="15sp" />
    </LinearLayout>
    

    【讨论】:

      【解决方案3】:

      您可以使用辅助 SPACE 视图解决此问题。

      您添加一个带有权重的空视图 - 这样它将强制 LinearLayout 中的以下视图位于末尾。

      注意:Android 对此有一个特殊的视图 Space,但它只在 API 级别 14 中使用。

      像这样:

      <?xml version="1.0" encoding="utf-8"?>
      <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
          xmlns:tools="http://schemas.android.com/tools"
          android:id="@+id/add_mood_layout"
          android:layout_width="match_parent"
          android:layout_height="match_parent" <!-- Also changed this -->
          android:orientation="vertical">
      
      <LinearLayout
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:layout_marginEnd="@dimen/activity_horizontal_margin"
          android:layout_marginStart="@dimen/activity_horizontal_margin"
          android:orientation="horizontal">
      
          <TextView
              android:id="@+id/because_text"
              style="@style/TextAppearance.AppCompat.Subhead"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:maxLines="1"
              android:text="@string/because" />
      
          <EditText
              android:id="@+id/moodCommentEditText"
              style="@style/Base.TextAppearance.AppCompat.Body1"
              android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:layout_marginStart="8dp"
              android:hint="@string/add_a_comment_here" />
      
      </LinearLayout>
      
      <!-- HIGHLIGHTED LAYOUT -->
      <LinearLayout
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:weightSum="3"
          android:orientation="vertical"
          android:paddingEnd="@dimen/activity_vertical_margin"
          android:paddingStart="@dimen/activity_vertical_margin">
      
          <LinearLayout
              android:layout_width="match_parent"
              android:layout_height="0dp"
              android:layout_weight="1"
              android:orientation="horizontal">
      
              <TextView
                  android:id="@+id/happy_text"
                  style="@style/TextAppearance.AppCompat.Subhead"
                  tools:text="Unhappy"
                  android:layout_width="65sp"
                  android:layout_height="wrap_content"
                  android:maxLines="1" />
      
              <SeekBar
                  android:id="@+id/happiness_seekbar"
                  android:layout_width="match_parent"
                  android:layout_height="wrap_content"
                  android:max="100"
                  android:theme="@style/happinessSeekbarTheme" />
      
          </LinearLayout>
      
          <LinearLayout
              android:layout_width="match_parent"
              android:layout_height="0dp"
              android:layout_weight="1">
      
              <TextView
                  android:id="@+id/stress_text"
                  style="@style/TextAppearance.AppCompat.Subhead"
                  android:layout_width="65sp"
                  android:layout_height="wrap_content"
      
                  android:maxLines="1"
                  android:text="@string/stress" />
      
              <SeekBar
                  android:id="@+id/stress_seekbar"
                  android:layout_width="match_parent"
                  android:layout_height="wrap_content"
                  android:max="100"
                  android:theme="@style/stressSeekbarTheme" />
          </LinearLayout>
      
          <LinearLayout
              android:layout_width="match_parent"
              android:layout_height="0dp"
              android:layout_weight="1">
      
              <TextView
                  android:id="@+id/pain_text"
                  style="@style/TextAppearance.AppCompat.Subhead"
                  android:layout_width="65sp"
                  android:layout_height="wrap_content"
                  android:maxLines="1"
                  android:text="@string/pain" />
      
              <SeekBar
                  android:id="@+id/pain_seekbar"
                  android:layout_width="match_parent"
                  android:layout_height="wrap_content"
                  android:max="100"
                  android:maxHeight="3dp"
                  android:theme="@style/painSeekbarTheme" />
      
          </LinearLayout>
      
      </LinearLayout>
      
      <!-- Space View: Add this view here for white space -->
      <View
          android:layout_width="match_parent"
          android:layout_height="0px"
          android:layout_weight="1"/>
      
      <Button
          android:id="@+id/saveButton"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:layout_gravity="center"
          android:background="@android:color/transparent"
          android:text="@string/save"
          android:textColor="@color/colorPrimary"
          android:textSize="15dp" />
      </LinearLayout>
      

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2023-03-31
        • 1970-01-01
        • 1970-01-01
        • 2014-03-16
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多