1、2024/11/28/1Android用户界面开发中智讯(武汉)科技有限企业物联网系列专业课程之Android用户界面开发培训课件第1页2024/11/28/2用户界面基础用户界面布局用户界面控件物联网系列专业课程之Android用户界面开发培训课件第2页2024/11/28/3用户界面界面如同人面孔,含有吸引用户直接优势物联网系列专业课程之Android用户界面开发培训课件第3页2024/11/28/4Android应用程序模型Android应用程序资源源代码Activity控件布局(Layout)图片(Drawable)值(Values)R.java物联网系列专业课程之Android用户界
2、面开发培训课件第4页2024/11/28/5怎样实现Android界面Android界面布局Layout定义了界面中全部元素、结构和相互关系:使用XML文件描述界面布局在程序运行时动态添加或修改界面布局布局对象在程序中调用:setContentView()从布局文件加载布局及控件findViewById()从资源中找到控件布局Activity加载setContentView使用findViewByID物联网系列专业课程之Android用户界面开发培训课件第5页2024/11/28/6Android XML布局文件使用XML文件申明界面布局特点将程序表现层和控制层分离在后期修改用户界面时,无需更
3、改程序源代码用户还能够经过可视化工具直接看到所设计用户界面,有利于加紧界面设计过程,而且为界面设计与开发带来极大便利性物联网系列专业课程之Android用户界面开发培训课件第6页2024/11/28/7简单XML布局文件线性布局布局方向控件命名空间控件资源ID控件大小控件显示内容物联网系列专业课程之Android用户界面开发培训课件第7页2024/11/28/8界面对象常规属性android:id属性:申明了控件对象ID,这个ID主要用于在代码中引用这个控件对象“+id/button1”表示所设置ID值表示后面字符串是ID资源加号(+)表示需要建立新资源名称,并添加到R.java文件中斜杠后面
4、字符串(button1)表示新资源名称假如资源不是新添加,或属于Android框架ID资源,则不需要使用加号(+),但必须添加Android包命名空间,比如android:id=android:id/emptyandroid:id=+id/button1物联网系列专业课程之Android用户界面开发培训课件第8页2024/11/28/9界面对象常规属性android:layout_width属性:用来设置控件对象宽度,fill_parent表示控件对象宽度将等于父控件宽度android:layout_height属性:用来设置控件对象高度,wrap_content表示控件对象宽度只要能够包含所
5、显示字符串即可android:layout_width=fill_parentandroid:layout_height=wrap_content物联网系列专业课程之Android用户界面开发培训课件第9页2024/11/28/10界面对象常规属性Android中使用单位px:表示屏幕实际像素数。比如,320*480屏幕在横向有320个象素,在纵向有480个象素。in:表示英寸,是屏幕物理尺寸。每英寸等于2.54厘米,形容手机屏幕大小用是屏幕对角线长度。mm:表示毫米,是屏幕物理尺寸。pt:表示一个点,是屏幕物理尺寸,大小为1英寸1/72。dp(密度独立像素):也作dip,是一个基于屏幕密度抽
6、象单位。基本密度是160dpi,假如屏幕密度提升,则dp对应实际px数也会对应提升。sp(scale独立像素):用于字体一个基于屏幕密度抽象单位。android:layout_width=“120dp物联网系列专业课程之Android用户界面开发培训课件第10页2024/11/28/11界面对象常规属性android:text属性:用来设置控件对象上显示文字内容android:text=Button物联网系列专业课程之Android用户界面开发培训课件第11页2024/11/28/12引入资源引入资源:将download.png文件拷贝到/res/drawable文件夹下在/res目录上选择R
7、efresh新添加文件将显示在/res/drawable文件夹下R.java文件内容也得到了更新不然提醒无法找到资源错误物联网系列专业课程之Android用户界面开发培训课件第12页2024/11/28/13程序加载XML资源经过调用方法:setContentView()能够实现对Layout布局资源调用:public void onCreate(Bundle savedInstanceState)super.onCreate(savedInstanceState);setContentView(R.layout.main);物联网系列专业课程之Android用户界面开发培训课件第13页202
8、4/11/28/14程序创建对象及引用经过调用方法:findViewById()能够实现对控件对象引用:Button myButton=(Button)findViewById(R.id.button1);myButton.setText(test);物联网系列专业课程之Android用户界面开发培训课件第14页2024/11/28/15可视化编辑器物联网系列专业课程之Android用户界面开发培训课件第15页2024/11/28/16用户界面基础用户界面布局用户界面控件物联网系列专业课程之Android用户界面开发培训课件第16页2024/11/28/17Android界面布局Android
9、界面布局Layout定义了界面中全部元素、结构和相互关系。物联网系列专业课程之Android用户界面开发培训课件第17页2024/11/28/18惯用布局对象Android操作系统提供以下5种窗体布局:线性布局(Linear Layout)框架布局(Frame Layout)表格布局(Table Layout)相对布局(Relative Layout)绝对布局(Absolute Layout)物联网系列专业课程之Android用户界面开发培训课件第18页2024/11/28/19线性布局-Linear Layout线性布局LinearLayout在线性布局中,全部子元素都按照垂直或水平次序在界
10、面上排列假如垂直排列,则每行仅包含一个界面元素假如水平排列,则每列仅包含一个界面元素Android:orientation=“vertical”或Android:orientation=“horizontal”物联网系列专业课程之Android用户界面开发培训课件第19页2024/11/28/20线性布局实例 物联网系列专业课程之Android用户界面开发培训课件第20页2024/11/28/21线性布局控件惯用属性属性功效android:id 为控件指定对应ID android:text指定控件当中显示文字,需要注意是,这里尽可能使用strings.xml文件当中字符串 android:gr
11、avity指定控件基本位置,比如说居中,居右等位置android:textSize指定控件当中字体大小android:background指定该控件所使用背景色,RGB命名法 android:width指定控件宽度android:height 指定控件高度android:padding指定控件内边距,也就是说控件当中内容android:sigleLine假如设置为真话,则将控件内容在同一行当中进行显示,屏幕宽度不够时,将显示省略号android:layout_weight控件权重,以父控件为整体单位来计算物联网系列专业课程之Android用户界面开发培训课件第21页2024/11/28/22框
12、架布局-Frame Layout框架布局FrameLayout框架布局(FrameLayout)是最简单界面布局,是用来存放一个元素空白空间,且子元素位置是不能够指定,只能够放置在空白空间左上角假如有多个子元素,后放置子元素将遮挡先放置子元素使用Android SDK中提供层级观察器(Hierarchy Viewer)深入分析界面布局,能够对用户界面进行分析和调试,并以图形化方式展示树形结构界面布局物联网系列专业课程之Android用户界面开发培训课件第22页2024/11/28/23表格布局-Table Layout表格布局TableLayout表格布局(TableLayout)是一个惯用界
13、面布局,它将屏幕划分网格,经过指定行和列将界面元素添加到网格中网格边界对用户是不可见表格布局还支持嵌套,能够将另一个表格布局放置在前一个表格布局网格中,也能够在表格布局中添加其它界面布局,比如线性布 局、相对布局等TextViewEditTextRow 1ButtonButtonRow 2表格布局物联网系列专业课程之Android用户界面开发培训课件第23页2024/11/28/24相对布局-Relative Layout相对布局RelativeLayout相对布局(RelativeLayout)是一个非常灵活布局方式,能够经过指定界面元素与其它元素相对位置关系,确定界面中全部元素布局位置特点
14、:能够最大程度确保在各种屏幕类型手机上正确显示界面布局物联网系列专业课程之Android用户界面开发培训课件第24页2024/11/28/25绝对布局-Absolute Layout绝对布局AbsoluteLayout绝对布局(AbsoluteLayout)能经过指定界面元素坐标位置,来确定用户界面整体布局绝对布局是一个不推荐使用界面布局,因为经过X轴和Y轴确定界面元素位置后,Android系统不能够依据不一样屏幕对界面元素位置进行调整,降低了界面布局对不一样类型和尺寸屏幕适应能力物联网系列专业课程之Android用户界面开发培训课件第25页2024/11/28/26布局嵌套布局嵌套是指相同或
15、者不一样类型布局之间能够嵌套使用,其目标是为了利用不一样布局特征,方便构建我们想要得到图案物联网系列专业课程之Android用户界面开发培训课件第26页2024/11/28/27布局嵌套实例 物联网系列专业课程之Android用户界面开发培训课件第27页2024/11/28/28用户界面基础用户界面布局用户界面控件物联网系列专业课程之Android用户界面开发培训课件第28页2024/11/28/29Android用户界面控件Android系统界面控件有两种:系统控件:是Android系统提供给用户已经封装界面控件。提供在应用程序开发过程中常见功效控件。系统控件更有利于帮助用户进行快速开发,同
16、时能够使Android系统中应用程序界面保持一致性定制控件:是用户独立开发控件,或经过继承并修改系统控件后所产生新控件。能够为用户提供特殊功效或与众不一样显示需求方式常见系统控件包含TextView、EditText、Button、ImageButton、Checkbox、RadioButton、Spinner、Progress、ListView和TabHost、Dialog、Toast、Notification等物联网系列专业课程之Android用户界面开发培训课件第29页2024/11/28/30Android控件类型分类惯用控件:TextView、EditText、Button选择控件:
17、CheckBox、RadioButton、Spinner进度条控件:Progress对话框控件:Dialog消息提醒控件:Toast物联网系列专业课程之Android用户界面开发培训课件第30页2024/11/28/31惯用控件:TextView、EditTextTextView和EditTextTextView是一个用于显示字符串控件EditText则是用来输入和编辑字符串控件TextViewEditText程序名EditText实际上是一个含有编辑功效TextView物联网系列专业课程之Android用户界面开发培训课件第31页2024/11/28/32控件布局实例 惯用函数:setTex
18、t();getText();物联网系列专业课程之Android用户界面开发培训课件第32页2024/11/28/33惯用控件:Button、ImageButtonButton和ImageButtonButton是一个按钮控件,用户能够在该控件上点击,随即引发对应事件处理函数ImageButton用以实现能够显示图像功效控件按钮物联网系列专业课程之Android用户界面开发培训课件第33页2024/11/28/34控件布局实例 也能够经过程序实现ImageButton上图片显示:myImageButton.setImageResource(R.drawable.download);物联网系列专业
19、课程之Android用户界面开发培训课件第34页2024/11/28/35按钮控件监听按钮响应点击事件:添加点击事件监听器final Button myButton=(Button)findViewById(R.id.button1);myButton.setOnClickListener(new View.OnClickListener()public void onClick(View v)/TODO Auto-generated method stub myButton.setText(我按了Button一下););监听器消息响应函数物联网系列专业课程之Android用户界面开发培训课件
20、第35页2024/11/28/36按钮控件监听final Button myButton=(Button)findViewById(R.id.button1);final ImageButton myImageButton=(ImageButton)findViewById(R.id.imagebutton1);View.OnClickListener buttonListener=new View.OnClickListener()public void onClick(View v)/TODO Auto-generated method stub switch(v.getId()case
21、R.id.button1:myButton.setText(我按了Button一下);return;case R.id.imagebutton1:myButton.setText(我按了ImageButton一下);return;myButton.setOnClickListener(buttonListener);myImageButton.setOnClickListener(buttonListener);物联网系列专业课程之Android用户界面开发培训课件第36页2024/11/28/37选择控件:CheckBox、RadioButtonCheckBox和RadioButtonChe
22、ckBox:多项选择控件RadioButton:单项选择控件RadioGroup是RadioButton承载体,程序运行时不可见,在每个RadioGroup中,用户仅能够选择其中一个RadioButton物联网系列专业课程之Android用户界面开发培训课件第37页2024/11/28/38final CheckBox myCheckBox=(CheckBox)findViewById(R.id.checkbox01);myCheckBox.setText(我状态是:+myCheckBox.isChecked();myCheckBox.setOnClickListener(new View.O
23、nClickListener()public void onClick(View v)/TODO Auto-generated method stub myCheckBox.setText(我状态是:+myCheckBox.isChecked(););CheckBox控件实例 物联网系列专业课程之Android用户界面开发培训课件第38页2024/11/28/39消息提醒控件:ToastToast是在窗口表面弹出通知消息。它仅仅是填充消息需要空间大小,用户当前activity保留可见性和可交互性。通知会自动褪掉,它不会接收用户交互事件。物联网系列专业课程之Android用户界面开发培训课件第3
24、9页2024/11/28/40Toast控件实例myButton1.setOnClickListener(new OnClickListener()public void onClick(View v)/TODO Auto-generated method stub CharSequence text=Hello Toast!;int duration=Toast.LENGTH_SHORT;Toast toast=Toast.makeText(ToastActivity.this,text,duration);/toast.setGravity(Gravity.TOP|Gravity.LEFT,0,0);toast.show(););物联网系列专业课程之Android用户界面开发培训课件第40页2024/11/28/41物联网系列专业课程之Android用户界面开发培训课件第41页