LedPedometer-2.登陆界面

羽缘的小窝

于 2015-12-30 22:15:55 发布

阅读量357

点赞数

CC 4.0 BY-SA版权

分类专栏： LedPedometer(运动计步分析app) 文章标签： login 登陆界面类似qq界面

本文链接：https://blog.youkuaiyun.com/u010308400/article/details/50437680

LedPedometer(运动计步分析app) 专栏收录该内容

2 篇文章

订阅专栏

本文介绍了一个典型的登录界面的设计与实现过程，包括使用LinearLayout作为主布局，内含ImageView、EditText及Button等组件，并详细展示了对应的XML代码。此外，还介绍了style配置文件中对样式进行统一管理的方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

登陆界面如下：

这里写图片描述

分析

上面一个imageView
中间2个EditText 使用了selector 改变了选中的状态
下面一个button按钮
下方一个相对布局

代码：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/ll_root_login"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#d0d6e0"
    android:orientation="vertical" >

    <ImageView
        android:layout_width="150dp"
        android:layout_height="90dp"
        android:layout_gravity="center_horizontal"
        android:layout_marginTop="56dip"
        android:src="@drawable/login_logo" />

    <EditText
        android:id="@+id/et_login_phone"
        style="@style/EditTextStyle"
        android:hint="手机号码"
        android:inputType="phone" />

    <EditText
        android:id="@+id/et_login_pass"
        style="@style/EditTextStyle"
        android:hint="密码"
        android:inputType="textPassword" />

    <Button
        android:layout_width="match_parent"
        android:layout_height="40dp"
        android:layout_marginLeft="24dp"
        android:layout_marginRight="24dp"
        android:layout_marginTop="24dp"
        android:background="#00a7f7"
        android:paddingBottom="8dp"
        android:paddingTop="8dp"
        android:text="登陆"
        android:textColor="@android:color/white"
        android:textSize="14sp" />

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

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_alignParentLeft="true"
            android:layout_marginBottom="8dp"
            android:layout_marginLeft="8dp"
            android:background="#d0d6e0"
            android:clickable="true"
            android:text="忘记密码?"
            android:textColor="#0000ff"
            android:textSize="12sp" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_alignParentRight="true"
            android:layout_marginBottom="8dp"
            android:layout_marginRight="8dp"
            android:background="#d0d6e0"
            android:clickable="true"
            android:gravity="right"
            android:onClick="loginNewUser"
            android:text="新用户"
            android:textColor="#0000ff"
            android:textSize="12sp" />
    </RelativeLayout>

</LinearLayout>



style.xml
 <style name = "ButtonStyle">
        <item name="android:layout_marginLeft">16dp</item>
        <item name="android:layout_marginRight">16dp</item>
        <item name="android:layout_marginTop">16dp</item>
        <item name="android:paddingBottom">8dp</item>
        <item name="android:paddingTop">8dp</item>
        <item name="android:gravity">center</item>
        <item name="android:textSize">14sp</item>
   </style>
    <style name = "EditTextStyle">
        <item name="android:layout_height">40dp</item>
        <item name="android:layout_width">match_parent</item>
        <item name="android:layout_marginLeft">16dp</item>
        <item name="android:layout_marginRight">16dp</item>
        <item name="android:layout_marginTop">16dp</item>
        <item name="android:paddingBottom">8dp</item>
        <item name="android:paddingTop">8dp</item>
        <item name="android:selectAllOnFocus">true</item>
        <item name="android:singleLine">true</item>
        <item name="android:textSize">12sp</item>
        <item name="android:gravity">center</item>
        <item name="android:background">@drawable/edit_select</item>
    </style>