第三篇Android零基础自学笔记——相对布局（RelativeLayout）

这一篇我们接着来学习Android的常用布局，没有阅读上一篇的建议先阅读…点击进入第二篇

一句话说清相对布局的特点：
   通过设置其相对于父容器或其它控件的位置来设置自身的位置

常用属性：
   1. android:layout_below 指在某元素的下方
   2. android:layout_above 指在某元素的上方
   3. android:layout_toLeftOf 指在某元素的左边
   4. android:layout_toRightOf 指在某元素的右边
   5. android:layout_alignParentRight 指位于父布局的最右边（上下左右同理）

---

使用相对布局（RelativeLayout）来实现第二篇界面中的个人信息部分吧

---

——界面布局解析图及效果图——



实现了一模一样的效果但是代码复杂度就简洁很多了，相信单看这个布局解析图就能感受到了吧

---

贴上完整的界面代码，再来看看吧

    <!--最外层的相对布局-->
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="12dp"
        android:layout_marginRight="12dp"
        >
        <!--相机按钮-->
        <ImageView
            android:id="@+id/iv_photo"
            android:layout_width="24dp"
            android:layout_height="24dp"
            android:src="@drawable/photo"
            android:layout_alignParentRight="true"
            android:layout_marginRight="10dp"
            android:layout_marginTop="10dp"
            />
        <!--头像-->
        <ImageView
            android:id="@+id/iv_userHeader"
            android:layout_width="80dp"
            android:layout_height="80dp"
            android:src="@drawable/abc"
            android:layout_below="@id/iv_photo"
            android:layout_marginRight="15dp"
            />
        <!--网名-->
        <TextView
            android:id="@+id/tv_userName"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Lionel Wang"
            android:textSize="24sp"
            android:textColor="#000"
            android:layout_below="@id/iv_photo"
            android:layout_toRightOf="@id/iv_userHeader"
            android:layout_marginBottom="15dp"
            />
        <TextView
            android:id="@+id/tv_userNumberName"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="微信号:"
            android:layout_toRightOf="@+id/iv_userHeader"
            android:layout_below="@id/tv_userName"
            android:textSize="18sp"
            />
        <!--微信号id-->
        <TextView
            android:id="@+id/tv_userNumber"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="MESSI1240xxxx550"
            android:layout_toRightOf="@id/tv_userNumberName"
            android:layout_below="@id/tv_userName"
            android:textSize="18sp"
            />
        <!--二维码-->
        <ImageView
            android:id="@+id/iv_qrCode"
            android:layout_width="24dp"
            android:layout_height="24dp"
            android:src="@drawable/ma"
            android:layout_toLeftOf="@+id/tv_j"
            android:layout_below="@id/tv_userName"
            />
        <TextView
            android:id="@+id/tv_j"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text=">"
            android:layout_alignParentRight="true"
            android:layout_below="@id/tv_userName"
            android:textSize="18sp"
            android:layout_marginLeft="10dp"
            />
    </RelativeLayout>

看完代码是不是发现简洁很多了，其实在很多复杂界面中需要这两个布局结合使用代码会更加简洁(^V^)
温馨提示：

---

下一篇将会有极大的变动，我一直想要通过项目来驱动学习，但是我发现这样的项目写法带入感不强，所以我决定通过仿一个购物商场的实战项目来搭建学习框架也让学习过程更加的有成就感。

---

程序员日常>>>