网络编程案例简易新闻客户端

本案例主要是通过AsyncHttpClient和SmartImageView两个开源项目来实现。

首先介绍一下两个开源项目的使用方法：

1、AsyncHttpClient的使用

AsyncHttpClient是对HttpClient的再次包装。AsyncHttpClient的特点有，发送异步Http请求、Http请求发生在UI线程之外、内部采用线程池来处理并发请求。使用起来也比HttpClient更加简便。

下载AsyncHttpClient源代码，在http://www.github.com可以下载，这个网站提供了Git服务代码托管，很多开源代码都可以在这里找到。（http://www.github.com/loopj/android-async-http）

将AsyncHttpClient他引入自己的工程中，将下载的源代码解压复制src文件夹下的源代码，然后再粘贴到自己工程目录src下即可。也可下载jar包，将jar文件粘贴在工程目录的libs文件夹下，然后选择Build Path——Add to Build Path.

AsyncHttpClient client = new AsyncHttpClient();

client.get("http://www.google.com", new AsyncHttpResponseHandler() {

@Override

public void onSuccess(String response) {

System.out.println(response);

}

});

2、SmartImageView的用法

SmartImageView主要是加速从网络上加载图片，它继承自ImageView类，支持根据URL地址加载图片、支持异步加载图片、支持图片缓存等。同AsyncHttpClient一样需要下载源代码。（http://www.github.com/loopj/android-smart-image-view）

添加SmartImageView控件，首先在布局文件中添加一个SmartImageView控件，代码如下：

<com.loopj.android.image.SmartImageView

android:id="@+id/my_image" >

</com.loopj.android.image.SmartImageView>

控件使用：得到一个参考布局的SmartImageView:

SmartImageView myimage = (SmartImageView) this.findViewById(R.id.my_image);

从一个URL（网络路径）中加载图片:

myimage.setImageUrl("http://www.xxxxxx.com/xxxximage.jpg");

案例介绍：

1、创建一个应用程序，设计用户交互界面

本界面主要包含提示用户数据正在加载中的ProgressBar、TextView以及用于显示新闻信息

的ListView

布局文件代码如下：

<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"

tools:context=".MainActivity" >

<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >

<LinearLayout
android:id="@+id/loading"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical"
android:visibility="invisible" >

<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="正在加载信息..
4000
." />
</LinearLayout>

<ListView
android:id="@+id/lv_news"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</FrameLayout>

</LinearLayout>

2、创建ListView item布局

本布局使用到了SmartImageView和三个TextViewAndroid：scaleType属性

属于ImageView控件中的，他用来匹配View的大小。

需要ListView item来显示布局内容，代码如下：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="match_parent"

android:layout_height="65dip" >

<com.loopj.android.image.SmartImageView
android:id="@+id/siv_icon"
android:layout_width="80dip"
android:layout_height="60dip"
android:layout_alignParentLeft="true"
android:layout_marginBottom="5dip"
android:layout_marginLeft="5dip"
android:layout_marginTop="5dip"
android:scaleType="centerCrop"
android:src="@drawable/ic_launcher" >
</com.loopj.android.image.SmartImageView>

<TextView
android:id="@+id/tv_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dip"
android:layout_marginTop="10dip"
android:layout_toRightOf="@id/siv_icon"
android:text="我是标题"
android:maxLength="20"
android:singleLine="true"
android:ellipsize="end"
android:textColor="#000000"
android:textSize="18sp" />

<TextView
android:id="@+id/tv_description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/tv_title"
android:layout_marginLeft="5dip"
android:layout_marginTop="5dip"
android:layout_toRightOf="@id/siv_icon"
android:text="我是描述"
android:maxLength="16"
android:singleLine="true"
android:ellipsize="end"
android:textColor="#99000000"
android:textSize="14sp" />

<TextView
android:id="@+id/tv_type"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_marginBottom="5dip"
android:text="评论"
android:textColor="#99000000"
android:textSize="12sp" />

</RelativeLayout>

3、界面交互代码：

使用了ListView的适配器类，SmartImageView加载指定路径的图片。AysncHttpClient获取

服务器上的XML文件。

package cn.itcast.news;

import java.io.ByteArrayInputStream;
import java.util.List;

import android.app.Activity;
import android.graphics.Color;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.LinearLayout;
import android.widget.ListView;
import android.widget.TextView;
import android.widget.Toast;

import cn.itcast.news.bean.NewsInfo;
import cn.itcast.news.utils.NewsInfoService;

import com.loopj.android.http.AsyncHttpClient;
import com.loopj.android.http.AsyncHttpResponseHandler;
import com.loopj.android.image.SmartImageView;

public class MainActivity extends Activity {
private ListView lv_news;
private LinearLayout loading;
private List<NewsInfo> newsInfos;
//ListView适配器
private class NewsAdapter extends BaseAdapter {
//listView的item数
public int getCount() {
return newsInfos.size();
}
//得到listview 条目视图
public View getView(int position, View convertView, ViewGroup parent) {
View view = View.inflate(MainActivity.this, R.layout.news_item,
null);
SmartImageView siv = (SmartImageView) view
.findViewById(R.id.siv_icon);
TextView tv_title = (TextView) view.findViewById(R.id.tv_title);
TextView tv_description = (TextView) view
.findViewById(R.id.tv_description);
TextView tv_type = (TextView) view.findViewById(R.id.tv_type);
NewsInfo newsInfo = newsInfos.get(position);
//SmartImageView加载指定路径图片
siv.setImageUrl(newsInfo.getIconPath(), R.drawable.ic_launcher,
R.drawable.ic_launcher);
//设置新闻标题
tv_title.setText(newsInfo.getTitle());
//设置新闻描述
tv_description.setText(newsInfo.getDescription());
int type = newsInfo.getType(); // 1. 一般新闻 2.专题 3.live
//不同新闻类型设置不同的颜色和不同的内容
switch (type) {
case 1:
tv_type.setText("评论:" + newsInfo.getComment());
break;
case 2:
tv_type.setTextColor(Color.RED);
tv_type.setText("专题");
break;
case 3:
tv_type.setTextColor(Color.BLUE);
tv_type.setText("LIVE");
break;
}
return view;
}
//条目对象
public Object getItem(int position) {
return null;
}
//条目id
public long getItemId(int position) {
return 0;
}
}
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
lv_news = (ListView) findViewById(R.id.lv_news);
loading = (LinearLayout) findViewById(R.id.loading);
fillData2();
}
//使用AsyncHttpClient访问网络
private void fillData2() {
//创建AsyncHttpClient实例
AsyncHttpClient asyncHttpClient = new AsyncHttpClient();
//使用GET方式请求
asyncHttpClient.get(MainActivity.this.getString(R.string.serverurl),
new AsyncHttpResponseHandler() {
public void onSuccess(String content) {
//访问成功
super.onSuccess(content);
//将字符串转换成Byte数组
byte[] bytes = content.getBytes();
//将Byte数组转换成输入流
ByteArrayInputStream bais = new ByteArrayInputStream(
bytes);
//调用NewsInfoService工具类解析xml文件
newsInfos = NewsInfoService.getNewsInfos(bais);
if (newsInfos == null) {
// 解析失败 弹出toast
Toast.makeText(MainActivity.this,
"解析失败", 0).show();
} else {
// 更新界面.
loading.setVisibility(View.INVISIBLE);
lv_news.setAdapter(new NewsAdapter());
}
}
//请求失败
public void onFailure(Throwable error, String content) {
super.onFailure(error, content);
Log.e("error",MainActivity.this.getString(R.string.serverurl));
Log.e("error", error.toString());
Toast.makeText(MainActivity.this, "请求失败", 0).show();
}
});
}
}

4、创建NewsInfos类，

NewsInfos定义了iconPath图片路径、title新闻标题、description新闻描述、type新闻类型

和comment新闻评论数属性。

代码如下:

`package cn.itcast.news.bean;

public class NewsInfo {

private String iconPath;

private String title ;

private String description;

private int type;

private long comment;

public String getIconPath() {

return iconPath;
}
public void setIconPath(String iconPath) {
this.iconPath = iconPath;
}
public String getTitle() {
return title;
}
public void setTitle(String title) {
this.title = title;
}
public String getDescription() {
return description;
}
public void setDescription(String description) {
this.description = description;
}
public int getType() {
return type;
}
public void setType(int type) {
this.type = type;
}
public long getComment() {
return comment;
}
public void setComment(long comment) {
this.comment = comment;
}

}

`

5、工具类解析xml文件

从服务器上获取的是一个xml文件，因此需要使用XmlPulParser对象解析出

xml里面的内容并设置到相应的javaBean中。

代码如下：

package cn.itcast.news.utils;

import java.io.InputStream;
import java.util.ArrayList;
import java.util.List;

import org.xmlpull.v1.XmlPullParser;

import android.util.Xml;
import cn.itcast.news.bean.NewsInfo;

public class NewsInfoService {
//解析服务器返回的xml信息 获取所有新闻数据实体.
public static List<NewsInfo> getNewsInfos(InputStream is) {
//获取XmlPullParser对象
XmlPullParser parser = Xml.newPullParser();
try {
parser.setInput(is, "utf-8");
//获取指针
int type = parser.getEventType();
List<NewsInfo> newsInfos = null;
NewsInfo newsInfo = null;
//type不是文档结束
while (type != XmlPullParser.END_DOCUMENT) {
switch (type) {
case XmlPullParser.START_TAG: //开始标签
//拿到标签名并判断
if ("news".equals(parser.getName())) {
a7af
newsInfos = new ArrayList<NewsInfo>();
} else if ("newsInfo".equals(parser.getName())) {
newsInfo = new NewsInfo();
} else if ("icon".equals(parser.getName())) {
//获取解析器当前指向元素的下一个文本节点的值
String icon = parser.nextText();
newsInfo.setIconPath(icon);
} else if ("title".equals(parser.getName())) {
String title = parser.nextText();
newsInfo.setTitle(title);
} else if ("content".equals(parser.getName())) {
String description = parser.nextText();
newsInfo.setDescription(description);
} else if ("type".equals(parser.getName())) {
String newsType = parser.nextText();
newsInfo.setType(Integer.parseInt(newsType));
} else if ("comment".equals(parser.getName())) {
String comment = parser.nextText();
newsInfo.setComment(Long.parseLong(comment));
}
break;
case XmlPullParser.END_TAG:   //标签结束
if ("newsInfo".equals(parser.getName())) {
newsInfos.add(newsInfo);
newsInfo = null;
}
break;
}
type = parser.next();
}
return newsInfos;
} catch (Exception e) {
e.printStackTrace();
return null;
}
}
}

6、配置服务器界面

需要在服务器上下载一个xml，因此需要开启Tomcat服务器。在Tomcat根

目录下找到bin文件夹，运行该文件夹下的startup.bat文件开启服务器。

然后，在tamacat的安装目录下打开webapps文件夹，将NewsInfos。xml文件

放置在Root文件夹下。

代码如下：

<?xml version="1.0" encoding="UTF-8"?>

<news>

<newsInfo>

<icon>http://172.16.25.13:8080/img/a.jpg</icon>

<title>科技温暖世界</title>

<content>进入一个更有爱的领域</content>

<type>1</type>

<comment>69</comment>

</newsInfo>

<newsInfo>

<icon>http://172.16.25.13:8080/img/b.jpg</icon>

<title>《神武》</title>

<content>新美术资源盘点 视觉新体验</content>

<type>2</type>

<comment>35</comment>

</newsInfo>

<newsInfo>

<icon>http://172.16.25.13:8080/img/c.jpg</icon>

<title>南北车正式公布合并</title>

<content>南北车将于今日正式公布合并</content>

<type>3</type>

<comment>2</comment>

</newsInfo>

<newsInfo>

<icon>http://172.16.25.13:8080/img/d.jpg</icon>

<title>北京拟推医生电子注册</title>

<content>突破多点执业"限制"</content>

<type>1</type>

<comment>25</comment>

</newsInfo>

<newsInfo>

<icon>http://172.16.25.13:8080/img/e.jpg</icon>

<title>风力发电进校园</title>

<content>风力发电普进校园</content>

<type>2</type>

<comment>26</comment>

</newsInfo>

<newsInfo>

<icon>http://172.16.25.13:8080/img/f.jpg</icon>

<title>地球一小时</title>

<content>地球熄灯一小时</content>

<type>1</type>

<comment>23</comment>

</newsInfo>

</news>

运行效果图：



案例所需图片：