安卓开发--构建简单用户接口

安卓应用的图形用户接口,使用分层的view和ViewGroup对象构建。View对象通常是UI窗口小部件,如BUTTON,TEXT FIELD等

,ViewGroup对象是隐藏的View容器,它用来定义子View如何布局。就像方格或垂直的列表。

安卓提供①个XML文件,里面包含了View和ViewGroup的子类,你可以在文件里定义你的UI设计,如下图

在这节课中,我们将在XML文件中创建一个布局,包括一个文本和按钮,

接下来的课程,当按钮被按下,它将发送一个文本框给另外一个活动实体。

 

一 创建线性的布局

在res/layout/文件夹中打开activity_main.xml文件

注意,在ECLIPSE下,如下图,当你打开一个布局文件,你第一先看到的图形布局编辑器。这个编辑器使用WYSIWYG工具帮助你构建布局,

对于本节课,我们将直接使用XML文件编辑器直接操作XML文件,所以点击activity_main.xml的屏幕底下的标签,打开XML编辑器。

 

 

XML编辑器

当你创建这个工程的时候,你选择的BlankActivity模板,包括这个activity_main.xml文件,文件里涵括一个RelativeLayout根节点,

视图和一个TextView子视图

删除<TextView>元素和改变<RelativeLayout>元成<LinearLayout>.元素,然后增加android:orientation属性

并且设置为"horizontal"。结果如下:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   
xmlns:tools="http://schemas.android.com/tools"
   
android:layout_width="match_parent"
   
android:layout_height="match_parent"
   
android:orientation="horizontal">
</LinearLayout>

LinearLayout是一个ViewGroup,是ViewGroup的子类,它以平行或垂直布局子窗口,如上,指定

android:orientation="horizontal"属性,每个LinearLayout的子View按照XML文件设定的顺序出现在

屏幕上。 

另外两个LinearLayout的属性,android:layout_width和android:layout_height被所有的窗口需要,

他们指定窗口的大小。

因为LinearLayout 在布局中是根窗口,它将填充整个屏幕区域,程序通过设置宽和高为match_parent。这个值

指定这个窗口和它的父窗口相同的大小。

更多信息查看lAYOUT导向。

 

 二 增加一个TEXT FIELD

创建一个用户可编辑的TEXT FIELD,在<LinearLayout>节点里增加一个<EditText>元素。

像任何View对象,你必须定义一个包含XML属性指定EditText对象的属性。像下面的部分:

<EditText android:id="@+id/edit_message"
       
android:layout_width="wrap_content"
       
android:layout_height="wrap_content"
       
android:hint="@string/edit_message"/>

android:id  ----这个为View提供一个唯一的标号,你可以在你的APP里引用这个对象,例如

读或操作这个对象。当你从XML文件中提到任何资源对象,标记@是被需要的。他后面跟

一个资源类型id,一个斜线/,然后是资源名称eidt_message。

当你第一次定义一个资源ID时, 资源类型前面的+号是需要的。当编译APP时,SDK工具

使用这个ID名称在你的工程的gen/R.java文件中去创建一个资源ID。一旦资源ID通过这种

方式声明,其他引用这个ID不需要+号。

 android:layout_widthandroid:layout_height ---用于指定宽和高的大小,

wrap_content值说明VIew的大小应该和。。。如果你用match_parent替换,EditText元素

 填充满屏,以为他和LinearLayout一样大。

android:hint

当text_field空时,定义一个默认的字符串显示。

 

三增加一个字符串资源

当你需要定义一个文字输入框在你的应用中,你需要总是指定一个字符串的资源。字符串资源允许你

管理所有UI TEXT。这样以更容易找到和更新文字。

默认情况下,安卓工程包含一个字符串资源文件,这个文件在res/values/strings.xml.

增加一个新的名字'edit_message'和设置值为“Enter a message”

同样在这个文件中增加“Send”字符串,这个是为按钮增加的,叫做“button_send”

strings.xml文件看起来像下面的内容

 

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <string name="app_name">My</string>
    <string name="action_settings">Settings</string>
    <string name="hello_world">Hello world!</string>
    <string name="edit_message">Enter a message</string>
    <string name="button_send">Send</string>

</resources>

四 增加一个按钮

现在增加一个<Button>到视图,和<EditText>过程类似

<Button
android:layout_width="wrap_content"
       
android:layout_height="wrap_content"
       
android:text="@string/button_send"/>

 

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal" >
   
    <EditText android:id="@+id/edit_message"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:hint="@string/edit_message" />

 
 <Button android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:text="@string/button_send"  />
       
</LinearLayout>

 

 

 模拟器显示:


 五 调整INput BOX适合屏幕宽度

现在我们设计了一个拥有EditText和Button的窗口部件,这两个窗口大小仅仅是他们自己的大小,如上面图所示,

这个按钮可以很好的工作,但是对文本域不是很好,也就是对textFeild不是很好,用户可能输入的信息比较长,

所以我们最好让textFeild和屏幕保持一致,你可以使用LinearLayout的weith属性,使用android:layout_weiht属性指定。

weight值守一个数字,它指定每个视图应该消耗剩余的空间量,这工作有点像饮料配方中的成分量:2份伏特加,1份菲利口酒,

意思是2/3的伏特加酒。例如若你给一个窗口的weight是2,其他的窗口是1,这两个值加起来是3,那么第一个窗口将占用2/3的

空间,第二个占用剩下的空间,你若增加第三个窗口,给这个窗口的weight是1,那么第一个窗口占用2/4的空间,剩下的两个窗口

各占用1/4。

默认的weight是0,如果你指定的weight值大于0,并且只指定一个,那么那个窗口填充剩余的空间。

        android:layout_weight="1"

指定weight是为了改进显示效果,你应该修改width的值为0,设置width值为0,改进布局的性能,因为使用wrap_content,需要请求系统

的宽度。




下面修改和上面为修改weight的显示在模拟器上略显不同,貌似没有文档说明的相同,使用真实设备可以查看下。


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值