第5章 用户界面.pptx

第5章 用户界面 哈尔滨工程大学 王向辉 本章学习目标： 掌握界面布局的使用方法 了解控件分类和基本用途 掌握常用控件的使用方法 5.1 控件概述 界面控件 可以被拖拽的界面元素 51个控件，9个子类 界面控件的分类和数量 类别 说明 说明 User Interface 常用控件 11 Layout 屏幕布局 3 Media 媒体控件 9 Drawing and Animation 动画控件 3 Sensors 传感器控件 5 Social 社交控件 6 Storage 存储控件 3 Connectivity 通信控件 4 LEGO MINIDSTORMS 乐高机器人控件 7 5.1 控件概述 界面控件 常用控件（User Interface） 使用频率最高，如按钮、标签、复选框控件 屏幕布局（Layout） 设定屏幕中元素排列方式的控件 媒体控件（Media） 播放声音、视频，录音、录像控件 传感器控件（Sensors） 与硬件设备相关，如加速度传感器、位置传感器、方向传感器和进场通讯 5.1 控件概述 界面控件 社交控件（Social） 用来与他人交互的控件，如拨号、短信、选取联系人控件 存储控件（Storage） 与信息存储相关的控件，如本地数据库和网络数据库控件 通讯控件（Connectivity） 信息交换的控件，如蓝牙、Web控件 乐高机器人控件（LEGO MINIDSTORMS） 乐高NXT智慧型机器人的开发控件 5.2 屏幕布局 屏幕布局（Layout） 水平布局（HorizontalArrangement） 垂直布局（VerticalArrangement） 表格布局（TableArrangement） 可视化控件布局的三种方式 5.2 屏幕布局 水平布局（HorizontalArrangement） 所有界面控件都在水平方向上按照顺序排列 运行时，水平布局的边框被隐藏 水平布局在界面编辑器和手机运行时的不同效果 5.2 屏幕布局 水平布局（HorizontalArrangement） 将水平布局拖拽到界面编辑器，形成正方形区域 将控件拖拽到正方形区域，正方形区域变成长方形 不让控件总尺寸超出屏幕显示范围 空置的水平布局和向水平布局添加控件 5.2 屏幕布局 水平布局 （HorizontalArrangement） AlignHorizontal属性 布局内控件的排布方式 AlignVertical属性 布局内控件的列布方式 Visible属性 控件是否可见 Width属性 控件宽度 Height属性 控件高度 水平布局的属性 5.2 屏幕布局 水平布局（HorizontalArrangement） AlignHorizontal属性 左对齐（Left） 居中（Center） 右对齐（Right） 水平布局的AlignHorizontal属性 5.2 屏幕布局 垂直布局（VerticalArrangement） 所有界面控件都在垂直方向按照顺序排列，类似水平布局 例：垂直布局和水平布局嵌套使用 垂直布局和垂直布局嵌套水平布局 5.2 屏幕布局 表格布局（TableArrangement） 将屏幕划分成表格 通过行（Rows）、列（Columns）控制格数量 根据控件大小自动修改表格大小 垂直布局和垂直布局嵌套水平布局 5.2 屏幕布局 表格布局（TableArrangement） 行（Rows）、列（Columns）表格布局的专有属性 在界面编辑器的属性区内修改 表格布局的属性 5.2 屏幕布局 表格布局（TableArrangement） 例：表格布局、垂直布局、水平布局的嵌套 表格布局：2*2 垂直布局：左上、右下 水平布局：右上、左下 表格布局的嵌套 5.3 常用控件 常用控件 按钮（Button） 复选框（CheckBox） 时钟（Clock） 图片（Image） 标签（Label） 选项列表（ListPiker） 通知（Notifier） 密码框（PasswordTextBox） 文本框（TextBox） 网页浏览器（WebViewer） 5.3 常用控件 常用控件（User Interface） 点击控件右侧的问号，获取控件的使用说明 常用控件和按钮控件说明 5.3 常用控件 按钮（Button） 修改按钮属性 按钮属性的编辑栏 5.3 常用控件 按钮（Button） 按钮属性的编辑栏 属性 说明 Background Color 设置按钮的背景色 Enabled 设置按钮是否可用 FontBold 设置字体加粗 FontItalic 设置字体倾斜 FontSize 设置字体大小 FontTypeface 设置字体类型 Image 设置按钮的背景图案 Shape 设置按钮的形状，如圆角按