欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  移动技术

Android碎笔录1——基本布局

程序员文章站 2022-05-18 08:53:31
刚开始学Android开发的时候,没有H5的基础总是分不清android布局文件的用法,真正要学会android布局还是得实战一次,下面不多说,直接上代码。 这是一个登陆界面,LinerLayout嵌套RelativeLayout的布局,去掉我写的注释就可以直接使用: 上面展示了几个常用的控件用法, ......

  刚开始学Android开发的时候,没有H5的基础总是分不清android布局文件的用法,真正要学会android布局还是得实战一次,下面不多说,直接上代码。

  这是一个登陆界面,LinerLayout嵌套RelativeLayout的布局,去掉我写的注释就可以直接使用:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"  //match_parent是占满整行,设置宽
    android:layout_height="match_parent"  //占满整列,设置高
    android:orientation="vertical">  //里面的项目垂直排列,如果不写可能报错

    <RelativeLayout  //这是LinerLayout嵌套的第一个layout。显示在第一行
        android:layout_width="match_parent"
        android:layout_height="180dp"
        android:background="@mipmap/login_bg_no"> //设置背景图片,背景图片一般就是粘贴在mipmap的xhdpi中

        <ImageView  //图片控件,显示在父控件的第一行
            android:id="@+id/back1"  //设置id,后面可以用来设置点击事件或相对布局
            android:layout_width="20dp"  //设置图片大小,如果要展示原有大小就改为wrap_content
            android:layout_height="20dp"
            android:src="@mipmap/bg_back_white"  //背景图片,一个类似“<”的图片
            android:layout_marginTop="15dp"
            android:layout_alignParentLeft="true" //靠近父控件左侧
            android:layout_marginLeft="20dp" />  //离父控件左侧20dp,LinerLayout中不能这样用

        <TextView  //文字控件,由于是RelativeLayout,不设置相对布局,就会和上一个控件叠加
            android:id="@+id/register"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="注册"  //显示的文字
            android:textSize="13sp"  //文字大小
            android:textColor="@color/white"  //文字颜色,在value的color中设置颜色
            android:layout_alignParentRight="true"  //显示在父控件的右侧
            android:layout_marginTop="15dp"  //距父控件的上侧15dp
            android:layout_marginRight="20dp"
            />
    </RelativeLayout>

    <RelativeLayout  //由于LinearLayout中垂直排列,显示在上一个RelativeLayout的下侧
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/white">

        <EditText  //输入框
            android:id="@+id/loginnum"
            android:layout_width="match_parent"  //先占满一行
            android:layout_height="55dp"  //高度55dp
            android:layout_marginTop="20dp"  //再往下移20dp
            android:layout_marginRight="20dp"  //右侧减少20店铺
            android:layout_marginLeft="20dp"  //左侧减少20dp
            android:hint="请输入手机号码"  //设置默认文字
            android:textSize="20sp"  //文字大小
            android:numeric="integer"  //设置只能输入int类型的数
            android:maxLength="11"  //最长11位
android:singleLine="true"/> //单行,不能回车再起一行 <EditText android:id="@+id/loginpassword" android:layout_width="match_parent" android:layout_height="55dp" android:layout_marginRight="20dp" android:layout_marginLeft="20dp" android:layout_marginTop="10dp" android:layout_below="@id/loginnum" //相对于id为loginnum的控件往下 android:hint="请输入密码" android:textSize="20sp" android:password="true" //显示输入的为* android:singleLine="true"/> //单行 <Button //按钮 android:id="@+id/loginbtn" android:layout_width="match_parent" android:layout_height="45dp" android:text="登 录" android:textSize="20sp" android:background="@drawable/backguound_shape" //这是自己定义的一个drawable,使button显示为圆角,并点击变色,具体参见下一条博客。 android:textColor="@color/white" android:layout_marginLeft="20dp" android:layout_marginRight="20dp" android:layout_marginTop="30dp" android:layout_below="@id/loginpassword"/> </RelativeLayout> </LinearLayout>

上面展示了几个常用的控件用法,最重要的是要对LinerLayout和RelativeLayout有所了解。

下面的完成后的样子:

Android碎笔录1——基本布局

 

掌握这些,一些简单的布局就已经能够完成了。

 

如果color中没有相关颜色可以插入

切记不要删除color默认的几个颜色,否则会报错。

    <color name="red">#ff0000</color> <!-- 红色 -->
    <color name="black">#000000</color> <!-- 黑色 -->
    <color name="white">#ffffff</color> <!-- 白色 -->
    <color name="darkred">#8b0000</color> <!-- 暗红色 -->