在Android的RelativeLayout中从底部和顶部定位视图



我有一个非常简单的布局,两个TextViews一个在另一个下面,TextViews下面是三个水平对齐的ImageViews

我能够相对放置这些视图时,设置位置在彼此之下,并指定上边距。但是对于三个ImageViews,我希望能够从屏幕底部设置边距。不幸的是,我没有能够实现这一点使用RelativeLayout .

我想问专家的是,这到底有没有可能?我的布局如下:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
    android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:id="@+id/layoutMain"
    tools:context=".MainActivity$PlaceholderFragment">
    <TextView android:id="@+id/section_label" android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
    <TextView
        android:layout_width="300sp"
        android:layout_height="300sp"
        android:textSize="250sp"
        android:textStyle="bold"
        android:textColor="@android:color/black"
        android:textAlignment="center"
        android:gravity="center"
        android:id="@+id/imgItem"
        android:layout_marginTop="2sp"
        android:layout_centerHorizontal="true" />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="35sp"
        android:textStyle="bold"
        android:textColor="@android:color/black"
        android:textAlignment="center"
        android:gravity="center"
        android:text="Large Text"
        android:id="@+id/txtItemSmall"
        android:layout_below="@+id/imgItem"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="10sp" />
    <View
        android:layout_width="match_parent"
        android:id="@+id/dividerTop"
        android:alpha="0.5"
        android:layout_height="3dp"
        android:background="@android:color/black"
        android:layout_below="@id/imgItem"
        android:layout_marginTop="115sp"/>
    <ImageView
        android:layout_width="64sp"
        android:layout_height="64sp"
        android:alpha="0.5"
        android:layout_marginTop="10sp"
        android:id="@+id/btnRandom"
        android:layout_centerHorizontal="true"
        android:layout_below="@id/dividerTop"
        android:src="@drawable/ic_random"/>
    <ImageView
        android:layout_width="64sp"
        android:layout_height="64sp"
        android:alpha="0.5"
        android:layout_marginTop="10sp"
        android:layout_marginRight="50sp"
        android:id="@+id/btnPrevious"
        android:layout_below="@id/dividerTop"
        android:layout_toLeftOf="@id/btnRandom"
        android:src="@drawable/ic_previous"/>
    <ImageView
        android:layout_width="64sp"
        android:layout_height="64sp"
        android:alpha="0.5"
        android:layout_marginTop="10sp"
        android:layout_marginLeft="50sp"
        android:id="@+id/btnNext"
        android:layout_below="@id/dividerTop"
        android:layout_toRightOf="@id/btnRandom"
        android:src="@drawable/ic_next"/>
    <View
        android:layout_width="match_parent"
        android:id="@+id/dividerBottom"
        android:alpha="0.5"
        android:layout_height="3dp"
        android:background="@android:color/black"
        android:layout_below="@id/btnRandom"
        android:layout_marginTop="10sp"/>
</RelativeLayout>

你可以用LinearLayout或RelativeLayout来包装ImageViews。然后使用android:layout_alignParentBottom="true"

    <RelativeLayout
        ...
        android:layout_alignParentBottom="true"
        android:layout_marginBottom="100dp">
        <ImageView
        ...
    </RelativeLayout>

在水平线性布局中包围三个imageview,并将线性布局与底部父元素对齐,并设置margin

 <RelativeLayout
  android:layout_width="match_parent"
  android:layout_height="64sp"
  android:layout_marginTop="10dp"
  android:layout_below="@id/dividerTop"
  android:layout_alignParentBottom="true"
  android:layout_marginbottom="50dp" > <-- your own offset from bottom --!>
    <ImageView
        android:layout_width="64sp"
        android:layout_height="64sp"
        android:alpha="0.5"
        android:id="@+id/btnRandom"
        android:layout_centerHorizontal="true"
        android:src="@drawable/ic_random"/>
    <ImageView
        android:layout_width="64sp"
        android:layout_height="64sp"
        android:alpha="0.5"
        android:layout_marginRight="50sp"
        android:id="@+id/btnPrevious"
        android:layout_toLeftOf="@id/btnRandom"
        android:src="@drawable/ic_previous"/>
    <ImageView
        android:layout_width="64sp"
        android:layout_height="64sp"
        android:alpha="0.5"
        android:layout_marginLeft="50sp"
        android:id="@+id/btnNext"
        android:layout_toRightOf="@id/btnRandom"
        android:src="@drawable/ic_next"/>
 </RelativeLayout>

你可以这样做

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/layoutMain"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity$PlaceholderFragment">
    <TextView
        android:id="@+id/section_label"
        android:layout_width="wrap_content"
        android:text="Hiii"
        android:layout_height="wrap_content" />
    <TextView
        android:id="@+id/imgItem"
        android:layout_width="300sp"
        android:layout_height="300sp"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="2sp"
        android:gravity="center"
        android:textAlignment="center"
        android:text="Hiiii2"
        android:textColor="@android:color/black"
        android:textSize="250sp"
        android:textStyle="bold" />
    <TextView
        android:id="@+id/txtItemSmall"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/imgItem"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="10sp"
        android:gravity="center"
        android:text="Large Text"
        android:textAlignment="center"
        android:textColor="@android:color/black"
        android:textSize="35sp"
        android:textStyle="bold" />
    <View
        android:id="@+id/dividerTop"
        android:layout_width="match_parent"
        android:layout_height="3dp"
        android:layout_above="@id/btnRandom"
        android:alpha="0.5"
        android:background="@android:color/black" />
    <ImageView
        android:id="@+id/btnRandom"
        android:layout_width="64sp"
        android:layout_height="64sp"
        android:layout_above="@id/dividerBottom"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="10dp"
        android:alpha="0.5"
        android:src="@drawable/ic_random" />
    <ImageView
        android:id="@+id/btnPrevious"
        android:layout_width="64sp"
        android:layout_height="64sp"
        android:layout_above="@id/dividerBottom"
        android:layout_marginRight="50sp"
        android:layout_marginBottom="10dp"
        android:layout_toLeftOf="@id/btnRandom"
        android:alpha="0.5"
        android:src="@drawable/ic_previous" />
    <ImageView
        android:id="@+id/btnNext"
        android:layout_width="64sp"
        android:layout_height="64sp"
        android:layout_above="@id/dividerBottom"
        android:layout_marginLeft="50sp"
        android:layout_marginBottom="10dp"
        android:layout_toRightOf="@id/btnRandom"
        android:alpha="0.5"
        android:src="@drawable/ic_next" />
    <View
        android:id="@+id/dividerBottom"
        android:layout_width="match_parent"
        android:layout_height="3dp"
        android:layout_alignParentBottom="true"
        android:alpha="0.5"
        android:background="@android:color/black" />
</RelativeLayout>
使用

dp sp 利润。

我终于明白了。视图需要按照您希望从底部开始的顺序添加,而不能按照它们在屏幕上显示的顺序添加。以下是更新后的布局,和预期的完全一样。

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
    android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:id="@+id/layoutMain"
    tools:context=".MainActivity$PlaceholderFragment">
    <TextView android:id="@+id/section_label" android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
    <TextView
        android:layout_width="300sp"
        android:layout_height="300sp"
        android:textSize="250sp"
        android:textStyle="bold"
        android:textColor="@android:color/black"
        android:textAlignment="center"
        android:gravity="center"
        android:id="@+id/imgItem"
        android:layout_marginTop="2sp"
        android:layout_centerHorizontal="true" />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="35sp"
        android:textStyle="bold"
        android:textColor="@android:color/black"
        android:textAlignment="center"
        android:gravity="center"
        android:text="Large Text"
        android:id="@+id/txtItemSmall"
        android:layout_below="@+id/imgItem"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="10sp" />

    <View
        android:id="@+id/dividerBottom"
        android:layout_width="match_parent"
        android:layout_height="3dp"
        android:layout_alignParentBottom="true"
        android:layout_marginBottom="70sp"
        android:alpha="0.5"
        android:background="@android:color/black" />

    <ImageView
        android:layout_width="64sp"
        android:layout_height="64sp"
        android:alpha="0.5"
        android:id="@+id/btnRandom"
        android:layout_centerHorizontal="true"
        android:layout_above="@id/dividerBottom"
        android:layout_marginBottom="10sp"
        android:src="@drawable/ic_random"/>
    <ImageView
        android:layout_width="64sp"
        android:layout_height="64sp"
        android:alpha="0.5"
        android:layout_marginRight="50sp"
        android:id="@+id/btnPrevious"
        android:layout_above="@id/dividerBottom"
        android:layout_marginBottom="10sp"
        android:layout_toLeftOf="@id/btnRandom"
        android:src="@drawable/ic_previous"/>
    <ImageView
        android:layout_width="64sp"
        android:layout_height="64sp"
        android:alpha="0.5"
        android:layout_marginLeft="50sp"
        android:id="@+id/btnNext"
        android:layout_above="@id/dividerBottom"
        android:layout_marginBottom="10sp"
        android:layout_toRightOf="@id/btnRandom"
        android:src="@drawable/ic_next"/>
    <View
        android:layout_width="match_parent"
        android:id="@+id/dividerTop"
        android:alpha="0.5"
        android:layout_height="3dp"
        android:background="@android:color/black"
        android:layout_above="@id/btnRandom"
        android:layout_marginBottom="10sp" />
</RelativeLayout>

最新更新