下方的标题使用TextView显示,监听滑动事件,当页面被选中的时候,加载相应的title,圆点是使用ViewPagerIndicator实现,
tab_detail_pager.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="200dp"
>
<!-- banner图,继承处理以后的ViewPager,防止父类拦截 -->
<com.ldw.news.view.TopNewsViewPager
android:id="@+id/vp_news"
android:layout_width="match_parent"
android:layout_height="200dp"
/>
<!-- 下方的页签和文本 -->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:padding="5dp"
android:background="#a000"
>
<TextView
android:id="@+id/tv_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#ffffff"
android:textSize="16sp"
android:text=""
/>
<!-- 使用viewpagerindicator实现小圆点 -->
<com.viewpagerindicator.CirclePageIndicator
android:id="@+id/indicator"
android:padding="10dip"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_width="wrap_content"
app:radius="4dp"
app:fillColor="#FF0000"
app:pageColor="@android:color/darker_gray"
app:strokeWidth="2dp"
/>
</RelativeLayout>
</RelativeLayout>
<!-- 下面的新闻条目 -->
<ListView
android:id="@+id/lv_list"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
></ListView>
</LinearLayout>
逻辑文件TabDetailPager.java,加载数据监听滑动事件
package com.ldw.news.base;
import java.util.ArrayList;
import android.app.Activity;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.ImageView.ScaleType;
import android.widget.TextView;
import android.widget.Toast;
import com.google.gson.Gson;
import com.ldw.news.R;
import com.ldw.news.domain.NewsData.NewsTabData;
import com.ldw.news.domain.TabData;
import com.ldw.news.domain.TabData.TopNewsData;
import com.ldw.news.global.ClobalContants;
import com.lidroid.xutils.BitmapUtils;
import com.lidroid.xutils.HttpUtils;
import com.lidroid.xutils.ViewUtils;
import com.lidroid.xutils.exception.HttpException;
import com.lidroid.xutils.http.ResponseInfo;
import com.lidroid.xutils.http.callback.RequestCallBack;
import com.lidroid.xutils.http.client.HttpRequest.HttpMethod;
import com.lidroid.xutils.view.annotation.ViewInject;
import com.viewpagerindicator.CirclePageIndicator;
/*
* 左边菜单栏右边详情页,最上面对应的tab,页签
*/
public class TabDetailPager extends BaseMenuDetailPager implements OnPageChangeListener{
//携带数据详情的数据
private NewsTabData mTabData;
private TextView text;
private String mUrl;
private TabData mTabDetailData;
@ViewInject(R.id.vp_news)
private ViewPager mViewPager;
@ViewInject(R.id.tv_title)
private TextView tv_title;//banner的标题
@ViewInject(R.id.indicator)
private CirclePageIndicator indicator;//banner下面的小圆点
private ArrayList<TopNewsData> mTopNewsList;//banner的数据
public TabDetailPager(Activity activity, NewsTabData newsTabData) {
super(activity);
mTabData = newsTabData;
//图片的地址
mUrl = ClobalContants.SERVER_URL + mTabData.url;
}
@Override
public View initView() {
View view = View.inflate(mActivity, R.layout.tab_detail_pager, null);
ViewUtils.inject(this, view);
//监听Viewager的滑动
mViewPager.setOnPageChangeListener(this);
// 向FrameLayout中动态添加布局
return view;
}
@Override
public void initData(){
getDataFromServer();
}
/*
* 获取网络数据
*/
private void getDataFromServer() {
//从服务器中获取数据
HttpUtils utils = new HttpUtils();
utils.send(HttpMethod.GET, mUrl, new RequestCallBack<String>(){
@Override
public void onSuccess(ResponseInfo<String> responseInfo) {
//获取到返回的结果
String result = (String) responseInfo.result;
System.out.println("tab详情返回结果:" + result);
parseData(result);
}
@Override
public void onFailure(HttpException error, String msg) {
Toast.makeText(mActivity, msg, Toast.LENGTH_SHORT)
.show();
//打印错误信息
error.printStackTrace();
}
});
}
/*
* 解析网络数据
*/
protected void parseData(String result) {
//使用Gson解析
Gson gson = new Gson();
mTabDetailData = gson.fromJson(result, TabData.class);
System.out.println("解析结果:" + mTabDetailData);
mTopNewsList = mTabDetailData.data.topnews;
mViewPager.setAdapter(new TopNewsAdapter());
//banner下面的小圆点,需要在adapter初始化以后才能显示
indicator.setViewPager(mViewPager);
indicator.setSnap(true);//支持快照显示
indicator.setOnPageChangeListener(this);//添加监听,修改文本内容
indicator.onPageSelected(0);//默认选择第一个,防止图片和远点不对应
//解析数据的时候初始化标题
tv_title.setText(mTopNewsList.get(0).title);
}
/*
* 头条新闻,banner
*/
class TopNewsAdapter extends PagerAdapter{
private BitmapUtils utils;
//构造函数
public TopNewsAdapter(){
utils = new BitmapUtils(mActivity);
//加载数据过程中,设置默认加载的图片
utils.configDefaultLoadingImage(R.drawable.topnews_item_default);
}
@Override
public int getCount() {
// TODO Auto-generated method stub
return mTabDetailData.data.topnews.size();
}
@Override
public boolean isViewFromObject(View view, Object object) {
// TODO Auto-generated method stub
return view == object;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
//初始化banner图
ImageView image = new ImageView(mActivity);
//填充布局对象
//image.setImageResource(R.drawable.topnews_item_default);
//填充平铺布局,基于控件的大小
image.setScaleType(ScaleType.FIT_XY);
//获取到图片资源的数据的地址
TopNewsData topNewsData = mTabDetailData.data.topnews.get(position);
utils.display(image, topNewsData.topimage);
//添加image数据
container.addView(image);
return image;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View) object);
}
}
@Override
public void onPageScrolled(int position, float positionOffset,
int positionOffsetPixels) {
// TODO Auto-generated method stub
}
//滑动的监听,当页面被选中的时候更新标题
@Override
public void onPageSelected(int position) {
//TopNewsData topNewsData= mTabDetailData.data.topnews.get(position);
tv_title.setText(mTopNewsList.get(position).title);
}
@Override
public void onPageScrollStateChanged(int state) {
// TODO Auto-generated method stub
}
}