Android应用的界面编程幻灯片

1、Android 手机开发,第2章 Android 应用的界面编程,1,2,第2章 Android 应用的界面编程,Android程序界面与View组件 Android 控制程序界面的三种方式 布局管理器 常见组件的使用方法 部分高级组件介绍,2,2020/6/22,布局管理,ViewGroup、xxxLayout、Button、TextView、ImageView等都是UI组件; xxxLayout又可以作为容器使用。,3,2020/6/22,Activity,Activity是一个应用组件，包含了一个可以和用户交互的显示界面。 一个应用程序可包含多个Activity, 其中有一个main a

2、ctivity，当运行程序时首先启动它。 Activity是一个类，继承自Activity类 每一个Activity都要在AndroidManifest.xml文件当中注册,4,2020/6/22,2.1 Android 控制程序界面的三种方式,使用XML布局文件控制UI界面 google 推荐 findViewById() 在Java代码中开发UI界面 setContentView() 混合使用XML布局文件和Java代码 复杂界面中常用,5,2020/6/22,XML布局文件是Android系统中定义视图的常用方法 文件必须保存在res/layout目录中 XML布局文件的扩展名必须是xm

3、l XML的文件名必须符合Java的变量命名规则 每一个布局文件的根节点可以是任意的组件 布局文件的根节点必须包含android命名空间 组件标签需要使用“+id/stringvalue”指定ID ID值的必须符合Java的变量命名规范,使用XML布局视图,xmlns:android=“,6,2020/6/22,为这个Activity设计一个界面布局(activity_main.xml),使用XML布局文件控制UI界面, ,7,2020/6/22,创建一个Activity通常有这样几个步骤： 需要创建一个Activity类的子类 必须实现onCreate()方法,使用XML布局文件控制UI界面

4、,public class MainActivity extends Activity private TextView tv; Override protected void onCreate(Bundle savedInstanceState) super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); tv =(TextView)findViewById(R.id.textview1); ,8,2020/6/22,视图（View）是可视化的界面元素 也可以通过代码创建,视图概述,在Java代码中开

5、发UI界面,/创建线性布局对象 LinearLayout mLinearLayout = new LinearLayout(this); setContentView(mLinearLayout); mLinearLayout. setLayoutParams(new LinearLayout.LayoutParams( LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT); mLinearLayout. setOrientation(LinearLayout.VERTICAL); /创建文本控件对象 TextView tv = new Tex

6、tView(this); tv.setText(“textview1”); LinearLayout.LayoutParams mLayoutParams = new LinearLayout.LayoutParams( LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT); /将文本控件添加到线性布局容器中 mLinearLayout.addView(mTextView, mLayoutParams);,9,2020/6/22,通过代码与XML布局结合进行混合布局 有时候存在一个容器中的子内容可变的情况 可以将类似模板的容器和各种可变子内容

7、分别定义在XML中 通过代码进行主布局和子布局的动态整合 一个混合布局的过程示例 1、子布局的XML示例child.xml,代码与XML混合布局, ,10,2020/6/22,通过代码与XML布局结合进行混合布局 一个混合布局的过程示例 2、主布局的XML示例main.xml, ,代码与XML混合布局,11,2020/6/22,通过代码与XML布局结合进行混合布局 一个混合布局的过程示例 3、通过代码整合主布局和子布局,/在Activity中显示主布局 setContentView(R.layout.main); /动态加载子布局 View mBarView = View.inflate(th

8、is, R.layout.child, null); /找到box容器 LinearLayout mLinearLayout = (LinearLayout)findViewById(R.id.box); /将子布局加入box容器 mLinearLayout.addView(mBarView);,代码与XML混合布局,12,2020/6/22,2.2 XML 布局管理,13,2020/6/22,2.2.1 LinearLayout,将组件按照水平或垂直方向排列 orientation setOritation(int) gravity setGravity(int) layout_width

9、LayoutParams layout_height layout_weight,14,2020/6/22,用于设定组件大小相关的属性 每一个视图都需要定义android:layout_width和android:layout_height，其值可以有如下几种情况 可以指定确切的大小 wrap_content：表示有视图的内容决定大小 fill_parent（Level8之后改名为match_parent）表示与父容器一样大,定位与大小,15,2020/6/22,设置组件填充父容器时存在两种方式 内填充的部分存在于组件空间内，相当于页边距的效果 padding用于设置四边的内边距 paddin

10、gLeft、paddingRight、paddingTop、paddingBottom 外填充的部分存在与组件空间外，类似于边界的间隔 layout_margin用于设置四边的外部间距 layout_marginLeft、layout_marginRight、layout_marginTop、layout_marginBottom,内填充与外填充,16,2020/6/22,所谓重量属性指的是控件的比重layout_weight 当layout_width或layout_height设置为wrap_content时 控件的大小有内容决定 layout_weight表示控件在满足内容显示之外需要占

11、据的空间比重 当l layout_width或layout_height设置为fill_parent时 控件本身原则上需要充满父容器 如果容器中存在多个控件，则比重大的占据空间反而小,重量属性,17,2020/6/22,px（像素）不同设备的显示效果相同 in（英寸）长度单位 mm（毫米）长度单位 pt（磅）1/72英寸 dp（与密度无关的像素） 一种基于屏幕密度的抽象单位 在每英寸160个点的显示器上，1dp=1px dip（与dp相同） sp（与刻度无关的像素） 与dp类似，但是可以根据用户字体大小缩放 建议用sp用作字体大小的单位,度量单位与字体,18,2020/6/22,2.2.2 T

12、ableLayout,派生自LinearLayout 向每一行中添加组件 每一行上可放置数量不同的组件 android:collapse android:shrink android:stretch,19,2020/6/22,2.2.2 Layout的嵌套,20,2020/6/22,2.2.3 FrameLayout,根据对齐方式把组件一个一个叠在一起,21,2020/6/22,2.2.4 AbsoluteLayout,通过X，Y坐标来控制组件位置 layout_x layout_y px :像素 dp(dip): 设备独立像素 pt :磅 AbsoluteLayout is deprecat

13、ed.,22,2020/6/22,2.2.5 RelativeLayout,容器内子组件由相对于兄弟组件、父容器的位置来确定 android:layout_above 将该控件的底端置于给定控件的上端 android:layout_below 将该控件的上端置于给定控件的下端 android:layout_toLeftOf 将该控件的右端置于给定控件的左端 android:layout_toRightOf 将该控件的左端置于给定控件的右端,23,2020/6/22,2.2.5 RelativeLayout,android:layout_alignLeft 设置该控件的左端与给定控件的左端对齐

14、android:layout_alignRight 设置该控件的左端与给定控件的右端对齐 android:layout_alignTop 设置该控件的上端与给定控件的上端对齐 android:layout_alignBottom 设置该控件的底端与给定控件的底端对齐 android:layout_alignBaseline 将该控件的基线设置为给定控件的基线,24,2020/6/22,2.2.5 RelativeLayout（true）,android:layout_alignParentLeft 该控件与父控件的左端对齐 android:layout_alignParentRight 该控件

15、与父控件的右端对齐 android:layout_alignParentTop 该控件与父控件的顶端对齐 android:layout_alignParentBottom 该控件与父控件的底端对齐,25,2020/6/22,2.2.5 RelativeLayout(true),android:layout_centerHorizontal 该控件在父控件中水平居中 android:layout_centerInParent 该控件在父控件中水平垂直居中 android:layout_centerVertical 该控件在父控件中垂直居中,26,2020/6/22,2.3.1 TextView

16、setView( ),59,2020/6/22,2.5.3 对话框风格的窗口,android:theme=android.style/Theme.Dialog,60,2020/6/22,2.5.4 PopupWindow,(1) 调用PopupWindow的构造器创建对象 (2) 显示PopupWindow： showAsDropDown(View) showAtLocation( ),61,2020/6/22,2.5.5 DatePickerDialog notification.vibrate = new long0,50,200,100; ,66,2020/6/22,2.7 Menu,添加菜单：复写boolean onCreateOptionsMenu(Menu menu) 响应事件：复写boolean onOptionsItemSelected(MenuItem item) 添加子菜单：addSubMenu() 添加菜单项：add(groupId, itemId, order, title) setHeaderIcon(), setHeaderTitle(),67,2020/6/22,2.7.3 单选菜单和复选菜单,setCheckable(bool