【Android学习笔记】布局的简单介绍

我在学习Android开发的时候是基于实战项目的,基础理论知识以前也是零散的看过一些,个人还是觉得边做项目边学要快些。现在做的这个项目iOS端是我做的,这样逻辑什么的都很熟悉,于我而言换个平台也只是换个语言语法而已,但是不得不说,Android开发和iOS开发差别还是很大的,特别是布局方面,iOS我都是纯代码开发的,对于Android而言布局用的比较多的是xml,很是不习惯。而且Android的布局我觉得比较复杂,界面做做还可以,大部分都是网上现查现用的,如果真的说Android的布局我可能讲不清楚,毕竟很多原理和细节我都还不知道。不过我们的Android开发告诉我,他们也可以用Java纯代码来写布局,我在考虑去学学。xml布局,感觉菜鸟教程上讲的还是可以的,就是给的例子比较少,情况也没有很复杂的,在做项目开发的时候帮助不大,但是入门看看还是可以的,在这里给一下链接,有兴趣的可以看看。
线性布局:http://www.runoob.com/w3cnote/android-tutorial-linearlayout.html
相对布局:http://www.runoob.com/w3cnote/android-tutorial-relativelayout.html
表格布局:http://www.runoob.com/w3cnote/android-tutorial-tablelayout.html
帧布局:http://www.runoob.com/w3cnote/android-tutorial-framelayout.html
网格布局:http://www.runoob.com/w3cnote/android-tutorial-gridlayout.html
绝对布局:http://www.runoob.com/w3cnote/android-tutorial-absolutelayout.html
还听说Android最近新出了约束布局,听说与iOS的布局很像,但是我还没有去查过相关资料,后面有新的资料了会在这里更新。
我现在还只是用过了相对布局,下面给一个登录页的布局示例:
效果图:

代码:

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".BZLogin.BZLoginActivity.BZLoginActivity">

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

        <ImageView
            android:id="@+id/image_login_bg"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:scaleType="fitXY"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:srcCompat="@drawable/image_login_bg" />

        <TextView
            android:id="@+id/login_bg_textView"
            android:layout_height="220dp"
            android:layout_width="match_parent"
            android:layout_marginTop="180dp"
            android:layout_marginLeft="20dp"
            android:layout_marginRight="20dp"
            android:background="@drawable/round"
            android:gravity="center" />

        <ImageView
            android:id="@+id/login_icon"
            android:layout_width="60dp"
            android:layout_height="60dp"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="152dp"
            app:srcCompat="@drawable/image_input_icon" />

        <TextView
            android:id="@+id/accout_left_text"
            android:layout_marginLeft="40dp"
            android:layout_marginTop="232dp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="帐号"
            android:textColor="@color/colorLakeBlue"
            android:textSize="18sp"/>

        <EditText
            android:id="@+id/accout_editText"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="222dp"
            android:layout_marginLeft="80dp"
            android:inputType="phone"
            android:hint="输入手机号"
            android:textSize="18sp"
            android:textCursorDrawable="@null"/>

        <Button
            android:id="@+id/account_clean_button"
            android:layout_width="20dp"
            android:layout_height="20dp"
            android:layout_marginTop="232dp"
            android:layout_alignParentRight="true"
            android:layout_marginRight="60dp"
            android:background="@drawable/button_login_clean"/>

        <TextView
            android:id="@+id/accout_line"
            android:layout_width="match_parent"
            android:layout_height="1dp"
            android:layout_marginLeft="80dp"
            android:layout_marginRight="60dp"
            android:layout_below="@+id/accout_editText"
            android:layout_marginTop="0dp"
            android:background="@color/colorLakeBlue" />

        <TextView
            android:id="@+id/password_left_text"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignLeft="@+id/accout_left_text"
            android:layout_below="@+id/accout_line"
            android:layout_marginTop="35dp"
            android:text="密码"
            android:textSize="18sp"
            android:textColor="@color/colorLakeBlue"/>

        <EditText
            android:id="@+id/password_editText"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignLeft="@+id/accout_editText"
            android:layout_below="@+id/accout_line"
            android:layout_marginTop="25dp"
            android:inputType="textPassword"
            android:hint="输入密码"
            android:textSize="18sp"
            android:textCursorDrawable="@null"/>

        <Button
            android:id="@+id/password_show_hide_button"
            android:layout_width="20dp"
            android:layout_height="20dp"
            android:layout_alignLeft="@+id/account_clean_button"
            android:layout_alignTop="@+id/password_left_text"
            android:background="@drawable/button_password_hide" />

        <TextView
            android:id="@+id/password_line"
            android:layout_width="match_parent"
            android:layout_height="1dp"
            android:layout_below="@+id/password_editText"
            android:layout_marginTop="0dp"
            android:background="@color/colorLakeBlue"
            android:layout_alignLeft="@+id/accout_line"
            android:layout_alignRight="@+id/accout_line"/>

        <Button
            android:id="@+id/login_button"
            android:layout_width="160dp"
            android:layout_height="40dp"
            android:layout_centerHorizontal="true"
            android:layout_below="@+id/password_line"
            android:layout_marginTop="40dp"
            android:text="登录"
            android:background="@drawable/loginbuttonround"
            android:textColor="@color/colorWhite"
            android:textSize="20sp"/>

        <TextView
            android:id="@+id/vertical_line"
            android:layout_width="1dp"
            android:layout_height="20dp"
            android:layout_below="@+id/login_button"
            android:layout_marginTop="12dp"
            android:layout_centerHorizontal="true"
            android:background="@color/colorLakeBlue" />

        <Button
            android:id="@+id/register_button"
            android:layout_width="wrap_content"
            android:layout_height="20dp"
            android:layout_below="@+id/login_button"
            android:layout_marginTop="10dp"
            android:layout_alignRight="@+id/vertical_line"
            android:text="快速注册"
            android:textColor="@color/colorGray"
            android:textSize="15sp"
            android:background="@android:color/transparent"/>

        <Button
            android:id="@+id/forget_password_button"
            android:layout_width="wrap_content"
            android:layout_height="20dp"
            android:layout_below="@+id/login_button"
            android:layout_alignLeft="@+id/vertical_line"
            android:layout_marginTop="10dp"
            android:text="忘记密码"
            android:background="@android:color/transparent"
            android:textSize="15sp"
            android:textColor="@color/colorGray"/>

    </RelativeLayout>

</android.support.constraint.ConstraintLayout>

我想把login_icon放到login_bg_textView上面30dp的位置,我在login_icon里设置了above的属性,然后设置了layout_marginTop为30dp,但是很奇怪,这样设置之后,就看不到login_icon。
可能界面布局太简单,但是每个项目的界面都各有千秋,所以很多时候想找自己想要的布局代码都不是很好找,希望篇文章能给正在自学Android开发的人带来一点帮助。

猜你喜欢

转载自www.cnblogs.com/zhanqin/p/8888869.html