App开发《知亦学》之--编写登录界面
来源:互联网 发布:怎么改淘宝的支付宝 编辑:程序博客网 时间:2024/05/21 03:18
App开发《知亦学》之–编写登录界面
最近开发了一款App,取名叫《知亦学》,独立开发这款App还是学到了不少东西,现在也基本开发完毕了,暂时没有重构代码,准备接下来重构,登录界面基本不需要重构,所以就先在博客上写这么一篇了,先上登录界面截图吧:
这是一个MD风格的登录界面,那么如何实现那?先直接上代码
<?xml version="1.0" encoding="utf-8"?> <android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/backg_color" android:theme="@style/AppTheme.AppBarOverlay"> <android.support.design.widget.AppBarLayout android:id="@+id/app_bar" android:layout_width="match_parent" android:layout_height="250dp" android:background="@color/login_app_bar_bg" android:fitsSystemWindows="true" android:theme="@style/AppTheme.AppBarOverlay"> <!--由于CollapsingToolbarLayout 的 特点,应用的标题文字在收缩和展开状态是会自动过渡的。如果你想要在展开状态改变标题文字的位置, 你可以这样做:通过应用的 margin 的4个属性, 就是:app:expandedTitleMargin, app:expandedTitleMarginBottom, app:expandedTitleMarginEnd 以及 app:expandedTitleMarginStart 或者如果你想要在折叠和展开状态时改变文本的显示。你可以这样来简单的实现: 设置 TextAppearance,分别通过 app:collapsedTitleTextAppearance 和 app:expandedTitleTextAppearance 来设置。--> <android.support.design.widget.CollapsingToolbarLayout android:id="@+id/toolbar_layout" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" app:contentScrim="?attr/colorPrimary" app:expandedTitleTextAppearance="@style/textToolbarTitle" app:layout_scrollFlags="scroll|exitUntilCollapsed|snap"> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" app:layout_collapseMode="pin"> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:text="用户登录" android:textColor="@color/white" android:textSize="18dp" /> </android.support.v7.widget.Toolbar> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginLeft="16dp" android:layout_marginTop="84dp" android:padding="4dp" android:text="登录您的“教务处账号”" android:textColor="@color/white" android:textSize="14sp" /> </android.support.design.widget.CollapsingToolbarLayout> </android.support.design.widget.AppBarLayout> <android.support.v7.widget.CardView android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_gravity="bottom" android:layout_marginBottom="12dp" android:layout_marginLeft="12dp" android:layout_marginRight="12dp" android:padding="8dp"> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:gravity="center_horizontal" android:orientation="horizontal"> <CheckBox android:id="@+id/choose_user_protocol_check_box" android:layout_width="wrap_content" android:layout_height="wrap_content" android:checked="true" android:enabled="false" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/friendly_reminder" android:textSize="14sp" /> <TextView android:id="@+id/protocol_text_view" style="@style/text_style_blue" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/user_protocol" /> </LinearLayout> </android.support.v7.widget.CardView> <android.support.v7.widget.CardView android:id="@+id/card_view" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginLeft="12dp" android:layout_marginRight="12dp" app:layout_anchor="@id/app_bar" app:layout_anchorGravity="bottom"> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical"> <LinearLayout style="@style/general_item_layout_alone_unclick" android:layout_width="fill_parent" android:layout_height="44dp" android:layout_marginTop="12dp" android:paddingRight="16dp"> <ImageView android:id="@+id/imageView" android:layout_width="50dp" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:src="@mipmap/ic_login_account" /> <EditText android:id="@+id/account_edit_text" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:background="@color/lucency_white" android:hint="@string/account" android:inputType="number" android:maxLength="10" android:textColor="#ff333333" android:textColorHint="#ff999999" android:textSize="16.0dip" /> </LinearLayout> <LinearLayout android:layout_width="fill_parent" android:layout_height="44dp" android:background="@drawable/list_item_middle_selector" android:paddingRight="15dp"> <ImageView android:layout_width="50dp" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:src="@mipmap/ic_login_password" /> <EditText android:id="@+id/password_edit_text" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:layout_weight="1" android:background="@color/lucency_white" android:hint="@string/password" android:inputType="textPassword" android:textColor="#ff333333" android:textColorHint="#ff999999" android:textSize="16sp" /> <ImageView android:id="@+id/show_password_toggle_image_view" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_vertical|center_horizontal" android:src="@mipmap/ic_show_password"></ImageView> </LinearLayout> <LinearLayout android:layout_width="fill_parent" android:layout_height="44dp" android:background="@drawable/list_item_middle_selector" android:paddingRight="15dp"> <ImageView android:id="@+id/identifying_image_image_view" android:layout_width="96dp" android:layout_height="36dp" android:layout_gravity="center_vertical" android:layout_marginLeft="16dp" android:layout_marginRight="15dp" android:scaleType="fitXY" /> <EditText android:id="@+id/identifying_image_edit_text" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:layout_weight="1" android:background="@color/lucency_white" android:hint="验证码" android:inputType="number" android:maxLength="4" android:textColor="#ff333333" android:textColorHint="#ff999999" android:textSize="16sp" /> </LinearLayout> <android.support.v7.widget.AppCompatButton android:id="@+id/login_button" style="@style/general_green_btn" android:layout_gravity="center_horizontal" android:layout_marginLeft="12dp" android:layout_marginRight="12dp" android:layout_marginTop="12dp" android:text="登录"></android.support.v7.widget.AppCompatButton> <RelativeLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginBottom="12dp" android:layout_marginLeft="16dp" android:layout_marginRight="16dp" android:layout_marginTop="12dp" android:gravity="center"> <CheckBox android:id="@+id/remember_password_check_box" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentLeft="true" android:text="@string/remember_password" /> <TextView android:id="@+id/forget_password_text_view" style="@style/text_style_blue" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentRight="true" android:padding="6dp" android:text="@string/forget_password" /> </RelativeLayout> </LinearLayout> </android.support.v7.widget.CardView> </android.support.design.widget.CoordinatorLayout>
代码不难理解,就不作分析了,今天有点累,明天接着写吧。明天深入分析。
阅读全文
0 0
- App开发《知亦学》之--编写登录界面
- APP开发1-欢迎界面转登录
- IOS开发之登录界面
- IOS开发之登录界面的开发
- Android APP登录界面
- weex 学习之登录界面的开发
- 简单app开发之splash界面
- 简单app开发之Guide(向导)界面
- c语言编写登录界面
- JAVA编写QQ登录界面
- ios开发登录界面
- 界面编程之登录界面
- APP开发:导航界面
- app开发-api编写
- Android开发之编写精美的聊天界面
- UI之登录界面
- ServletJsp之登录界面
- Android 之登录界面
- ThreadLocal的使用
- 标准模板库的一些函数
- 51nod 1770 数数字
- A
- 关于maven项目加载maven库以外的jar包找不到报错
- App开发《知亦学》之--编写登录界面
- highways
- .NET正则基础之——平衡组
- LibCurl HTTP部分详细介绍
- jQuery中入门组件开发,登录界面
- javascript:栈内存与堆内存浅谈
- 二分搜索
- 每日MySQL之009:MySQL账户管理
- Linux常用操作命令