第一步:创建一个空白的项目
第二步:我们去xml文件添加控件
1.这里我们先添加一个帧布局来存放背景
<FrameLayout androID:layout_wIDth="match_parent" androID:layout_height="match_parent" androID:background="#FF0097A7"></FrameLayout>
2.我们在帧布局里面添加一个linearlayout来放子控件
<FrameLayout androID:layout_wIDth="match_parent" androID:layout_height="match_parent" androID:background="#FF0097A7"> <linearLayout androID:orIEntation="vertical" androID:layout_wIDth="match_parent" androID:layout_height="match_parent" androID:gravity="center"> </linearLayout></FrameLayout>
3.我们在linearlayout里面放2个布局,按比例平分它的父控件
<FrameLayout androID:layout_wIDth="match_parent" androID:layout_height="match_parent" androID:background="#FF0097A7"> <linearLayout androID:orIEntation="vertical" androID:layout_wIDth="match_parent" androID:layout_height="match_parent" androID:gravity="center"> <linearLayout androID:orIEntation="vertical" androID:layout_wIDth="match_parent" androID:layout_height="0dp" androID:layout_weight="2"/> <linearLayout androID:orIEntation="vertical" androID:background="@drawable/Shape" androID:layout_wIDth="match_parent" androID:layout_height="0dp" androID:layout_weight="7"/> </linearLayout> </FrameLayout>
4.第二个linearlayout背景需要加上圆角,需要去drawable文件下创建Shape.xml
<?xml version="1.0" enCoding="utf-8"?><shape xmlns:androID="http://schemas.androID.com/apk/res/androID" androID:shape="rectangle"> <!-- 填充的颜色 --> <solID androID:color="#FFFFFF" /> <corners androID:topLefTradius="40dp" //左边顶上圆角40dp-----删除 androID:topRighTradius="40dp" //右边顶上圆角40dp-----删除 /></shape>
5.我们在第一个linearlayout里面添加2个文本框控件
<FrameLayout androID:layout_wIDth="match_parent" androID:layout_height="match_parent" androID:background="#FF0097A7"> <linearLayout androID:orIEntation="vertical" androID:layout_wIDth="match_parent" androID:layout_height="match_parent" androID:gravity="center"> <linearLayout androID:orIEntation="vertical" androID:layout_wIDth="match_parent" androID:layout_height="0dp" androID:layout_weight="2" androID:gravity="center_vertical"> <TextVIEw androID:layout_wIDth="wrap_content" androID:layout_height="wrap_content" androID:text="Welcome" androID:textAppearance="?androID:attr/textAppearanceSmall" androID:layout_marginleft="25dp"/> <TextVIEw androID:layout_wIDth="wrap_content" androID:layout_height="wrap_content" androID:text="sgin up" androID:layout_marginleft="25dp" androID:textSize="35sp" androID:textStyle="bold" androID:layout_margintop="5dp"/> </linearLayout> <linearLayout androID:orIEntation="vertical" androID:layout_wIDth="match_parent" androID:layout_height="0dp" androID:layout_weight="7" androID:background="@drawable/Shape" androID:gravity="center_horizontal"> <EditText androID:layout_wIDth="match_parent" androID:ems="10" androID:layout_height="wrap_content" androID:layout_marginleft="25dp" androID:layout_marginRight="25dp" androID:layout_margintop="30dp"/> </linearLayout> </linearLayout> </FrameLayout>
6.我们在第二个linearlayout里面添加2个编辑框一个按钮 一个文本框 一个隐藏的文本框
<linearLayout androID:orIEntation="vertical" androID:layout_wIDth="match_parent" androID:layout_height="wrap_content" androID:gravity="center" androID:visibility="invisible" androID:ID="@+ID/activitymainlinearLayout1"> <TextVIEw androID:layout_wIDth="wrap_content" androID:layout_height="wrap_content" androID:text="账号或密码错误" androID:ID="@+ID/activitymainTextVIEw_0"/> </linearLayout> <button androID:layout_wIDth="match_parent" androID:layout_height="wrap_content" androID:text="登录" androID:layout_marginleft="25dp" androID:layout_marginRight="25dp" androID:layout_margintop="5dp" androID:layout_marginBottom="5dp" androID:background="@drawable/Shape_button" androID:ID="@+ID/activitymainbutton1"/> <linearLayout androID:orIEntation="horizontal" androID:layout_wIDth="match_parent" androID:layout_height="wrap_content" androID:gravity="center" androID:ID="@+ID/activitymainlinearLayout2"> <TextVIEw androID:layout_wIDth="wrap_content" androID:layout_height="wrap_content" androID:text="没有账号?"/> <TextVIEw androID:layout_wIDth="wrap_content" androID:layout_height="wrap_content" androID:text="去注册" androID:textcolor="#FFAB40" androID:ID="@+ID/activitymainTextVIEw9"/> </linearLayout>
跑起来了,编辑框有点不好看,我们给它来个外包装,先去buID里面添加一个库
compile 'com.wrapp.floatlabelededittext:library:0.0.6'
例如这样:
apply plugin: 'com.androID.application'androID { compileSdkVersion 21 buildToolsversion "21.1.0" defaultConfig { applicationID "com.uigo.myui" minSdkVersion 14 targetSdkVersion 21 versionCode 1 versionname "1.0" } buildTypes { release { MinifyEnabled false proguardfiles getDefaultProguardfile('proguard-androID.txt'), 'proguard-rules.pro' } }}dependencIEs { compile filetree(dir: 'libs', include: ['*.jar']) //编辑框第三方库 compile 'com.wrapp.floatlabelededittext:library:0.0.6'}
接下来我们把编辑框包起来
<com.wrapp.floatlabelededittext.floatLabeledEditText androID:layout_wIDth="match_parent" androID:layout_marginleft="25dp" androID:layout_marginRight="25dp" androID:layout_margintop="30dp" androID:layout_height="wrap_content"> <EditText androID:lines="1" androID:digits="1234567890" androID:maxLength="17" androID:hint="请输入账号" androID:layout_wIDth="match_parent" androID:ems="10" androID:layout_height="wrap_content" androID:ID="@+ID/et_account"/> </com.wrapp.floatlabelededittext.floatLabeledEditText> <com.wrapp.floatlabelededittext.floatLabeledEditText androID:layout_wIDth="match_parent" androID:layout_margintop="4dp" androID:layout_marginleft="25dp" androID:layout_marginRight="25dp" androID:layout_height="wrap_content"> <EditText androID:lines="1" androID:maxLength="17" androID:hint="请输入密码" androID:digits="1234567890qwertyuiopasdfghjklzxcvbnmQWERTYUIOPASDFGHJKLZXCVBNM" androID:layout_wIDth="match_parent" androID:inputType="textPassword" androID:layout_height="wrap_content" androID:ems="10" androID:ID="@+ID/et_password"/> </com.wrapp.floatlabelededittext.floatLabeledEditText>
这个button样式不太好看,我们给它创建一个背景把去drawable,创建shape_button.xml
<?xml version="1.0" enCoding="utf-8"?><shape xmlns:androID="http://schemas.androID.com/apk/res/androID" androID:shape="rectangle"> <!-- 填充的颜色 --> <solID androID:color="#FF0097A7" /> <!-- androID:radius 弧形的半径 --> <!-- 设置按钮的四个角为弧形 --> <corners androID:radius="30dp" /> </shape>
让我们康康整体代码吧
<?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:orIEntation="vertical" androID:gravity="center"> <FrameLayout androID:layout_wIDth="match_parent" androID:layout_height="match_parent" androID:background="#FF0097A7"> <linearLayout androID:orIEntation="vertical" androID:layout_wIDth="match_parent" androID:layout_height="match_parent" androID:gravity="center"> <linearLayout androID:orIEntation="vertical" androID:layout_wIDth="match_parent" androID:layout_height="0dp" androID:layout_weight="2" androID:gravity="center_vertical"> <TextVIEw androID:layout_wIDth="wrap_content" androID:layout_height="wrap_content" androID:text="Welcome" androID:textAppearance="?androID:attr/textAppearanceSmall" androID:layout_marginleft="25dp"/> <TextVIEw androID:layout_wIDth="wrap_content" androID:layout_height="wrap_content" androID:text="sgin up" androID:layout_marginleft="25dp" androID:textSize="35sp" androID:textStyle="bold" androID:layout_margintop="5dp"/> </linearLayout> <linearLayout androID:orIEntation="vertical" androID:layout_wIDth="match_parent" androID:layout_height="0dp" androID:layout_weight="7" androID:background="@drawable/Shape" androID:gravity="center_horizontal"> <com.wrapp.floatlabelededittext.floatLabeledEditText androID:layout_wIDth="match_parent" androID:layout_marginleft="25dp" androID:layout_marginRight="25dp" androID:layout_margintop="30dp" androID:layout_height="wrap_content"> <EditText androID:lines="1" androID:digits="1234567890" androID:maxLength="17" androID:hint="请输入账号" androID:layout_wIDth="match_parent" androID:ems="10" androID:layout_height="wrap_content" androID:ID="@+ID/et_account"/> </com.wrapp.floatlabelededittext.floatLabeledEditText> <com.wrapp.floatlabelededittext.floatLabeledEditText androID:layout_wIDth="match_parent" androID:layout_margintop="4dp" androID:layout_marginleft="25dp" androID:layout_marginRight="25dp" androID:layout_height="wrap_content"> <EditText androID:lines="1" androID:maxLength="17" androID:hint="请输入密码" androID:digits="1234567890qwertyuiopasdfghjklzxcvbnmQWERTYUIOPASDFGHJKLZXCVBNM" androID:layout_wIDth="match_parent" androID:inputType="textPassword" androID:layout_height="wrap_content" androID:ems="10" androID:ID="@+ID/et_password"/> </com.wrapp.floatlabelededittext.floatLabeledEditText> <linearLayout androID:orIEntation="vertical" androID:layout_wIDth="match_parent" androID:layout_height="wrap_content" androID:gravity="center" androID:visibility="invisible" androID:ID="@+ID/activitymainlinearLayout1"> <TextVIEw androID:layout_wIDth="wrap_content" androID:layout_height="wrap_content" androID:text="账号或密码错误" androID:ID="@+ID/activitymainTextVIEw_0"/> </linearLayout> <button androID:layout_wIDth="match_parent" androID:layout_height="wrap_content" androID:text="登录" androID:layout_marginleft="25dp" androID:layout_marginRight="25dp" androID:layout_margintop="5dp" androID:layout_marginBottom="5dp" androID:background="@drawable/Shape_button" androID:ID="@+ID/activitymainbutton1"/> <linearLayout androID:orIEntation="horizontal" androID:layout_wIDth="match_parent" androID:layout_height="wrap_content" androID:gravity="center" androID:ID="@+ID/activitymainlinearLayout2"> <TextVIEw androID:layout_wIDth="wrap_content" androID:layout_height="wrap_content" androID:text="没有账号?"/> <TextVIEw androID:layout_wIDth="wrap_content" androID:layout_height="wrap_content" androID:text="去注册" androID:textcolor="#FFAB40" androID:ID="@+ID/activitymainTextVIEw9"/> </linearLayout> </linearLayout> </linearLayout> </FrameLayout></linearLayout>
在康康效果图:
给控件加上ID
ID可以随便设,但是不能重复
给文字加上下划线去javaj绑定控件
package com.uigo.myui; import androID.app.Activity;import androID.graphics.Paint;import androID.os.Bundle;import androID.Widget.button;import androID.Widget.EditText;import androID.Widget.TextVIEw;public class MainActivity extends Activity { private TextVIEw t2;//这里有一个隐藏的提示控件 @OverrIDe protected voID onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentVIEw(R.layout.activity_main); t2=findVIEwByID(R.ID.activitymainTextVIEw9);//前往注册账号绑定 //我们要把前往注册给加条下划线 t2.getPaint().setFlags(Paint.UNDERliNE_TEXT_FLAG);//加上下划线---paint是画笔 t2.getPaint().setAntiAlias(true);//为这条线加上下划线 } }
跑起来试试效果吧
总结以上是内存溢出为你收集整理的Android studio写一个简单又看得过去的登录和注册ui全部内容,希望文章能够帮你解决Android studio写一个简单又看得过去的登录和注册ui所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)