在ListView中显示网络图片

ImageView 类虽然有一个 setImageUri 方法,但不能直接接受一个由网络地址生成的uri作为参数从而显示图片,我们只好使用其 setImageBitmap 方法来转换。

我们来做一个如下的文章列显示:

先声明一个类文章类来初始化数据:

public class ListViewItemData {
private String itemTitle;
private String itemPhoto;
private String itemSummary;
private String itemAuthor;
private String itemPublishtime; public ListViewItemData() {
super();
} public ListViewItemData(String itemTitle, String itemPhoto, String itemSummary, String itemAuthor, String itemPublishtime) {
super();
this.itemTitle = itemTitle;
this.itemPhoto = itemPhoto;
this.itemSummary = itemSummary;
this.itemAuthor = itemAuthor;
this.itemPublishtime = itemPublishtime;
} public String getTitle() {
return this.itemTitle;
} public Bitmap getPhoto() {
String url = this.itemPhoto;
URL myFileUrl = null;
Bitmap bitmap = null;
try {
myFileUrl = new URL(url);
HttpURLConnection conn = (HttpURLConnection) myFileUrl.openConnection();
conn.setDoInput(true);//连接设置获得数据流
conn.connect();
InputStream is = conn.getInputStream();
bitmap = BitmapFactory.decodeStream(is);
is.close();
} catch (IOException e) {
e.printStackTrace();
} return bitmap;
} public String getSummary() {
return this.itemSummary;
} public String getAuthor() {
return this.itemAuthor;
} public String getPublishtime() {
return this.itemPublishtime;
}
}

其中getPhoto方法根据URL用来获得在线图片,返回对应的Bitmap。

制造数据,一般来说是从网络上获得,此处为了方便手工造:

public List<ListViewItemData> getListData() {
List<ListViewItemData> listData = new ArrayList<ListViewItemData>();
listData.add(new ListViewItemData("android异常总结一", "http://pic.cnitblog.com/face/u471123.jpg?id=07112321", "一、场景再现=========================同事甲:搞什么搞,已经两年没参加忘年会了,今年又在这里加班。同事乙:都一样,赶上今天你值夜班,能有什么办法。同事甲:人家忘年会有东西吃,你饿不饿?叫外卖?同事乙:好哦,还是上次那家吧。========================= 二", "烈火残躯", "2014-03-19 22:19"));
listData.add(new ListViewItemData("HTML5 History API实现无刷新跳转", "http://pic.cnitblog.com/face/306530/20140307103012.png", "本篇和大家一起了解一下Windows 8.1 中磁贴的更新,我们来看看如何利用它做出更好的应用磁贴。首先我们从展现形式上来对比一下Windows 8 与 Windows 8.1 中的磁贴:Windows 8支持两种尺寸的磁贴,正方形磁贴(150 * 150 像素)和长方形磁贴(310 * 150 像", "sdsdsds", "2014-03-19 22:19"));
listData.add(new ListViewItemData("c++ 异常处理(1)", "http://pic.cnitblog.com/face/u46305.jpg", "图文化的说明,.net程序员,入职后的发展路线。我将发展路线归为三类。1、技术专精;2、产品策划;3、数据运营。并对每条路线进行了优劣势分析。欢迎各位一起来讨论,不能这么浑浑噩噩的折腾了", "幕后黑手-Boss", "2014-03-19 22:19"));
listData.add(new ListViewItemData("服务器批量管理工具的快速开发", "http://pic.cnitblog.com/face/603528/20140316211142.png", "当我们需要控制一个局域网中的很多台服务器时,一个简单的全局操作可能会被放大地异常繁琐,这时我们就会需要新的工具来帮助我们快速完成这种工作。在本文中,我们在ssh客户端提供的一些工具的基础上完成这一工具的开发,我们的开发平台是GNU/Linux。我们将会开发四个有用的小工具,下面即是我们整个系统的鸟瞰", "东邪独孤", "2014-03-19 22:19"));
listData.add(new ListViewItemData("揭秘uc浏览器一", "http://pic.cnitblog.com/face/440253/20140306132605.png", "首先,看一下项目完成后的,最终效果是这样的:一.主界面二,书签界面三、主界面四.操作对话框界面这几个界面你是否看到了uc浏览器的影子了,其实我说你也可以了,在接下来篇幅中,我将手把手叫大家完成这个浏览器。首先,我们从主界面开始吧,这是一个主线,项目的一些开始由他开始了。从图一中,我们可以看出其布局文", "laozhu1124", "2014-03-19 22:19"));
listData.add(new ListViewItemData("【WPF】制作自定义的列表项面板", "http://pic.cnitblog.com/face/367389/20140226103259.png", "我们在使用像ListBox的列表控件时,我们都知道可以通过其ItemsPanel的依赖项属性来自定义一个面板来放置列表控件中的列表项。除了CLR库提供的几个面板外,我们完全可以把自己写的面板作为项列表的容器。先给各位看看效果。如何?效果还好吧?面板的原理是这样的:1、从Panel类派出一个类,我命名", "东邪独孤2", "2014-03-19 22:19"));
return listData;
}

然后生成SimpleAdapter需要的数据:

public ArrayList<HashMap<String, Object>> getItem() {

        List<ListViewItemData> listData = this.getListData();
ArrayList<HashMap<String, Object>> item = new ArrayList<HashMap<String, Object>>();
for (ListViewItemData data : listData) {
HashMap<String, Object> map = new HashMap<String, Object>();
map.put("itemTitle", data.getTitle());
map.put("itemPhoto", data.getPhoto());
map.put("itemSummary", data.getSummary());
map.put("itemAuthor", data.getAuthor());
map.put("itemPublishtime", data.getPublishtime());
item.add(map);
}
return item;
}

ListView中item布局:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:descendantFocusability="afterDescendants"
android:orientation="vertical" > <!-- 博文题目 --> <TextView
android:id="@+id/viewTitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginTop="5dp"
android:lines="1"
android:textColor="#0000FF"
android:textStyle="bold" />
<!-- 作者头像和博文概要 --> <LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginTop="2dp"
android:orientation="horizontal" > <ImageView
android:id="@+id/imgPhoto"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="2dp"
android:src="@drawable/ic_launcher"
/> <TextView
android:id="@+id/viewSummary"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="2dp"
android:lines="3" />
</LinearLayout>
<!-- 作者昵称和发布日期 --> <LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="2dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="2dp"
android:orientation="horizontal" > <TextView
android:id="@+id/viewAuthor"
android:layout_width="80dp"
android:layout_height="wrap_content"
android:textColor="#0000FF" /> <TextView
android:id="@+id/viewPublishtime"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout> </LinearLayout>

还需要一个ListView,此处我用了一个list_separator_line图片来分隔上下行:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" > <ListView
android:id="@+id/listView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:divider="@drawable/list_separator_line" /> </LinearLayout>

在SimpleAdapter中需要一个数据源,用来存储数据的,在显示图片时我们要用HashMap<>存储一个Bitmap;但仅存取了Bitmap时在ListView中是无法显示图片的,我们需要对SimpleAdapter进行处理 。

如下是对SimpleAdaptr处理的主要代码
 
simpleAdapter.setViewBinder(new ViewBinder() {

            @Override
public boolean setViewValue(View view, Object data, String textRepresentation) {
// 判断是否为我们要处理的对象
if (view instanceof ImageView && data instanceof Bitmap) {
ImageView iv = (ImageView) view;
iv.setImageBitmap((Bitmap) data);
return true;
} else
return false; }
});

然后给ListView绑定,MainActivity完整代码:

package com.example.androidlistview;

import java.io.IOException;
import java.io.InputStream;
import java.net.HttpURLConnection;
import java.net.MalformedURLException;
import java.net.URL;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map; import android.R.integer;
import android.R.string;
import android.os.Bundle;
import android.app.Activity;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.view.Menu;
import android.view.View;
import android.widget.ImageView;
import android.widget.ListView;
import android.widget.SimpleAdapter;
import android.widget.SimpleAdapter.ViewBinder; public class MainActivity extends Activity { private ListView listView; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main); listView = (ListView) this.findViewById(R.id.listView);
// 创建简单适配器SimpleAdapter
SimpleAdapter simpleAdapter = new SimpleAdapter(this, this.getItem(), R.layout.listview_item, new String[] { "itemTitle", "itemPhoto", "itemSummary", "itemAuthor", "itemPublishtime" }, new int[] { R.id.viewTitle, R.id.imgPhoto, R.id.viewSummary, R.id.viewAuthor, R.id.viewPublishtime });
simpleAdapter.setViewBinder(new ViewBinder() { @Override
public boolean setViewValue(View view, Object data, String textRepresentation) {
// 判断是否为我们要处理的对象
if (view instanceof ImageView && data instanceof Bitmap) {
ImageView iv = (ImageView) view;
iv.setImageBitmap((Bitmap) data);
return true;
} else
return false; }
});
// 加载SimpleAdapter到ListView中
listView.setAdapter(simpleAdapter);

  

      // 添加点击事件
      listView.setOnItemClickListener(new OnItemClickListener() {

      @Override
      public void onItemClick(AdapterView<?> arg0, View arg1, int arg2, long arg3) {
      // 获得选中项的HashMap对象
      HashMap<String, Object> map = (HashMap<String, Object>) listView.getItemAtPosition(arg2);
      String title = map.get("itemTitle").toString();
      String content = map.get("itemAuthor").toString();
      Toast.makeText(getApplicationContext(), "你选择了第" + arg2 + "个Item,itemTitle的值是:" + title + "itemAuthor的值是:" + content, Toast.LENGTH_SHORT).show();
      }

      });

    }

    /**
* @return
*/
public ArrayList<HashMap<String, Object>> getItem() { List<ListViewItemData> listData = this.getListData();
ArrayList<HashMap<String, Object>> item = new ArrayList<HashMap<String, Object>>();
for (ListViewItemData data : listData) {
HashMap<String, Object> map = new HashMap<String, Object>();
map.put("itemTitle", data.getTitle());
map.put("itemPhoto", data.getPhoto());
map.put("itemSummary", data.getSummary());
map.put("itemAuthor", data.getAuthor());
map.put("itemPublishtime", data.getPublishtime());
item.add(map);
}
return item;
} public List<ListViewItemData> getListData() {
List<ListViewItemData> listData = new ArrayList<ListViewItemData>();
listData.add(new ListViewItemData("android异常总结一", "http://pic.cnitblog.com/face/u471123.jpg?id=07112321", "一、场景再现=========================同事甲:搞什么搞,已经两年没参加忘年会了,今年又在这里加班。同事乙:都一样,赶上今天你值夜班,能有什么办法。同事甲:人家忘年会有东西吃,你饿不饿?叫外卖?同事乙:好哦,还是上次那家吧。========================= 二", "烈火残躯", "2014-03-19 22:19"));
listData.add(new ListViewItemData("HTML5 History API实现无刷新跳转", "http://pic.cnitblog.com/face/306530/20140307103012.png", "本篇和大家一起了解一下Windows 8.1 中磁贴的更新,我们来看看如何利用它做出更好的应用磁贴。首先我们从展现形式上来对比一下Windows 8 与 Windows 8.1 中的磁贴:Windows 8支持两种尺寸的磁贴,正方形磁贴(150 * 150 像素)和长方形磁贴(310 * 150 像", "sdsdsds", "2014-03-19 22:19"));
listData.add(new ListViewItemData("c++ 异常处理(1)", "http://pic.cnitblog.com/face/u46305.jpg", "图文化的说明,.net程序员,入职后的发展路线。我将发展路线归为三类。1、技术专精;2、产品策划;3、数据运营。并对每条路线进行了优劣势分析。欢迎各位一起来讨论,不能这么浑浑噩噩的折腾了", "幕后黑手-Boss", "2014-03-19 22:19"));
listData.add(new ListViewItemData("服务器批量管理工具的快速开发", "http://pic.cnitblog.com/face/603528/20140316211142.png", "当我们需要控制一个局域网中的很多台服务器时,一个简单的全局操作可能会被放大地异常繁琐,这时我们就会需要新的工具来帮助我们快速完成这种工作。在本文中,我们在ssh客户端提供的一些工具的基础上完成这一工具的开发,我们的开发平台是GNU/Linux。我们将会开发四个有用的小工具,下面即是我们整个系统的鸟瞰", "东邪独孤", "2014-03-19 22:19"));
listData.add(new ListViewItemData("揭秘uc浏览器一", "http://pic.cnitblog.com/face/440253/20140306132605.png", "首先,看一下项目完成后的,最终效果是这样的:一.主界面二,书签界面三、主界面四.操作对话框界面这几个界面你是否看到了uc浏览器的影子了,其实我说你也可以了,在接下来篇幅中,我将手把手叫大家完成这个浏览器。首先,我们从主界面开始吧,这是一个主线,项目的一些开始由他开始了。从图一中,我们可以看出其布局文", "laozhu1124", "2014-03-19 22:19"));
listData.add(new ListViewItemData("【WPF】制作自定义的列表项面板", "http://pic.cnitblog.com/face/367389/20140226103259.png", "我们在使用像ListBox的列表控件时,我们都知道可以通过其ItemsPanel的依赖项属性来自定义一个面板来放置列表控件中的列表项。除了CLR库提供的几个面板外,我们完全可以把自己写的面板作为项列表的容器。先给各位看看效果。如何?效果还好吧?面板的原理是这样的:1、从Panel类派出一个类,我命名", "东邪独孤2", "2014-03-19 22:19"));
return listData;
} @Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
} }

以上就是一般的对于网络图片绑定ListView处理方式,好一点的处理方式是定制扩展一个SimpleAdapter专用来处理图片绑定。

注意:此例是显示网络图片 要记得添加权限,否则报错:java.net.SocketException: Permission denied
<uses-permission android:name="android.permission.INTERNET">

列表视图(ListView和ListActivity)的更多相关文章

  1. Android 自学之列表视图ListView和ListActivity

    ListView是手机系统中使用非常广泛的一种组件,它以垂直列表的形式显示所有列表项. 创建ListView有两种方式: 直接使用ListView创建. 让Activity继承ListActivity ...

  2. android学习--视图列表(ListView和ListActivity)

    说明: 视图列表(ListView和ListActivity)与AutoComplete.Spinner类似,它们都须要一个供显示的列表项,能够须要借助于内容Adapter提供显示列表项 创建List ...

  3. React-Native基础_5.列表视图ListView

    列表视图ListView 用来显示垂直滚动列表,需要指定两个东西,1 数据的来源 dataSource,2 渲染列表的条目布局 rendRow 'use strict' import React, { ...

  4. Android——列表视图(ListView)

    列表视图是android中最常用的一种视图组件,它以垂直列表的形式列出需要显示的列表项.在android中有两种方法向屏幕中添加列表视图:一种是直接使用ListView组件创建:另外一种是让Activ ...

  5. 滚动视图、列表视图[ListView、SimpleAdapter类]

    滚动视图 <ScrollView android: layout_width="fill_parent" android: layout_height="fill_ ...

  6. andorid 列表视图 ListView 之BaseAdapter

    .xml <?xml version="1.0" encoding="utf-8"?> <ListView xmlns:android=&qu ...

  7. Android列表视图ListView和ListActivity-android学习之旅(二十四)

    ListView简介 ListView是android中常用的一种控件,创建ListView有两种方式: 1.在xml中使用ListView控件创建. 2.使用activity继承ListActivi ...

  8. andorid 列表视图 ListView 之ArrayAdapter

    activity_ui3.xml <?xml version="1.0" encoding="utf-8"?> <ListView xmlns ...

  9. Android——列表视图 ListView(三)BaseAdapter

    activity_activitybase.xml <?xml version="1.0" encoding="utf-8"?> <ListV ...

随机推荐

  1. iOS应用内跳转系统设置相关界面的方法

    在iOS开发中,有时会有跳转系统设置界面的需求,例如提示用户打开蓝牙或者WIFI,提醒用户打开推送或者位置权限等.在iOS6之后,第三方应用需要跳转系统设置界面,需要在URL type中添加一个pre ...

  2. mongoDB研究笔记:分片集群部署

    前面几篇文章的分析复制集解决了数据库的备份与自动故障转移,但是围绕数据库的业务中当前还有两个方面的问题变得越来越重要.一是海量数据如何存储?二是如何高效的读写海量数据?尽管复制集也可以实现读写分析,如 ...

  3. Linux修改环境变量的方法

    在Linux操作系统中,有时候跟着教程安装了一些软件,安装成功后,很高兴的准备运行该软件相应命令,但是偶尔会遇到”Command not found…“的提示.原因是因为你安装的软件需要设置环境变量才 ...

  4. 浅谈Excel开发:八 Excel 项目的安装部署

    前面几篇文章讲解了Excel开发的几个比较主要的也是比较重要的方面,比如菜单系统,Excel对象模型,自定义函数,RTD函数,异步自定义函数,用户自定义任务面板等,在实际开发中我们还会遇到各种“千奇百 ...

  5. 将整数转换成二进制的java小程序

    首先我们知道,将整数转换成二进制是将整数除二取余将最后除得的数和得到的余数从下向上写,组成得到的二进制数. java程序实现如下: public class ChangeToErjinzhi { pu ...

  6. C#将dll打包到程序中

    最近比较懒,加上内容也不多就懒得排版了,字放大了,看起来应该方便一点 直接进入主题 先来看一个栗子,假设现在有一个第三方dll namespace TestLibrary1 { public clas ...

  7. ASP.NET中一种超简单的Ajax解决方案

    为什么是Ajax2? 因为之前有一个blqw.Ajax,并且已经在项目中投入使用了,但是没有这个方便,这个是后来才弄的,为了纪念第一版的blqw.Ajax,所以这个就2了... 话说看了评论才发现,原 ...

  8. servlet到底是什么?

    Servlet(Server Applet),全称Java Servlet,是用Java编写的服务器端程序.指任何实现了这个Servlet接口的类或者实现Servlet接口的类,当然或者实现接口继承方 ...

  9. DDD~基础设施层~续

    回到目录 在之前写的DDD~基础设施层文章中,提到了UnitOfWork,它里面有一些方法,但经过项目证明,不应该有Save和IsExplicitSubmit,而这个工作单元只起到了数据上下文统一的作 ...

  10. 大叔也说Xamarin~Android篇~原生登陆与WebView的网站如何共享Session

    回到目录 事情是这样的,我们最近开了一个APP,主要使用xamarin做了一个登陆,它与服务器API进行数据通讯,当用户名密码正确去,跳转到新的activity,并在webview控件中打开服务端的H ...