滾動新聞視圖，呃~ 其實真正的名稱我也不太清楚，姑且這樣叫吧。希望有大神可以幫忙指正，謝謝！
首先看一下這個demo的視圖：
其中，有三個部分，分別是圖片顯示部分、標題部分和滾動中的點（先這樣稱呼吧
）。
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="185dp" >
<LinearLayout
android:id="@+id/top_news_viewpager"
android:layout_width="fill_parent"
android:layout_height="185dp"
android:orientation="horizontal" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="30dp"
android:layout_alignParentBottom="true"
android:background="#88000000"
android:gravity="center_vertical"
android:orientation="horizontal" >
<TextView
android:id="@+id/top_news_title"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginRight="8dp"
android:layout_weight="1"
android:singleLine="true"
android:text="圖片標題"
android:textColor="#F6F6F6" />
<LinearLayout
android:id="@+id/dots_ll"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="5dp"
android:gravity="center"
android:orientation="horizontal" />
</LinearLayout>
</RelativeLayout>在MianActivity中，對於滾動的視圖，我是從網上找的嗶哩嗶哩的連接---->http://www.bilibili.com/index/slideshow.json;
整理後的json數據如下：
{
"list": [
{
"img": "http://i0.hdslb.com/u_user/c6b4b30c07ddfd9ca039c1113acce585.jpg",
"link": "http://www.bilibili.com/topic/711.html",
"simg": "",
"title": "花式秀恩愛啊"
},
{
"img": "http://i2.hdslb.com/promote/1e3a969ec5f508b2e74c6268f21158bd.jpg",
"link": "http://www.bilibili.com/video/av2412947/",
"simg": "",
"title": "週刊排行榜 #259"
},
{
"img": "http://i0.hdslb.com/promote/e6bbcf75fed8e6d39826c359db72fe5b.jpg",
"link": "http://www.bilibili.com/video/av2412466/?br",
"simg": "",
"title": "獨家正版 雨色可可 10"
},
{
"img": "http://i0.hdslb.com/promote/5bc57e607a459de340f9c832f3040055.jpg",
"link": "http://www.bilibili.com/video/av2412458/?br",
"simg": "",
"title": "亞爾斯蘭戰記 第10話"
},
{
"img": "http://i1.hdslb.com/u_user/c3aa1bf61340aaaefbaef4efeb7e5c00.jpg",
"link": "http://www.bilibili.com/topic/709.html",
"simg": "",
"title": "生日快樂！"
},
{
"img": "http://i0.hdslb.com/u_user/9f295e435aa7b0d32886a034b635a758.jpg",
"link": "http://www.bilibili.com/topic/v2/708.html",
"simg": "",
"title": "啦啦啦！週末啦！"
}
],
"results": 6
}這裏提到一個很好用的json格式化軟件，HiJson，真的很好用（誰用誰知道）。
對於json數據的解析，採用的是Gson來解析的。
而網絡數據的加載是採用xUtils。也是很方便的喲。
MainActivity中的一些初始化就不多說了，下面一段代碼是通過xUtils從網上截取json數據；
<span style="white-space:pre"> </span>HttpUtils httpUtils = new HttpUtils();
httpUtils.send(HttpMethod.GET, url, new RequestCallBack<String>() {
@Override
public void onFailure(HttpException arg0, String arg1) {
// TODO Auto-generated method stub
}
@Override
public void onSuccess(ResponseInfo<String> responseInfo) {
PrecessData(responseInfo.result);
}
});
<span style="white-space:pre"> </span>protected void PrecessData(String result) {
Gson gson = new Gson();
RollViewBean viewBean = gson.fromJson(result, RollViewBean.class);<span style="white-space:pre"> </span>//這裏的viewBean是根據json數據創建的bean類</span>
if (viewBean.list != null) {
// 加載解析出來的數據
for (ItemView item : viewBean.list) {
picUrl.add(item.img);
titleList.add(item.title);
itemList.add(item.link);
}<span style="white-space:pre"> </span>//上面的代碼是對解析出來的數據添加的local變量中，方便使用。</span>
initDot(viewBean.list.size());
// 創建滾動view自定義組件
RollingViewPager pager = new RollingViewPager(this, dotViewList,
itemList, R.drawable.dot_normal, R.drawable.dot_focus);<span style="white-space:pre"> </span> //上面的代碼是創建自定義的滾動視圖組件，並傳入需要的參數</span><span style="white-space:pre"> </span> //參數中，dotViewList的定義是private List<View> dotViewList;這個是對點的View的一個list，下面會貼出代碼。<span style="white-space:pre"> </span>//<span style="font-family: Arial, Helvetica, sans-serif;">itemList是解析json數據是存儲的詳細連接地址。</span></span><span style="white-space:pre"> </span>//R.drawable.dot_normal和R.drawable.dot_focus是兩個圖片，代表圖片展示和非展示狀態是點的圖片（好難解~）
pager.setImageUrl(picUrl);//設置圖片的Url連接
pager.settitle(titleList, title);//設置圖片的連接，並傳入圖片顯示的控件
pager.setDuration(4000);//設置滾動視圖的滾動時間
pager.startRoll();//開始滾動
ll_viewPager.removeAllViews();//清空佈局
ll_viewPager.addView(pager);//將創建的view加載到佈局中
}
}
<span style="white-space:pre"> </span>/**
* 初始化點
*
* @param size
* 點的個數
*/
private void initDot(int size) {
dotViewList = new ArrayList<View>();
ll_dot.removeAllViews();// 清空佈局，保證沒有控件
for (int i = 0; i < size; i++) {
View dotView = new View(this);
// 設置所創建出來view的大小
LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(
CommonUtil.dip2px(this, 6), CommonUtil.dip2px(this, 6));
// 設置各個view的間距
layoutParams.setMargins(5, 0, 5, 0);
// 將設置好的參數添加到view中
dotView.setLayoutParams(layoutParams);
// 設置初始的顯示狀況
if (i == 0) {
dotView.setBackgroundResource(R.drawable.dot_focus);
} else {
dotView.setBackgroundResource(R.drawable.dot_normal);
}
// 將創建的view添加到集合中
dotViewList.add(dotView);
// 將創建的view添加到佈局中顯示
ll_dot.addView(dotView);
}
}好了，MianActivity中大致是這樣了，下面來看看自定義的滾動視圖的代碼
首先，在創建滾動視圖的構造
<span style="white-space:pre"> </span>public RollingViewPager(MainActivity mainActivity, List<View> dotList,
List<String> itemList, int dotNormal, int dotFocus) {
super(mainActivity);
this.ct = mainActivity;
this.dotList = dotList;
this.dotNormal = dotNormal;
this.dotFocus = dotFocus;
this.itemList = itemList; bitmapUtils = new BitmapUtils(ct);
bitmapUtils.configDefaultBitmapConfig(Config.RGB_565);<span style="white-space:pre"> </span>//上面的2行代碼是xUtils中bitmapUtils的簡單創建和初始化配置。</span>
// 創建task
viewPagerTask = new ViewPagerTask();
<span style="white-space:pre"> </span>//這個task的作用是定時去滾動視圖
<span style="white-space:pre"> </span>/**
* 設置圖片url連接
*
* @param picUrl
* 圖片的url
*/
private List<String> picUrl;
public void setImageUrl(List<String> picUrl) {
this.picUrl = picUrl;
}
<span style="white-space:pre"> </span>/**
* 設置標題
*
* @param titleList
* 標題的數據
* @param title
* 標題顯示的組件
*/
private List<String> titleList;
private TextView title;
public void settitle(List<String> titleList, TextView title) {
this.titleList = titleList;
this.title = title;
// 設置顯示第一個標題的數據
if (title != null && titleList != null && titleList.size() > 0) {
title.setText(titleList.get(0));
}
}
<span style="white-space:pre"> </span>/**
* 設置圖片自動跳轉的時間
*
* @param i
*/
private int duration;
public void setDuration(int duration) {
this.duration = duration;
}
<span style="white-space:pre"> </span>/**
* 開始滾動
*/
private boolean hasSetAdater = false;// 判斷是否已經創建adapter
private MyViewPagerAdapter adapter;
private ViewPagerTask viewPagerTask;
public void startRoll() {
if (!hasSetAdater)// 如果沒有創建adapter
{
hasSetAdater = true;
adapter = new MyViewPagerAdapter();
RollingViewPager.this
.setOnPageChangeListener(new MyOnPagerChangeListener());
RollingViewPager.this.setAdapter(adapter);
}
handler.postDelayed(viewPagerTask, duration);
}
/*
* 創建一個handler來控制循環滾動
*/
private Handler handler = new Handler() {
public void handleMessage(android.os.Message msg) {
RollingViewPager.this.setCurrentItem(currentItem);
startRoll();
};
};
/**
* 創建一個task開執行滾動切換操作
*
* @author Administrator
*
*/
private int currentItem = 0;// 當前正在展示的
public class ViewPagerTask implements Runnable {
@Override
public void run() {
currentItem = (currentItem + 1) % dotList.size();
title.setText(titleList.get(currentItem));
handler.obtainMessage().sendToTarget();// 再次調用handle
}
}
<span style="white-space:pre"> </span>public class MyViewPagerAdapter extends PagerAdapter {
@Override
public int getCount() {
// TODO Auto-generated method stub
return picUrl.size();
}
@Override
public boolean isViewFromObject(View arg0, Object arg1) {
// TODO Auto-generated method stub
return arg0 == arg1;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
((ViewPager) container).removeView((View) object);
}
@Override
public Object instantiateItem(ViewGroup container, final int position) {
View view = View.inflate(ct, R.layout.viewpager_item, null);//其中加載的viewpager_item是一個ImageView的佈局。
((ViewPager) container).addView(view);// 將創建的空間添加到container容器中
ImageView image = (ImageView) view.findViewById(R.id.image);
// LogUtils.d("要加載的數據url---->" + picUrl.get(position));
bitmapUtils.display(image, picUrl.get(position));// 下載圖片並顯示顯示到相應的位置
view.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View view) {
// TODO Auto-generated method stub
// LogUtils.d("你點擊了" + itemList.get(position));
Intent intent = new Intent();
intent.putExtra("url", itemList.get(position));
intent.setClass(ct, ItemActivity.class);
ct.startActivity(intent);
}
});<span style="white-space:pre"> </span>//上面的代碼複寫了onClick方法，實現了點擊滾動視圖後跳轉到詳細內容顯示。這部分比較簡單，就不給出代碼了。
return view;
}
}
<span style="white-space:pre"> </span>public class MyOnPagerChangeListener implements OnPageChangeListener {
private int oldposition = 0;
@Override
public void onPageSelected(int position) {
// TODO Auto-generated method stub
currentItem = position;
if (titleList != null) {
title.setText(titleList.get(currentItem));
}
if (dotList != null) {
dotList.get(position).setBackgroundResource(dotFocus);
dotList.get(oldposition).setBackgroundResource(dotNormal);
}
oldposition = currentItem;
}
<span style="white-space:pre"> </span>//在RollingViewPager的構造中傳入點的集合dotList就是爲了聯動。</span>
@Override
public void onPageScrollStateChanged(int arg0) {
// TODO Auto-generated method stub
}
@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
// TODO Auto-generated method stub
}
}如果有需要源代碼的，qq留言。謝謝。