我们这次主要完成如下图片的布局
我们打算用线性布局来完成。下面放上我的代码并对代码进行分析。
<?xml version="1.0" encoding="utf-8"?> <LinearLayout 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" android:orientation="vertical" //设置方向为垂直 tools:context="activity.LoginActivity"> <!--第一层 用来放置最上面的照片--> <LinearLayout android:layout_width="match_parent" //宽度为界面的宽度 android:layout_height="wrap_content" //layout_height设置为wrap_content这样界面的高度的大小刚好包含内容 android:background="@color/colorPrimary" android:orientation="vertical"> <ImageView android:id="@+id/imageView" android:layout_width="match_parent" android:layout_height="wrap_content" app:srcCompat="@drawable/default_user_logo" /> </LinearLayout> <!--第二层 --> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginLeft="5dp" //与界面左边的距离为5dp dp的含义自行百度 android:layout_marginTop="50dp" //与上一个界面的距离为50dp android:layout_marginRight="5dp" //与界面右边的距离为5dp android:orientation="vertical" > <TextView android:id="@+id/textView" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="用户昵称" /> <EditText android:id="@+id/editTextName" android:layout_width="match_parent" android:layout_height="wrap_content" android:ems="10" android:inputType="textPersonName" //输入类型为人名 android:text="" /> <TextView android:id="@+id/textView2" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="密码" /> <EditText android:id="@+id/editTextPassword" android:layout_width="match_parent" android:layout_height="wrap_content" android:ems="10" android:inputType="textPassword" /> //输入类型为密码 <Button android:id="@+id/buttonLogin" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="#FF8833" //背景颜色为橙色 android:text="登录" /> </LinearLayout> <!--第三层 --> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:layout_marginTop="20dp" android:layout_marginLeft="5dp" android:layout_marginRight="5dp" android:orientation="horizontal"> <!--让下面两个文本框偏右 --> <TextView android:id="@+id/textView5" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1" android:text="" /> <TextView android:id="@+id/textViewNoPassword" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginRight="10dp" android:text="忘记密码" /> <TextView android:id="@+id/textViewRegister" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginRight="10dp" android:text="注册用户" /> </LinearLayout> </LinearLayout>
第二行说明整体的布局是LinearLayout，接下来是这个界面的参数。XML命名空间定义语法为：xmlns:namespace-prefix="namespaceURI"
xmlns:声明命名空间的保留字 namespace-prefix:命名空间的前缀 namespaceURI：命名空间的唯一标识符。其中的android用于Android系统定义的一些属性；app用于自定义一些属性；tools可以用于减少或者避免黄线提醒，压缩资源文件，降低APK体积等。
这个界面我们由三个LinearLayout组件构成。如下图所示。
在第一个中，我们就放置了一张照片。在第二层中我们放了两个textView控件，来提示用户输入姓名和密码。姓名用的是Plain Text控件，密码用的是Password Text空间。在这一层中还加入了一个button。最后三层我们放了三个textView空间。我们还把一些控件的id值改成了与其功能有关的词，而不是采用其默认值了，主要是为了后面用的时候方便，因为主要操作id值。在每一个LinearLayout下的一开始，都是其属性的设置。然后在这个下具体的控件也有设置。所有有三层属性的设置。要想得到自己想要的界面，将要想清这三层的设置。具体的一些设置，我放在注释中。但是我没找到在行后面注释的方法，就用//来注释，注意这是错误的。要是知道怎么注释的，麻烦在评论中教我一下。
为了让模拟器显示这个登录界面，在AndroidManifest中将<intent-filter>放在相应的activity中。
<?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.zstu.tinyaccount"> <application android:allowBackup="true" android:icon="@mipmap/ic_launcher" android:label="@string/app_name" android:roundIcon="@mipmap/ic_launcher_round" android:supportsRtl="true" android:theme="@style/AppTheme"> <activity android:name="activity.LoginActivity"> <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> </activity> <activity android:name=".SecondActivity" /> <activity android:name=".MainActivity"> </activity> </application> </manifest>