如何确保视图在屏幕边界内

时间:2015-06-10 15:12:52

标签: android android-layout

我有3个相对布局(让我们称之为视图组)并像这样布局

           VIEWGROUP 1
           VIEWGROUP 2
           VIEWGROUP 3

我希望VIEWGROUP 1和VIEWGROUP 3占用显示其内容所需的空间。然后,剩下的空间被分配给ViewGroup2(其内容将是可滚动的)。目前我有一个根相对布局,为每个组添加" layout_below"属性参考前一个。

当VIEWGROUP 2(比如说它的textview组件)很大时,它会将VIEWGROUP3推出屏幕。

您如何建议修复此问题?我知道有一个"硬编码"通过指定特定的布局高度进行修复的方法,但我想避免硬编码并应用"使用剩余的空间"

谢谢

2 个答案:

答案 0 :(得分:1)

将VIEWGROUP3锚定到屏幕底部,让VIEWGROUP2为layout_below VIEWGROUP1和layout_above VIEWGROUP3。要使其占用剩余的屏幕,请将VIEWGROUP2的高度设置为match_parent,将其他视图设置为wrap_content

答案 1 :(得分:1)

看来你有两个不同的问题。

问题1:为第3个视图分配额外空间

解决方案:使用LinearLayout作为父级,并将layout_weight应用于第3个子视图

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"><!-- LinearLayout height must match_parent -->

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

    </RelativeLayout>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

    </RelativeLayout>

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

    </RelativeLayout>

</LinearLayout>

问题2:前两个布局推出第三个关闭屏幕。

解决方案a:确保前两个布局更小(不知道细节可能不是一个选项)

解决方案b:滚动整个屏幕(最简单的解决方案IMO)

执行此操作,您不希望使用上面发布的weight_sum。而是将每一个包裹在ScrollView

<ScrollView
    android:layout_width="match_parent"
    android:layout_height="match_parent"><!-- Important ScrollView height match paternt -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"><!-- Important child view height wrap content -->

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

        </RelativeLayout>

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

        </RelativeLayout>

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="0dp">

        </RelativeLayout>

    </LinearLayout>
</ScrollView>

修改 在回复您的评论时,您可以使中间视图仅滚动。这可行,但有一些潜在的问题。

  1. 中间视图不会展开以填充空白区域。
  2. 如果您的顶视图或底视图变大,则很难滚动。

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
    
    </RelativeLayout>
    
    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"><!-- height 0dp with layout_weight -->
        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"><!-- height wrap_content -->
        </RelativeLayout>
    
    </ScrollView>
    
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
    
    </RelativeLayout>
    

  3. 或者如果您更喜欢使用RelativeLayouts

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"><!-- height match_parent -->
    
        <RelativeLayout
            android:id="@+id/layout_1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
    
        </RelativeLayout>
    
        <RelativeLayout
            android:id="@+id/layout_3"
            android:layout_alignParentBottom="true"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
    
        </RelativeLayout>
    
        <ScrollView
            android:layout_above="@id/layout_3"
            android:layout_below="@id/layout_1"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
    
            <RelativeLayout
                android:id="@+id/layout_2"
                android:layout_width="match_parent"
                android:layout_height="wrap_content">
            </RelativeLayout>
    
        </ScrollView>
    
    
    </RelativeLayout>