最近很久没冒泡了。刚学Android没多久,就开始在搞界面。layout文件。
越搞才越觉得有意思。废话不多说,先送上我的layout文件,然后解说。
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/background_login">
<TextView android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingLeft="15dip"
android:paddingRight="15dip"
android:layout_marginTop="10dip"
android:textColor="@android:color/white"
android:textSize="17dip"
android:ellipsize="marquee"
android:focusable="true"
android:marqueeRepeatLimit="marquee_forever"
android:focusableInTouchMode="true"
android:scrollHorizontally="true"
android:text="@string/runtext"
/>
<!--
padding 内边距 layout_margin 外边距
android:layout_alignParentTop 布局的位置是否处于顶部
-->
<RelativeLayout
android:id="@+id/login_div"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_margin="17dp"
android:background="@drawable/background_login_div_bg"
android:padding="15dip" >
<!-- 账号 -->
<TableRow android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:id="@+id/account"
>
<TextView
style="@style/normalText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:text="@string/login_label_username" />
<EditText
android:id="@+id/login_edit_username"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:hint="@string/login_username_hint"
android:inputType="text"
android:singleLine="true" />
</TableRow>
<TableRow android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_below="@id/account"
android:id="@+id/password"
>
<!-- 密码text -->
<TextView
style="@style/normalText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="3dp"
android:text="@string/login_label_password" />
<EditText
android:id="@+id/login_edit_password"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:hint="@string/login_password_hint"
android:inputType="textPassword"
android:minWidth="180dip"
android:password="true"
android:singleLine="true" />
</TableRow>
<TableRow android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_below="@id/password"
android:id="@+id/funButton"
android:layout_marginTop="10dp"
>
<!-- 登录button -->
<Button
android:id="@+id/login_btn_login"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="20dp"
style="@style/button"
android:text="@string/login_label_signin" />
<!-- 清空button -->
<Button
android:id="@+id/login_btn_cleanup"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="20dp"
style="@style/button"
android:text="@string/login_label_cleanup" />
<!-- 注册button -->
<Button
android:id="@+id/login_btn_reg"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="@style/button"
android:text="@string/login_label_register" />
</TableRow>
</RelativeLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
>
<!-- 家居掌 中宝,捧在手心里的至爱 -->
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="25dip"
android:layout_marginTop="15dp"
android:src="@drawable/title" />
<!-- 钓鱼岛 -->
<ImageView
android:src="@drawable/chinese"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
android:layout_margin="15dp"
/>
</RelativeLayout>
</LinearLayout>
这些都是素材。网上找了点,自己改了点。
这是总体效果,还有两个文件。背景文件
background_login.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<gradient
android:startColor="#80BA55D3"
android:endColor="#FFEE82EE"
android:angle="45"
/>
</shape>
background_login_div_bg.xml
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#55FFFFFF" />
<!--
设置圆角
注意: bottomRightRadius是左下角而不是右下角 bottomLeftRadius右下角
-->
<corners android:topLeftRadius="10dp" android:topRightRadius="10dp"
android:bottomRightRadius="10dp" android:bottomLeftRadius="10dp"/>
</shape>
首先,看到<LinearLayout....>。线性布局。
在线性布局中,你所添加的Widget会一个挨一下放。这里就是一个Widget一行。
android:orientation="vertical" 。这个就是设置线性的方向吧。垂直线性。
android:background="@drawable/background_login" 整个界面的背景,这里采用一个xml内容设置背景
下面是一个<TextView> 其实很多都很简单的。width。height这些是宽高设置。wrap_content是适应内容大小。
而fill_parent是指填充满父布局。这里就是宽是占满整个LinearLayout
padding是内边距的意思。加个left就是左内边距了。这些应该知道了。
margin是外边距的意思。而textColor是指字体颜色,这里用的是android本身定义好的。
textsize是文字大小。
android:ellipsize=”marquee”–以跑马灯的方式显示(动画横向移动)
android:focusable="true" 获取焦点
android:marqueeRepeatLimit="marquee_forever" 表示一直滚动
android:focusableInTouchMode="true" 可以通过touch获得焦点
android:scrollHorizontally="true"表示一个EditText满了后是自动横着移动不是默认的换行。
<RelativeLayout>是相关布局。在这个布局中,所有你所添加的Widget都要加上相对位置。不然就会重叠在一块了。
例如密码,密码是放在账号下面吧。所以在密码的TableRow.中会有一行android:layout_below="@id/account"
而这里的account是在添加账号TableRow的时候添加的id。这是安卓中为了找到对象的方便而提供的。
这里说到的TableRow是一种表格。横向表格。一行里你可以放几个Widget,它会自动帮你对齐,即使在RelativeLayout中,
也不需要加相对位置。
<TextView>是显示文本的Widget。而<EditText>是输入文本的框。
android:hint=""这个是用在,当你没在EditText中输入内容时,默认显示的文字。而当你输入内容后就会消失。
android:password="true"会把你输入的内容当成密码,显示圆点
android:signleLine,当你输入的内容超过框之后,不会换行,而是向左移动。
<ImageView>是插入图片的Widget。