android xml 屏幕外的元素

Question

所以我试图在 android 项目上修复我的 UI，但是一些元素最终在我当前的 xml 屏幕之外。我不知道为什么，这就是我问这个问题的原因。

我有一个包含歌曲的列表视图和两个带有当前歌曲艺术家和歌曲名称的文本视图。在其下，我有 3 个浮动操作按钮。（转发，play/pause/next）

代码：

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/listContainer"
        android:layout_marginBottom="100dp"
        >
        <ListView
            android:id="@+id/list_view"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:clipToPadding="false"
            android:paddingBottom="@dimen/activity_vertical_margin"
            android:paddingLeft="@dimen/activity_horizontal_margin"
            android:paddingRight="@dimen/activity_horizontal_margin"
            android:paddingTop="@dimen/activity_vertical_margin"/>
    </LinearLayout>
    <TextView
        android:id="@+id/currentSongName"
        android:layout_below="@+id/listContainer"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#B2B6B8"
        android:text="TEST"
        />
    <TextView
        android:id="@+id/currentSongArtist"
        android:layout_below="@+id/currentSongName"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#B2B6B8"
        android:text="TEST"
        />
    <LinearLayout
        android:layout_below="@+id/currentSongArtist"
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center_horizontal"
        android:weightSum="3"
        android:background="#B2B6B8"
        >

        <android.support.design.widget.FloatingActionButton
            android:id="@+id/prev_song"
            android:layout_weight="1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|end"
            android:layout_margin="@dimen/fab_margin"
            android:src="@android:drawable/ic_media_previous" />

        <android.support.design.widget.FloatingActionButton
            android:id="@+id/play_pause"
            android:layout_weight="1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|end"
            android:layout_margin="@dimen/fab_margin"
            android:src="@android:drawable/ic_media_pause" />

        <android.support.design.widget.FloatingActionButton
            android:id="@+id/next_song"
            android:layout_weight="1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|end"
            android:layout_margin="@dimen/fab_margin"
            android:src="@android:drawable/ic_media_next" />

    </LinearLayout>
</RelativeLayout>

然而，当我使用时；

android:layout_below="@+id/listContainer"

在第一个 textView 中，listContainer 下面的所有 UI 元素都消失了。当我删除它时，所有所述元素都与列表视图的顶部和顶部对齐。

为什么会这样，如何放置文本字段和按钮线性布局，使其在列表视图边距下方对齐？

Answer 1

问题是您的 ListView 及其 parent LinearLayout 的高度为 match_parent。这意味着这两个元素将与 parent 元素一样高。

如果您尝试将视图放置在占据整个屏幕高度的视图下方，它们将位于屏幕底部下方的某个位置。

"right" 解决方案在一定程度上取决于您的具体目标。有时您需要自下而上而不是自上而下地考虑您的布局。一种解决方案是这样的，它将底部视图与屏幕底部和该视图上方的列表对齐：

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

    <ListView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_above="@+id/bottom_view" />

    <TextView
        android:id="@+id/bottom_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true" />

</RelativeLayout>

android xml 屏幕外的元素

Elements outside screen in android xml

xml

android

listview

android-linearlayout

android-relativelayout