Android登录界面的初步

初步效果图

设置页面方法主要分为两类。

1.自己手敲代码,后面通过代码设置布局。

2.提前思考布局,在组件页面直接拖拽获得,后面根据需要更改代码。

方法1:

注:可在res文件内的layout文件下新建一个xml文件编写布局代码。但是需要在src的包文件下面的java文件中MainActivity将页面来源修改为新建xml文件名。

①新建login.xml文件时选择线性布局LinearLayout,方向设置垂直vertical。

②添加组件ImageView,TextView,EditText,Button等。其中设置密码输入文本框时,和账号输入文本框都是EditText,但需要输入时隐藏密码。可通过android:inputType="textPassword"或者android:Password="true"实现。

③给组件添加布局。给账号文本视图和账号输入文本框添加线性布局,方向设置水平horizontal。其中通过android:padding="20dp"还可设置到内边距的距离。

④设置组件宽高时,选择match或者fill或者wrap。match_parent指的是该行或者列全部占用,fill类似。wrap_content指的是随取随用。

⑤若设置按钮居中,可在按钮的线性布局中设置gravity居中。

方法2:

①新建login.xml文件时选择线性布局LinearLayout,方向设置垂直vertical。

②在layout拖拽水平线性布局,再将文本视图和纯文本框拖拽进入水平线性布局。同理设置密码框和按钮。后面根据实际需要改写代码如id,居中,内边距等。

代码如下:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
  	android:gravity="center"
    android:orientation="vertical" >
    
    
    <ImageView 
        android:id="@+id/mypicture"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_launcher"/>


    
    <LinearLayout 
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
          	android:padding="20dp"
        android:orientation="horizontal">
    <TextView
        android:id="@+id/text1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="账号" />
   
    <EditText 
        android:id="@+id/text2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="请输入账号"/>

    </LinearLayout>



	<LinearLayout 
	    android:layout_width="match_parent"
	    android:layout_height="wrap_content"
	      	android:padding="20dp"
	    android:orientation="horizontal">
    <TextView
        android:id="@+id/text3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="密码" />
  
    <EditText 
        android:id="@+id/text4"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:ems="3"
        android:inputType="textPassword"/>
    </LinearLayout>
    
	
	
	<LinearLayout 
	    android:layout_width="match_parent"
	    android:layout_height="wrap_content"
	    android:gravity="center"
	    android:orientation="horizontal">
    
    	
    <Button 
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="登陆"/>
    
    <Button 
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="注册"/>
    </LinearLayout>
    
</LinearLayout>

猜你喜欢

转载自blog.csdn.net/weixin_42621338/article/details/81395932