android实验2界面设计：基本组件
第二章Android基础界面控件
View组件简介
ViewGroup组件的层次结构
View组件简介
View类的常见XML属性、方法介绍： XML属性
android:alpha android:background android:clickable
对应方法
按钮在人机交互界面中使用得最为广泛，用于用户和应
用程序之间的交互行为。 在Android中使用“<Button>”组件可以定义出一个显示 的按钮，并且可以在按钮上指定相应的显示文字。 当我们想把图片作为按钮时，有两种方法：一种是将该 图片作为Button的背景图片；另一种是使用ImageButton 按钮，设置属性android:src为该图片即可。
相对布局（RelativeLayout）管理器指的是通过控制，将组 件摆放在一个指定参考组件的上、下、左、右等位置，这些 效果可以直接通过各个组件提供的属性完成。 手动岸例：chapter02 /RelativeTest 功能：以一组件为中心，将 其它组件分布在该组件的四
（3）相对布局
周，形成“梅花布局” 。
其他布局由学生自己查看
Android应用界面编程
（4）布局管理器嵌套： 在使用布局管理器进 行组件布局的时候， codes\02\Calculate 可以将各个布局管理 器嵌套在一起使用。
案例：codes\02\Calculate 案例：c来自apter02\Calculate
Android应用界面编程
3
开发自定义View
Android中所有的界面组件都是继承于View类，View本身仅仅 是一块空白的矩形区域，不同的界面组件在这个矩形区域上绘 制外观即可形成风格迥异的组件。 基于上述原理，开发者完全可以通过继承View类来创建具有 自己风格的组件。
实验2_Android用户界面程序设计
6学时
实验目的：
1. 2. 3. 4. 5. 6.
掌握Android常用界面控件的使用方法。 掌握控件响应函数的编写方法。 掌握各种界面布局的特点和使用方法。 掌握使用Intent进行组件通信的原理。 掌握使用Intent启动Activity的方法。 掌握Activity间数据传送的方法。
实验内容：
设计个人信息管理系统界面，要求如下。
③
设计程序主界面MainActivity，该界面上有一个 “登录”按钮、一个“注册”按钮、一个“查看” 按钮和一个用于显示登录状态的TextView，点击 “登录”按钮后打开一个普通对话框，该对话框上 面有输入用户名、密码和用户类型(管理员、普通 用户，Spinner) 的控件，在用户关闭这个对话框后， 将用户输入的信息递到MainActivity，如果用户名、 密码及类型正确，则MainActivity上的TextView显 示“某某用户已登录”，否则显示“用户名或密码 错误” 。
实验内容：
设计个人信息管理系统界面，要求如下。
⑤
点击主界面MainActivity上的 “查看”按钮，如果用户未登陆，则提 示用户登陆，否则根据登陆用户的类型分别显示以下内容：
I.
II.
如果是普通用户，则跳转到PersonInfoActivity页面。如果该用户已填写 过个人信息，则将填写的信息显示在相应控件上，用户可以对以上信息 修改，点击“确定”按钮后更新掉原信息；否则用户使用该页添加自己 的信息。 如果是管理员，则跳转到PensonsActivity页面，该页面含有一个自定义 列表控件显示所有用户的信息，其每个列表项包含姓名、性别、出生日 期、教育程度、电话、邮箱（见下图布局）。当点击某个列表项时，跳 转到该用户的PersonInfoActivity页面。但管理员不能修改其它用户的信 息，因此，此时该页面上的输入控件及按钮应为不可用状态。
实验2 Android应用界面开发(1)
实验2、Android应用界面开发(1)一、实验目的1.了解View类、ViewGroup的作用2.掌握常用布局管理器的使用3.掌握XML界面控制的设计方法4.掌握常用的界面设计组件的功能❑TextView和EditText的功能和用法❑Button和ImageButton的功能和用法❑RadioButton和CheckBox的功能和用法❑ToggleButton的功能和用法❑时钟的功能和用法❑ImageView的功能和用法❑AutoCompleteTextView的功能和用法❑Spinner的功能和用法❑日期和时间选择器的功能和用法5.掌握常用的XML属性6.使用XML属性来开发漂亮的用户界面7.从本周起，以后每次小课的实验内容，要求上传至小课老师的FTP。
二、实验步骤1.简要概括View和ViewGroup作用。
答：View：任何一个View对象都继承android.view.View类。
它是一个存储有屏幕上特定的一个矩形布局和内容属性的数据结构。
作为一个基类，View类为Widget 服务， Widget则是一组用于绘制交互屏幕元素的完全实现子类。
ViewGroup：是一个android.view. ViewGroup类的对象。
它的功能是装载和管理一组下层的View和其他的ViewGroup，作为一个基类， ViewGroup为Layout服务。
2.相对布局管理器的使用，补充代码，使程序运行的效果如下图所示：图1 实验效果图RelativeLayoutDemo.java中的源代码如下所示：下面是布局文件main.xml中的内容，请补充完整，实现图1中的界面：<?xml version="1.0"encoding="utf-8"?><RelativeLayout xmlns:android="/apk/res/android"android:layout_width="fill_parent"android:layout_height="fill_parent"android:background="#000000"><TextViewandroid:id="@+id/label"android:layout_width="fill_parent"android:layout_height="wrap_content"android:text="Type here"android:textSize="12pt"android:textStyle="bold"android:textColor="#AA0000"android:layout_marginLeft="15dip"/><EditTextandroid:id="@+id/entry"android:layout_width="fill_parent"android:layout_height="wrap_content"android:background="@android:drawable/editbox_background"android:layout_below="@+id/label"/><Buttonandroid:id="@+id/ok"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_below="@id/entry"android:layout_alignParentRight="true"android:layout_marginLeft="10dip"android:text="OK"/><Buttonandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_alignBaseline="@+id/ok"android:layout_alignBottom="@+id/ok"android:layout_toLeftOf="@+id/ok"android:text="Cancel"/></RelativeLayout>3.布局管理器的嵌套，编写程序，在模拟器中实现如下的效果界面，选择合适的布局管理器。
Android 的界面布局及基本控件
使用XML资源文件创建布局
流式布局元素标签
用于指定流式布局的方向：分 别为vertical和horizontal
用于指定元素的水平宽度，有 三种取值：fill_parent表示当前
View是Android控件的一个基类，一个View就是屏幕上的一个矩形区域， 主要负责绘制元素和事件处理。View提供了许多用于界面显示的子类，例 如按钮类Button、文本显示区域TextView类、EditText类等 。我们往往利用 View类的这些子类去绘制界面元素。View类的详细说明如下图所示:
流式布局LinearLayout
LinearLayout是线性布局控件，它包含的子控件将以横向或竖 向的方式排列，按照相对位置来排列所有的组件或者其他的容器, 超过边界时，某些组件将缺失或消失。因此一个垂直列表的每一 行只会有一个组件或者是容器，而不管他们有多宽，而一个水平 列表将会只有一个行高（高度为最高子控件的高度加上边框高 度）。 LinearLayout有两个重要的属性:
帧式布局FrameLayout
帧式布局FrameLayout：在Android的五大布局中是最简 单的布局方式，在需要布局中的控件有重叠的情况下才使 用。 在它上面可以添加多个组件，所有组件都被固定在 界面的左上角，叠加显示，后一个组件会在前一个组件之 上显示 ，也就是说后一个组件会全部或部分的覆盖前一 个组件。
该属性用于指定R.java中的某 个特定资源ID
该属性用于指定元素内文字的大小
View及ViewGroup简介
我们知道Activity是Android应用程序基本的功能单元，Android的每一个 窗口都是一个Activity。但是Activity并不能真正的显示出来，我们要显示界 面信息，需要在Activity中通过调用方法setContentView(View view)来实现， 也就是说真正显示出来的是View。
实验2 android的界面设计(控件与布局)
实验2 android的界面设计(控件与布局)学时：4学时一、实验目的：1、了解Android编程原理2、掌握界面控件设计3、了解和熟悉常用控件的使用、界面布局等内容。
二、实验内容：1.基本控件的制作：（1）TextView的制作：a)体会Autolink，依次更换属性：web/phone/all/email/b) 制作跑马灯效果android:ellipsize 设置当文字过长时,该控件该如何显示。
有如下值设置：”start”—-省略号显示在开头;”end”——省略号显示在结尾;”middle”—-省略号显示在中间;”marquee”——以跑马灯的方式显示(动画横向移动)android:marqueeRepeatLimit 在ellipsize 指定marquee 的情况下，设置重复滚动的次数，当设置为marquee_forever 时表示无限次。
android:focusableInTouchMode：是否在触摸模式下获得焦点。
android:focusable 控件是否能够获取焦点(2)EditView制作(a) maxLength：最大输入长度属性(b) singleLine：多行文本框(c) inputType：限制输入文本类型(d) hint：设置提示信息2.布局设计(1) LinearLayout布局：（2）Relative Layout：（3）Table Layout3．建立一个如图所示的图形界面:4.用ListView制作如图界面(图片自定) (将该题以你的学号命名，发给你班的学习委员，以班为单位统一发给我，我的邮箱为：****************)：5．用expandablelistview制作如下界面:6.对话框制作：(2)部分程序代码：protected void dialog() {AlertDialog.Builder builder = new Builder(Main.this);builder.setMessage("确认退出吗？");builder.setTitle("提示");builder.setPositiveButton("确认", new OnClickListener() { @Overridepublic void onClick(DialogInterface dialog, int which) { dialog.dismiss();Main.this.finish();}});builder.setNegativeButton("取消", new OnClickListener() {@Overridepublic void onClick(DialogInterface dialog, int which) {dialog.dismiss();}});builder.create().show();}//在onKeyDown(int keyCode, KeyEvent event)方法中调用此方法public boolean onKeyDown(int keyCode, KeyEvent event) {if (keyCode == KeyEvent.KEYCODE_BACK && event.getRepeatCount() == 0) {//点后退键的时候，为了防止点得过快，触发两次后退事件dialog();}return false;}(2)界面如下：部分代码：Dialog dialog = new AlertDialog.Builder(this).setIcon(android.R.drawable.btn_star).setTitle("喜好调查").setMessage("你喜欢李连杰的电影吗？").setPositiveButton("很喜欢",new OnClickListener() {@Overridepublic void onClick(DialogInterface dialog, int which) {// TODO Auto-generated method stub Toast.makeText(Main.this, "我很喜欢他的电影。
ex_02 实验二——Android程序UI设计
实验二Android程序UI界面设计【目的】Android程序设计基础。
熟悉各种UI控件并且进行UI设计。
【要求】1、了解Android程序设计基础2、掌握各种UI控件的基本功能和用法3、掌握UI设计的方法4、完成【课堂练习】5、完成【课后作业】并且提交实验报告【原理】1、掌握各种控件的基本功能和用法。
常用的控件包括：TextView：Button：ImageView：ImageButton：ProgressBar：RadioButton：2、了解各种布局Layout的基本功能和用法。
多种Layout：AbsoluteLayoutFrameLayoutGridView LinearLayoutListLayoutRadioGroupTableLayout···【参考过程】1、新建一个名为Ex02的Android Project。
2、双击Layout->main.xml文件，即可切换到UI设计界面（默认布局为LinearLayout），增加所需控件，如：Button。
3、将Form Widgets中的Button拖入屏幕中，如图1所示。
图14、从Graphical Layout切换至main.xml，可以看见代码中已新增了Button的xml代码，如图2所示。
图25、修改控件的属性：方法一：单击Button，在窗口下方的properties一栏中修改对应的属性，如：background，text，size等。
（如果没有properties一栏出现，右击Button，打开“Show In”->“Properties”即可。
）图3方法二：直接在main.xml文件中修改。
如修改Button的文本内容，则输入android:text=”Yes, I do!”，如图4所示。
图4再次切换回Graphical Layout预览页面，则看到Button的文本内容已经被修改，如图5所示。
实验二 ANDROID界面程序设计
case FONT_RED: edit.setTextColor(Color.RED); break;
case FONT_GREEN: edit.setTextColor(Color.GREEN); break;
case FONT_BLUE: edit.setTextColor(Color.BLUE); break;
@Override // 菜单项被单击后的回调方法 public boolean onOptionsItemSelected(MenuItem mi) {
//判断单击的是哪个菜单项，并针对性的作出响应。 switch (mi.getItit.setTextSize(10 * 2); break;
实验二 Android 界面程序设计
【目的和要求】
1、掌握基本界面程序设计的方法
2、理解高级界面和互动界面程序设计的方法
【实验内容】
1、动态控制布局
package org.crazyit.togglebutton;
import android.app.Activity; import android.os.Bundle; import poundButton; import poundButton.OnCheckedChangeListener; import android.widget.LinearLayout; import android.widget.ToggleButton;
2-Android基本组件介绍
界面控件
10.2.1 设计原则
音乐播放器由一个显示歌曲信息的TextView和两个控制音乐播放的 按钮组成 音乐播放器的界面元素尺寸如下图所示
界面控件
Android系统的界面控件分为定制控件和系统控件
定制控件（自定义View控件）是用户独
立开发的控件，或通过继承并修改系统控件后所产生的新控 件。能够为用户提供特殊的功能或与众不同的显示需求方式
第3组UI: ImageView及子类
ImageView组件，主要作用是展示图片。 这里先在main.xml文件中添加一个按钮，用以打开演示ImageView组件的界 面，实现代码如下： <Button android:id="@+id/image_view_button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="图片视图" /> 设定完按钮后，编写响应代码： Button image_view_button =(Button)findViewById(R.id.image_view_button); image_view_button.setOnClickListener(image_view_button_listener); …… private Button.OnClickListener image_view_button_listener = new Button.OnClickListener() { public void onClick(View v) { Intent intent = new Intent();
Android实验二-UI界面开发
Android 实验设计实验二：界面设计：控件与布局08计应 08386038 胡巍巍【目的】Android编程基础，UI设计。
【要求】1、了解Android编程原理2、掌握界面控件设计3、掌握控件的事件处理编程【原理】1.熟悉各种控件的基本功能常用控件包括：TextView，EditText，Button，ImageView:ImageButton，ProgressBar，Radio button:2.了解各种布局Layout的应用多种Layout： AbsoluteLayout FrameLayout GridViewLinearLayout ListLayout RadioGroupTableLayout ………【实验过程】新建一个Project，并对其布局文件进行简单修改。
1.New 一个 Android project：Project Name: Practice,Application name:Project,Build Target勾选Android 2.2,Package name:com.eoeAndroid.Practice ,Create Activity:Practice ,Min SDK Version:8. 然后点击Next→Finish。
2.Finish后，Eclipse Platform左边Package Explorer栏中出现了我们刚才新建的project。
根据实验要求在layout main.xml中修改布局文件（我选的是相对布局relative layout），增加所需控件。
分析实验要求后，对要求添加的控件按照从上到下，从左到右的顺序添加。
布局xml实现如下：<?xml version="1.0"encoding="utf-8"?><RelativeLayout xmlns:android="/apk/res/android"android:orientation="horizontal" //默认控件水平排列android:layout_width="fill_parent" //相对布局的有效范围android:layout_height="fill_parent"android:background="#ffffff"> //背景颜色<TextView android:id="@+id/text1" //第一个文本控件android:layout_width="wrap_content" //控件宽度和高度有文本决定android:layout_height="wrap_content"android:text="@string/hello"/>//文本内容：hello所定义的字符串<TextView android:id="@+id/text2" //第二个文本控件android:layout_width="wrap_content" //同上android:layout_height="wrap_content"android:layout_below="@id/text1"//这里实现text2布局在text1的下方android:text="Hello,It's Huweiwei's Android Project !"//内容android:textStyle="bold"/>//文本字体样式，这里是粗体<EditText android:id="@+id/ET1"android:layout_width="fill_parent"android:layout_height="wrap_content"android:layout_below="@id/text2"android:hint="Input what you want to say to TA"android:shadowColor="#ff0000"/>//边框阴影眼测<TextView android:id="@+id/text3"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_below="@id/ET1"android:text="Do you miss Miss TA^0^?"android:textStyle="bold"/><RadioGroup android:layout_width="wrap_content"//这里定义了一对单项android:layout_height="wrap_content" //选择，水平排列android:checkedButton="@+id/RB1"android:orientation="horizontal"android:layout_below="@id/text3"android:id="@+id/menu"><RadioButton android:id="@+id/RB1"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="Yes!^0^)/"android:textStyle="normal"android:textColor="#000000"/><RadioButton android:id="@+id/RB2"android:layout_width="wrap_content"android:layout_height="wrap_content"android:textColor="#000000"android:text="No~(T_T)"android:textStyle="normal"/></RadioGroup><TextView android:id="@+id/text4"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_below="@id/menu"android:text="Button,Do you want to marry with ImageView?"android:textStyle="bold"/><ImageView android:id="@+id/IM1"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_below="@id/text4"android:src="@drawable/icon"/>//图像来源<Button android:id="@+id/button1"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_toRightOf="@id/IM1"//button1安置在IM1的左侧，并且android:layout_alignTop="@id/IM1"//与IM1并排android:text="Yes T do !"android:textColor="#0000ff"/><TextView android:id="@+id/text6"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_below="@id/text4"android:layout_toRightOf="@id/button1"android:visibility="invisible"android:layout_marginTop="10dip" //在文本上方预留10dip的空间android:text="Congratulations!"android:textStyle="bold"/><TextView android:id="@+id/text5"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_below="@id/button1"android:visibility="invisible" //设置text5默认情况下不可见android:text="Years later their son was born~,It'sImageButton~"android:textStyle="bold"/><ImageButton android:layout_below="@+id/text5"android:id="@+id/ImageButton01"android:layout_width="wrap_content"android:layout_height="wrap_content"android:visibility="invisible"android:src="@drawable/icon"></ImageButton></RelativeLayout>以上完成了对各个控件的布局，由于是第一次使用xml文件进行布局工作，对控件的各种属性都不了解，因此我并没有采用拖拉的方法编写xml文件，而是一句句的编写，这虽然会花费相当长的时间，但我觉得这是值得的，因为在这个过程中，我知道了控件的每个属性的不同值决定控件怎样的特性，还有不同的控件之间的关系如何用他们的属性表示，这对以后的工作会有很大帮助的。
Android实验报告模板_实验二
package lin.example.helloui;Android中有许多常用控件：文本框：TextView、EditText按钮：Button、RadioButton、CheckBox、ImageButton二，界面布局package lin.example.hellouib;import android.app.Activity;import android.os.Bundle;import android.widget.TextView;import android.widget.Button;public class MainActivity extends Activity { @Override（2）ativity_main.xml:<LinearLayout xmlns:android="/apk/res/android"xmlns:tools="/tools"android:id="@+id/container"android:orientation="vertical"android:layout_width="fill_parent"android:layout_height="fill_parent"tools:context="lin.example.hellouib.MainActivity"tools:ignore="MergeRootFrame"><LinearLayout5、结果分析与实验体会本次试验我们学习Android的视图层与UI设计，再是严重我们熟悉了发中的UI设计，包括了解和熟悉常用控件的使用、界面布局和事件时间处理等内容，在熟悉和掌握了界面控件设计后，使我们更加了解了Android界面布局，控件的时限和属性设置，并且学会了创建和使用定制的控件。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
西安邮电大学（计算机学院）课内实验报告实验名称：界面设计：基本组件专业：网络工程班级：姓名：学号：指导教师：日期：2017年4月20日一．实验目的1. 掌握常用组件在布局文件中的设置2. 掌握在java程序中获取组件值3. 掌握对组件值得验证4. 掌握基本常用的监听器，和事件处理5. 掌握将组件值提交到下一个Activity活动的方法二．实验环境JDK的版本: "1.8.0_40"IDE: eclipse 4.6.1模拟器: 夜神模拟器三．实验内容1. 补充完成下例空缺处，完成注册界面、部门列表框、单击确定检查提交成功、接受界面四．实验过程及分析1.设计UI界面（1）编写布局代码，如下<LinearLayout xmlns:android ="/apk/res/android"android:layout_width = "match_parent"android:layout_height = "match_parent"android:orientation = "vertical"><!-- 主布局中添加文本框和输入框--><TextView android:text = "@string/user"android:layout_width="match_parent"android:layout_height="wrap_content"/><EditText android:id="@+id/name"android:layout_width="200sp"android:layout_height="wrap_content"android:hint="@string/inputuser"/><!-- 在主布局添加文本框和密码框--><TextView android:text = "@string/password"android:layout_width="match_parent"android:layout_height="wrap_content"/><EditText android:id="@+id/password"android:layout_width="200sp"android:layout_height="wrap_content"android:inputType="textPassword"/><!-- 在主布局添加性别文本和复选框--><TextViewandroid:text="@string/sex"android:layout_width="wrap_content"android:layout_height="wrap_content"/> <RadioGroupandroid:id="@+id/sex"android:orientation = "horizontal"android:layout_width="wrap_content"android:layout_height="wrap_content"><!-- 设置默认选择的是女--><RadioButtonandroid:id="@+id/man"android:text="@string/man"android:layout_width="wrap_content"android:layout_height="wrap_content"/><RadioButtonandroid:id="@+id/woman"android:checked="true"android:text="@string/woman"android:layout_width="wrap_content"android:layout_height="wrap_content"/> </RadioGroup><!-- 在主布局添加联系电话文本框和输入框--><TextViewandroid:text="@string/phone"android:layout_width="wrap_content"android:layout_height="wrap_content"/> <EditText android:id="@+id/phone"android:inputType="text|phone"android:layout_width="200sp"android:layout_height="wrap_content"/><!-- 在主布局中添加部门文本框和列表框--><TextViewandroid:text="@string/dept"android:layout_width="wrap_content"android:layout_height="wrap_content"/><Spinner android:id="@+id/dept"android:entries="@array/dept"android:layout_width="wrap_content"android:layout_height="wrap_content"/><!-- 在主布局中添加爱好文本框和一个线性布局--><TextViewandroid:text="@string/hobby"android:layout_width="wrap_content"android:layout_height="wrap_content"/><LinearLayout android:layout_width="wrap_content"android:layout_height="wrap_content"> <CheckBox android:id="@+id/book"android:text="@string/book"android:layout_width="wrap_content"android:layout_height="wrap_content"/> <CheckBox android:id="@+id/sport"android:text="@string/sport"android:layout_width="wrap_content"android:layout_height="wrap_content"/> <CheckBox android:id="@+id/music"android:text="@string/music"android:layout_width="wrap_content"android:layout_height="wrap_content"/> <CheckBox android:id="@+id/movie"android:text="@string/movie"android:layout_width="wrap_content"android:layout_height="wrap_content"/> </LinearLayout><Button android:id="@+id/ok"android:layout_gravity="center_horizontal"android:text="@string/ok"android:onClick="myclick"android:layout_width="wrap_content"android:layout_height="wrap_content"/> </LinearLayout>（3）检测布局的后的效果2.表示部门的Spinner组件，其数据来源文件depts.xml 位于res/values目录下，代码如下所示（1）编写数据文件<?xml version="1.0"encoding="utf-8"?><resources><string-array name = "dept"><item>人力资源部</item><item>销售部</item><item>财务部</item><item>开发部</item></string-array></resources>（2）查看视图效果3.设计后台程序（1）在Activity文件中，定义局部中的组件对象和一个存放爱好中个复选对象的favs动态数组。