教案模板4-2

Size: px

Start display at page:

Download "教案模板4-2"

模培乐
4 years ago
Views:

1 移动终端开发技术电子教案第三单元 ListView 的功能和用法章节名称 : 第二章软件要美观 UI 开发的点点滴滴所属专业 ( 教研室 ): 计算机软件技术制定人 : 陈媛媛合作人 : 制定时间 : 2018 年 2 月日照职业技术学院

2 单元标题 ListView 的功能和用法单元教学学时在整体设计中的位置 4 课时第 7 次授课班级上课地点一体化教室上课时间周月日第节能力目标知识目标素质目标 1 要求学生掌握 ListView 的教学目标能够熟练使用 ListView 制作简单大方的应用界面使用方法 ; 2 要求学生掌握 ArrayAdapter 的使用方法 ; 3 要求学生掌握使用 1 养成积极主动学习意识 ; 2 养成勤于动手的习惯 ArrayAdapter 创建 ListView 的方法 ; 教学重点难点教学重点 : 使用 ArrayAdapter 创建 ListView 的方法教学难点 : 使用 ArrayAdapter 创建 ListView 的方法教学方法采用反转课堂教学模式, 课前学生学习微课了解知识点, 课上采用教师引导演示, 学生分组练习讨论等教学方法运用多媒体 AndroidStudio 开发环境实训助手教学平台等辅助授课列表的显示需要三个元素 : 课前需掌握的知识点 (1)ListView: 用来展示列表的 View (2) 适配器 (ArrayAdapter): 用来把数据映射到 ListView 上的中介 (3) 数据 : 具体的将被映射的字符串, 图片, 或者基本组件教学任务分解任务一实现简单列表任务二定制 ListView 界面任务三实现 ListView 的点击事件教学总结

3 一情景导入我们知道手机的很多软件如 QQ 聊天记录微信聊天记录及翻阅微博最新消息等都以列表的形式显示信息, 并且允许用户通过手指上下滑动的方式将屏幕外的数据滚动到屏幕内, 同时屏幕上原有的数据则会滚动出屏幕我们也希望做一个类似的界面, 可以显示水果图片水果信息, 并且点击后将水果价格显示出来并且允许用户通过手指上下滑动的方式将屏幕外的数据滚动到屏幕内, 同时屏幕上原有的数据则会滚动出屏幕二知识讲解列表的显示需要三个元素 : (1)ListView 用来展示列表的 View (2) 适配器 (ArrayAdapter) 用来把数据映射到 ListView 上的中介 (3) 数据具体的将被映射的字符串, 图片, 或者基本组件学习资料, 思考问题 : 任务一实现简单列表 1 ListView 的用法 ListView 绝对可以称得上 Android 中最常用的控件之一, 几乎所有的应用程序教学过程都会用到它由于手机屏幕空间比较有限, 能够一次性在屏幕上显示的内容并不多, 当我们的程序中有大量的数据需要展示的时候, 可以借助 ListView 来实现 ListView 允许用户通过手指上下滑动的方式将屏幕外的数据滚动到屏幕内, 同时屏幕上原有的数据则会滚动出屏幕 ListView 需要用到 Adapter 适配器, 因为只有通过 Adapter 才可以把列表中的数据映射到 ListView 中 (1) 常用 xml 属性 android:divider// 在列表条目之间显示的 drawable 或 color android:dividerheight// 用来指定 divider 的高度 android:entries// 构成 ListView 的数组资源的引用对于某些固定的资源, 这个属性提供了比在程序中添加资源更加简便的方式 android:footerdividersenabled// 当设为 false 时,ListView 将不会在各个 footer 之间绘制 divider. 默认为 true android:headerdividersenabled// 当设为 false 时,ListView 将不会在各个 header 之间绘制 divider. 默认为 true (2) 常用方法 : 思考 1 为 ListView 注册监听器 :setonitemclicklistener() 如 : listview.setonitemclicklistener(new AdapterView.OnItemClickListener() public void onitemclick(adapterview<?> adapterview, View view, int i, long l) { Fruit fruit=fruitlist.get(i);

4 Toast.makeText(MainActivity.this,fruit.getName(),Toast.LENGTH_LONG).show(); ); 为 ListView 添加适配器 :setadapter() 如 :FruitAdapter adapter=new FruitAdapter(MainActivity.this,R.layout.fruit_item,fruitList); ListView listview=(listview) findviewbyid(r.id.list_view); listview.setadapter(adapter); 2 ArrayAdatper 的用法 Adapter 是将数据展示在 ListView(GridView) 中的一个接口通过不同的 Adapter, 可以很方便地展示数据, 也可以实现各种自定义的效果了在 Android 日常的开发中, 常用的 Adapter 有如下三种 : (1)ArrayAdapter (2)SimpleAdapter (3)BaseAdapter 思考 2 使用 ArrayAdapter 填充 ListView 步骤 : (1) 定义一个数组来存放 ListView 中 item 的内容 ( 数据源 ); (2) 通过实现 ArrayAdapter 的构造方法创建一个 ArrayAdapter 对象 ; (3) 通过 ListView 的 setadapter(...) 方法绑定 ArrayAdapter 练习题 : 1 以下哪个属性是构成 ListView 的数组资源的引用 () A. android:divider // 在列表条目之间显示的 drawable 或 color B. android:dividerheight // 用来指定 divider 的高度 C. android:entries // 构成 ListView 的数组资源的引用 D. android:id 2 为 ListView 添加适配器的方法为 () A. setonitemclicklistener() ( 为 ListView 注册监听器 ) B. setadapter() C. findviewbyid() D. setemptyview() ( 给 ListView 设置在空数据下显示的默认提示 ) 3 在 Android 日常的开发中, 常用的 Adapter 有 (ABC) A. ArrayAdapter B.SimpleAdapter C. BaseAdapter D. HeaderViewListAdapter 4 ListView 的直接父类是 AbsListView( 正确 )

5 5 ArrayAdapter 继承了 SimpleAdapter( 错误 ) 继承 BaseAdapter 三案例实现任务二定制 ListView 界面任务三 ListView 点击事件 1 主页面 Activity_main.xml, 一个 ListView 组件 2 定义一个实体类 Fruit, 作为 ListView 适配器的适配类型 3 ( 每项有一个图片和文字说明 ) 自定义布局 Fruit_item.xml, 需要 ImageView 和 TextView 4 自定义适配器 FruitAdapter, 继承 ArrayAdapter, 泛型指定为 Fruit 5 修改 MainActivity 中的代码, Activity_main.xml <LinearLayout xmlns:android=" android:layout_height="match_parent" android:layout_width="match_parent"> <ListView android:id="@+id/list_view" android:layout_width="match_parent" android:layout_height="match_parent"> </ListView> </LinearLayout> Fruit_item.xml <LinearLayout xmlns:android=" android:layout_height="match_parent" android:layout_width="match_parent"> <ImageView android:id="@+id/fruit_image" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <TextView android:id="@+id/fruit_name" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:layout_marginleft="10dp"/> </LinearLayout> Fruit.java public class Fruit { private String name; private int imageid; public Fruit(String name,int imageid){

6 this.name=name; this.imageid=imageid; public String getname() { return name; public void setname(string name) { this.name = name; public int getimageid() { return imageid; public void setimageid(int imageid) { this.imageid = imageid; FruitAdapter.java public class FruitAdapter extends ArrayAdapter { private int resourceid; public FruitAdapter(Context context, int resource, List<Fruit> objects) { super(context, resource, objects); resourceid=resource; public View getview(int positon, View convertview, ViewGroup parent){ Fruit fruit= (Fruit) getitem(positon);// 获取当前项的 Fruit 实例 View view = LayoutInflater.from(getContext()).inflate(resourceId,parent,false); ImageView fruitimage=(imageview) view.findviewbyid(r.id.fruit_image); TextView fruitname=(textview) view.findviewbyid(r.id.fruit_name); fruitimage.setimageresource(fruit.getimageid()); fruitname.settext(fruit.getname()); return view; MainActivity.java public class MainActivity extends AppCompatActivity { private List<Fruit> fruitlist=new protected void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.activity_main);

7 initfruits(); FruitAdapter adapter=new FruitAdapter(MainActivity.this,R.layout.fruit_item,fruitList); ListView listview=(listview) findviewbyid(r.id.list_view); listview.setadapter(adapter); // 为 ListView 注册监听器, 效果见案例三, 点击每个项会 Toast 将水果名字显示出来 listview.setonitemclicklistener(new AdapterView.OnItemClickListener() public void onitemclick(adapterview<?> adapterview, View view, int i, long l) { Fruit fruit=fruitlist.get(i); Toast.makeText(MainActivity.this,fruit.getName(),Toast.LENGTH_LONG).sho w(); ); private void initfruits(){ for(int i=0;i<2;i++){ Fruit banana=new Fruit("Banana",R.drawable.banana1); fruitlist.add(banana); Fruit cherry=new Fruit("Cherry",R.drawable.cherry1); fruitlist.add(cherry); Fruit grape=new Fruit("Grape",R.drawable.grape1); fruitlist.add(grape); Fruit mango=new Fruit("Mango",R.drawable.mango1); fruitlist.add(mango); Fruit orange=new Fruit("Orange",R.drawable.orange1); fruitlist.add(orange); Fruit pear=new Fruit("Pear",R.drawable.pear1); fruitlist.add(pear); Fruit pineapple=new Fruit("Pineapple",R.drawable.pineapple1); fruitlist.add(pineapple); Fruit strawberry=new Fruit("Strawberry",R.drawable.strawberry1); fruitlist.add(strawberry); Fruit tomato=new Fruit("Tomato",R.drawable.tomato1); fruitlist.add(tomato);

案例 1 效果图案例 2 效果图案例 3 效果图 public class FruitAdapter extends ArrayAdapter { private int resourceid; public FruitAdapter(Context context, int resource, List<Fruit> objects) { super(context, resource,

8 案例 1 效果图案例 2 效果图案例 3 效果图 public class FruitAdapter extends ArrayAdapter { private int resourceid; public FruitAdapter(Context context, int resource, List<Fruit> objects) { super(context, resource, objects); resourceid=resource; public View getview(int positon, View convertview, ViewGroup parent){ Fruit fruit= (Fruit) getitem(positon);// 获取当前项的 Fruit 实例 // 提升 ListView 的运行效率 View view; ViewHolder viewholder; if(convertview==null){ view=layoutinflater.from(getcontext()).inflate(resourceid,parent,false); viewholder=new ViewHolder(); viewholder.fruitimage=(imageview) view.findviewbyid(r.id.fruit_image); viewholder.fruitname=(textview) view.findviewbyid(r.id.fruit_name); view.settag(viewholder);// 将 ViewHolder 存储在 View 中 else { view=convertview; viewholder=(viewholder) view.gettag();// 重新获取 ViewHolder viewholder.fruitimage.setimageresource(fruit.getimageid()); viewholder.fruitname.settext(fruit.getname()); /* View view = LayoutInflater.from(getContext()).inflate(resourceId,parent,false); ImageView fruitimage=(imageview) view.findviewbyid(r.id.fruit_image);

9 TextView fruitname=(textview) view.findviewbyid(r.id.fruit_name); fruitimage.setimageresource(fruit.getimageid()); fruitname.settext(fruit.getname());*/ return view; class ViewHolder{ ImageView fruitimage; TextView fruitname; 四知识巩固 1 总结知识点, 使用教学平台中的随堂练习题巩固本所学知识 2 使用教学平台中的测试题给学生布置作业拓展作业制作 Android 手机应用市场界面教学后记

主程式 : public class Main3Activity extends AppCompatActivity { ListView listview; // 先整理資料來源,listitem.xml 需要傳入三種資料 : 圖片狗狗名字狗狗生日 // 狗狗圖片 int[] pic =new

ListView 自訂排版主程式 : public class Main3Activity extends AppCompatActivity { ListView listview; // 先整理資料來源,listitem.xml 需要傳入三種資料 : 圖片狗狗名字狗狗生日 // 狗狗圖片 int[] pic =new int[]{r.drawable.dog1, R.drawable.dog2,