3.14培训日记

最新推荐文章于 2023-06-16 14:29:59 发布

原创最新推荐文章于 2023-06-16 14:29:59 发布 · 196 阅读

CC 4.0 BY-SA版权

本文通过一个具体的实例展示了如何使用RelativeLayout进行界面布局优化。包括了多个ImageView和TextView组件的精确位置调整，以及不同元素间的对齐方式。通过对每个元素的布局参数进行细致设置，实现了良好的视觉效果。

优化一下

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="60dp"
    android:background="#F2F2F2"
    >
    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@mipmap/index_logo"
        android:layout_marginLeft="20dp"
        android:layout_centerVertical="true"/>

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@mipmap/index_06"
        android:layout_centerInParent="true"
        android:layout_alignParentRight="true"
        android:layout_marginRight="20dp"/>
</RelativeLayout>

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


    <ImageView
        android:id="@+id/imageView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_alignStart="@+id/imageView5"
        android:layout_marginTop="9dp"
        android:background="@mipmap/index_11" />

    <ImageView
        android:id="@+id/imageView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignEnd="@+id/textView2"
        android:layout_alignTop="@+id/imageView"
        android:layout_marginRight="5dp"
        android:layout_marginTop="12dp"
        android:background="@mipmap/index_19_14" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignEnd="@+id/imageView"
        android:layout_below="@+id/imageView2"
        android:layout_marginEnd="31dp"
        android:layout_marginTop="20dp"
        android:text="机票预定"
        android:textColor="#ffffff"
        android:textSize="18sp" />

    <ImageView
        android:id="@+id/imageView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignEnd="@+id/imageView7"
        android:layout_alignTop="@+id/imageView"
        android:background="@mipmap/index_11" />

    <ImageView
        android:id="@+id/imageView4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignEnd="@+id/imageView3"
        android:layout_alignTop="@+id/imageView2"
        android:layout_marginEnd="32dp"
        android:layout_marginTop="6dp"
        android:background="@mipmap/index_19_17" />

    <TextView
        android:id="@+id/textView7"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBaseline="@+id/textView2"
        android:layout_alignBottom="@+id/textView2"
        android:layout_alignStart="@+id/imageView4"
        android:text="航班动态"
        android:textColor="#ffffff"
        android:textSize="18sp" />

    <ImageView
        android:id="@+id/imageView5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_below="@+id/imageView"
        android:layout_marginLeft="15dp"
        android:layout_marginStart="43dp"
        android:layout_marginTop="12dp"
        android:background="@mipmap/index_11" />

    <ImageView
        android:id="@+id/imageView6"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@+id/textView3"
        android:layout_alignStart="@+id/textView3"
        android:layout_marginBottom="13dp"
        android:background="@mipmap/index_19_23" />

    <TextView
        android:id="@+id/textView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/imageView5"
        android:layout_alignEnd="@+id/imageView5"
        android:layout_marginBottom="7dp"
        android:layout_marginEnd="28dp"
        android:text="特价机票"
        android:textColor="#ffffff"
        android:textSize="18sp" />

    <ImageView
        android:id="@+id/imageView7"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentEnd="true"
        android:layout_alignTop="@+id/imageView5"
        android:layout_marginEnd="40dp"
        android:background="@mipmap/index_11" />

    <ImageView
        android:id="@+id/imageView8"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignEnd="@+id/imageView7"
        android:layout_alignTop="@+id/imageView6"
        android:layout_marginEnd="22dp"
        android:background="@mipmap/index_19_26" />

    <TextView
        android:id="@+id/textView6"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/textView3"
        android:layout_alignStart="@+id/imageView8"
        android:layout_alignTop="@+id/textView3"
        android:layout_marginLeft="10dp"
        android:text="我的航班"
        android:textColor="#ffffff"
        android:textSize="18sp" />

    <ImageView
        android:id="@+id/imageView9"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignStart="@+id/imageView5"
        android:layout_marginBottom="8dp"
        android:background="@mipmap/index_11" />

    <ImageView
        android:id="@+id/imageView10"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@+id/textView5"
        android:layout_alignEnd="@+id/textView2"
        android:layout_marginBottom="24dp"
        android:background="@mipmap/index_19_33" />

    <TextView
        android:id="@+id/textView5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/imageView9"
        android:layout_alignEnd="@+id/textView3"
        android:layout_marginBottom="12dp"
        android:layout_marginLeft="15dp"
        android:text="GARS会员"
        android:textColor="#ffffff"
        android:textSize="18sp" />

    <ImageView
        android:id="@+id/imageView11"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignStart="@+id/imageView7"
        android:layout_alignTop="@+id/imageView9"
        android:background="@mipmap/index_11" />

    <ImageView
        android:id="@+id/imageView12"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@+id/textView5"
        android:layout_alignEnd="@+id/textView6"
        android:layout_marginBottom="9dp"
        android:background="@mipmap/index_19_31" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/imageView11"
        android:layout_alignEnd="@+id/imageView8"
        android:layout_alignStart="@+id/textView7"
        android:layout_below="@+id/imageView12"
        android:text="旅行帮助"
        android:textColor="#ffffff"
        android:textSize="18sp" />
</RelativeLayout>