收藏 分享(赏)

第四讲 高级用户界面设计_视图组件view.ppt

上传人:dzzj200808 文档编号:3324621 上传时间:2018-10-13 格式:PPT 页数:88 大小:1.37MB
下载 相关 举报
第四讲 高级用户界面设计_视图组件view.ppt_第1页
第1页 / 共88页
第四讲 高级用户界面设计_视图组件view.ppt_第2页
第2页 / 共88页
第四讲 高级用户界面设计_视图组件view.ppt_第3页
第3页 / 共88页
第四讲 高级用户界面设计_视图组件view.ppt_第4页
第4页 / 共88页
第四讲 高级用户界面设计_视图组件view.ppt_第5页
第5页 / 共88页
点击查看更多>>
资源描述

1、Android平台手机嵌入式开发,第四讲 高级用户界面设计-视图组件 Views.,主要内容:,视图组件 小部件(Widgets) 菜单 对话框 消息提示条,主要内容:,通过前面的介绍,了解了Android平台中布局、视图、小部件的相同点和不同点: 相同点:这三者都是可以显示的组件 不同点:从角色定义上布局:注重整体,好比设计图小部件(widget):注重的是细节,好比装饰品视图(view):注重的是组件的组合,好比组合家具本讲重点讲解各视图组件和小部件的使用,4.1:视图组件(Views),1、视图的使用模式: 视图组件的定义和使用和布局组件的定义一样,也有在运行时创建和使用XML这两种方式

2、。和布局组件的不同之处在于,布局组件一般都是布局资源的根元素;而视图组件更多的包含于布局之内,使用时必须使用findViewByID()方法但也有个别视图组件标记根元素:如画廊视图和网页视图使用时可以直接设置为内容,引用方法和布局一样:R.layout.,setContentView(),4.1:视图组件(Views),1、视图的使用模式: 视图组件的事件响应当用户与屏幕显示的组件进行交互时,组件需要侦听用户的选择,并进行相应的响应。下表是view组件的事件及侦听器类型举例,4.1:视图组件(Views),1、视图的使用模式: 视图组件的事件响应在Android平台中,开发人员可以通过两种方式

3、来设置事件侦听: 先定义事件侦听器,后注册给需要侦听用户动作的组件: private OnClickListener mListener = new OnClickListener() Overridepublic void onClick(View v) if (v.getId() = R.id.BTN_ACTION) Toast.makeText(EventHandleDemoAct.this, “Hello, Android!“,Toast.LENGTH_SHORT).show(); ; mBtnAction.setOnClickListener(mListener);,4.1:视图组件

4、(Views),视图组件的事件响应 重载用于侦听用户动作的事件回调函数 public class EventHandleDemoAct extends Activity implements OnClickListener public void onClick(View v) / TODO Auto-generated method stubif (v.getId() = R.id.BTN_ACTION) Toast.makeText(EventHandleDemoAct.this, “Hello, Android!“,Toast.LENGTH_SHORT).show(); mBtnActi

5、on.setOnClickListener(this); 参考例子: Ch04_EventHandleDemo,4.1:视图组件(Views),2、常见视图组件: 适配器视图(AdapterView) 视图组件的继承关系如右图所示:适配器视图组件是部分视图 组件的父类。该视图组件需要 使用适配器来显示数据,,4.1:视图组件(Views),2、常见视图组件: 适配器视图(AdapterView) AdapterView的直接子类AbsListView, AbsSpinnerAdapterView的间接子类ExpandableListView, Gallery, GridView, ListVi

6、ew, Spinner适配器视图类是一个抽象类,无法直接创建该类的实例,只能通过继承该类来实现子类实例,或者已经定义好的适配器视图的子类:列表视图、格子视图等等,4.1:视图组件(Views),2、常见视图组件: 适配器视图(AdapterView) 适配器对象的继承关系如图所示:适配器是适配器视图和数据之间 的桥梁,对适配器的介绍将结合 具体的视图进行适配器是该视图和其所依赖的 数据之间的桥梁。 在android.widget包中定义,4.1:视图组件(Views),2、常见视图组件: 列表视图(ListView)列表视图以其简洁直观的界面效果和灵活的数据模型,赢得了开发人员的青睐。它以列表

7、的形式展示具体内容,并且能够根据数据的长度自适应显示。ListView采用MVC模式将前端显示与后台数据进行分离:数据获取需要一个Adapter对象,4.1:视图组件(Views),Xml定义如下所示: Listview的定义,可以创建新的资源ID,也可以引用系统资源ID, 如果只有一个listview时,可以引用系统Listview的ID注意:该id的定义,必须引用系统资源中ID为list组件,否则会报错: Caused by: java.lang.RuntimeException: Your content must have a ListView whose id attribute i

8、s android.R.id.list 创建新的ID ,4.1:视图组件(Views),相应的Activity组件 只有一个List时,建议使用ListActivity组件:注意与前面的只有一个listview的布局定义保持一致()普通的Activity组件也可以显示列表视图组件,但是在对列表视图所需的记录数据的管理方面存在问题:Activity组件必须自己去维护这些数据集,增加代码量,同时增加了操作与数据的耦合度。Android平台基于此种考虑,把列表视图和数据适配器组合在一起,封装成一个新的Activity组件ListActivity。其有默认的布局资源,也可以定制布局资源。注意必须包含一

9、个ID为list的列表视图,否则会报错。开发者可以直接继承ListActivity,也可以继承Activity,然后在该子类中通过列表适配器进行列表视图与数据的绑定。,4.1:视图组件(Views),列表视图(ListView) Adapter适配器:提供数据给列表视图进行显示 /创建列表数据适配器 ListAdapter adapter = new SimpleAdapter(ListActAct.this,mItems,R.layout.row_ui,mColumnNames,mViewIds); ListActAct.this:适配器上下文 mItems:数组形式的记录集,可以得到展现的

10、记录数 R.layout.row_ui:列表视图的行视图资源ID,定义每一行的布局 mColumnNames:每行数据的列名数组 mViewIds:显示每行数据的组件资源ID数组,定义哪列由哪一个组件显示,4.1:视图组件(Views),列表视图(ListView) 其他形式的Adapter适配器 ArrayAdapter aaData = new ArrayAdapter(this, android.R.layout.simple_list_item_1, data);This:上下文Context R.layout.simple_list_item_1:定义列表项模板 Data:显示的数据

11、设置数据适配器,绑定数据 setListAdapter(adapter);,4.1:视图组件(Views),列表视图(ListView) 设置列表视图的表头和表脚 this.getListView().addHeaderView(this.getLayoutInflater().inflate(R.layout.header_view, null), null, false); this.getListView().addFooterView(this.getLayoutInflater().inflate(R.layout.footer_view, null), null, false);

12、参数说明: this.getLayoutInflater().inflate(R.layout.footer_view, null):通过Activity所关联的布局填充器来分别对表头和表脚布局资源定义进行填充而得到实例 第二个参数:指定其所绑定的数据 第三个参数:指示表头和表脚是否可以选择,4.1:视图组件(Views),列表视图项目点选事件响应 1、通过重载ListActivity组件的onListItemClick()方法进行回调; void onListItemClick(ListView l, View v, int pos, long id) Pos:指示当前所点选的记录在记录集中

13、的位置,起始于0如果增加了表头行,则具体记录位置=pos-1 HashMap item = (HashMap)(mItems.get(pos-1) );String hint = “Current selected: “ +item.get(mColumnNames0).toString()+“ “+item.get(mColumnNames1).toString()+“ “+item.get(mColumnNames2).toString();,4.1:视图组件(Views),列表视图项目点选事件响应 2、一般的Activity组件需要分别实现不同的监听器接口 public class Ma

14、in extends Activity implements OnItemSelectedListener, OnItemClickListenerOnItemSelectedListener,: onItemSelected()方法OnItemClickListener: onItemClick()方法,4.1:视图组件(Views),可以单选和多选的ListView( ch05_choicelistview ) 基本的使用方式和前面的例子一致,只需使用相应的布局文件即可实现: simple_list_item_multiple_choice: checkbox复选框形式 simple_li

15、st_item_checked:checkbox复选框形式 simple_list_item_single_choice:radiobutton形式单选与多选的设置: setChoiceMode(ListView.CHOICE_MODE_MULTIPLE):多选 setChoiceMode(ListView.CHOICE_MODE_SINGLE):单选ArrayAdapter aaCheckBoxAdapter = new ArrayAdapter(this, android.R.layout.simple_list_item_multiple_choice, data);,4.1:视图组件(

16、Views),动态添加、删除ListView列表项( ch05_dynamiclistview ) 1、编写自定义的adapter对象,一般extends BaseAdapter private class ViewAdapter extends BaseAdapter 重要方法介绍: View getView():Listview在显示某一个列表项时会调用此方法,返回需要显示的列表项的view对象。注意:该方法的调用是根据当前屏幕上可见或即将显示的列表项来调用。 getCount():返回当前ListView列表总数 notifyDataSetChanged():通知adapter对象数据已

17、经发生变化,并由系统调用getView()方法返回view对象。 因为该类继承BaseAdapter,而BaseAdapter类没有getLayoutInflater()方法,因此必须使用context类的getSystemService方法来获取布局填充器,4.1:视图组件(Views),ListView列表选中项的背景色( ch05_colorlistview ) 有两种方式可以设置颜色: 1、 在xml中,使用android:listSelector 属性进行设置android:listSelector=“drawable/green”2、在代码中,使用setSelector()方法进行

18、设置listView.setSelector(R.drawable.green);,4.1:视图组件(Views),2、常见视图组件: 扩展列表视图(Expandable ListView)扩展列表视图是在列表视图的基础上进行了扩展,其组织形式要比列表视图更加多样化。如图所示:列表项中又嵌套了列表,4.1:视图组件(Views),扩展列表视图(Expandable ListView) Xml定义如下所示:标记使用: 来定义注意:该id的定义,和ListView组件一样,也必须引用系统资源中ID为list组件,否则会报错:,4.1:视图组件(Views),扩展列表视图(Expandable Li

19、stView) 相应的ExpandableListActivity组件:同列表视图必须和列表Activity配套使用一样,扩展列表视图组件也必须和扩展列表Activity组件ExpandableListActivity配套使用。开发者可以直接继承ExpandableListActivity ,然后在该子类中通过列表适配器进行列表视图与数据的绑定。public class ExpandableListViewDemoAct extends ExpandableListActivity /设置数据适配器,绑定数据 setListAdapter(adapter);,4.1:视图组件(Views),扩

20、展列表视图(Expandable ListView) Adapter适配器:提供数据给列表视图进行显示 可以从ExpandableListAdapter类继承 ExpandableListAdapter adapter = new SimpleExpandableListAdapter(this,mGroups,R.layout.group_view,new String Group.KEY1,new int R.id.TXT_GROUP_ITEM , mPeople,R.layout.child_view,new String People.KEY1,People.KEY2,People.K

21、EY3,People.KEY4,People.KEY5,mDetailViewsId); 參考列表视图的適配器的定義規範,4.1:视图组件(Views),扩展列表视图(Expandable ListView) 点选事件响应 通过重载onChildClick ()方法进行回调; 要获取所点击的条目内容,需要通过组位置和子位置联合确定:public boolean onChildClick(ExpandableListView parent, View v,int groupPosition, int childPosition, long id) People people = new People(mPeople.get(groupPosition).get(childPosition);Toast.makeText(this, people.toString(), Toast.LENGTH_LONG).show();,4.1:视图组件(Views),下拉列表组件(Spinner)Spinner组件用于下拉列表,用法和ListView相似,装载数据也需要Adapter对象,4.1:视图组件(Views),下拉列表组件(Spinner) Xml定义如下所示:标记使用: 来定义,

展开阅读全文
相关资源
猜你喜欢
相关搜索

当前位置:首页 > 高等教育 > 大学课件

本站链接:文库   一言   我酷   合作


客服QQ:2549714901微博号:道客多多官方知乎号:道客多多

经营许可证编号: 粤ICP备2021046453号世界地图

道客多多©版权所有2020-2025营业执照举报