侧边栏的实现是将从网络获取的json数据解析之后,在侧边栏slidingmenu上显示一个ListView,分别显示新闻,专题,组图,互动四个侧边选项。在点击四个侧边选项时,在新闻中心主页面上分别更新四个专题内容。
实现效果:
布局准备:
在MainActivity利用FragmentManager,将LeftMenuFragment类代替R.id.lf_menu
transactions.replace(R.id.lf_menu,new LeftMenuFragment(),"FRAGMENT_LEFT_MENU");
第一步:实现slidingMenu侧边栏四个选项的信息拉取和显示
侧边栏布局文件:
<?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="match_parent"
android:background="#000"
>
<ListView
android:id="@+id/lv_list"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="40dp"
android:dividerHeight="0dp"
android:listSelector="@android:color/transparent"
></ListView>
</RelativeLayout>
获取网络数据之后,使用setMenuData进行参数设置:
//设置leftMenu网络数据,将传来的数据放入全局变量mMenuList中
public void setMenuData(NewsData Data)
{
System.out.println("侧边栏拿到数据啦"+Data);
mMenuList=Data.data;
mAdapter=new MenuAdapter();
lvList.setAdapter(mAdapter);
}
并使用适配器显示ListView:
//用于显示ListView的Adapter
class MenuAdapter extends BaseAdapter{
@Override
public int getCount() { //得到当前数组大小
// TODO Auto-generated method stub
return mMenuList.size();
}
@Override
public NewsMenuData getItem(int position) { //方便我们拿到当前对象的函数
// TODO Auto-generated method stub
return mMenuList.get(position);
}
@Override
public long getItemId(int position) {//一般用于拿去当前对象下标
// TODO Auto-generated method stub
return position;
}
//@SuppressLint("ViewHolder")
/*
* 由于这个函数是在每一次重建的时候调用,所以只需得到当前的布局对象view以及头标题tvTitle即可 *
*/
@Override
public View getView(int position, View convertView, ViewGroup parent) {
View view = View.inflate(mActivity, R.layout.list_menu_item, null);
TextView tvTitle = (TextView) view.findViewById(R.id.tv_title);//获得TextView 目的是动态的改变View的数据
//System.out.println("getView : "+position+"!!!");
NewsMenuData newmenudata=mMenuList.get(position); //得到当前对象
tvTitle.setText(newmenudata.title); //设置侧边栏标题
/*
* 采用enable的方式设置样式,选中为全红,其他为白色
*/
if(mCurrentpos==position)
{
tvTitle.setEnabled(true);
}
else
{
tvTitle.setEnabled(false);
}
return view;
}
}
第二步:实现菜单详情页-组图,互动,详情等
由于在主页面框架搭建时,对于ViewPager的页面填充时,是一个带背景的TextView和Fragment
所以页面详情页只需要对Fragment进行替换即可实现页面的内部切换。
实现思路:由于共有5个页面详情,所以先建立一个基类BaseMenuDetailPager,然后在子类(NewsMenuDetailPager)中进行数据更新,最后只需要在NewsCenterPager(新闻主页面)中获得flcontent( Fragment ),添加相应的子类(NewsMenuDetailPager)即可。
页面详情的基类:
/*
* 菜单详情页
*/
public abstract class BaseMenuDetailPager {
public Activity mActivity;
public View mRootView;//根布局对象
/*
* 构造函数
*/
public BaseMenuDetailPager(Activity mActivity) {
this.mActivity = mActivity;
mRootView=initView();
}
/*
* 初始化界面
*/
public abstract View initView();
/*
* 初始化数据
*/
public void initData(){
}
}
对于基类的编写,在这里定义了两个成员变量:
Activity类型的mActivity以及view类型的mRootView,最大好处是,使用mActivity可以方便的获得当前主Activity,进行后期的调用,mRootView在进行后期的编写时,能方便的拿到当前布局的所有控件,从而不需要在子类中再次调用。
/*
* 菜单详情页-新闻
*/
public class NewsMenuDetailPager extends BaseMenuDetailPager{
public NewsMenuDetailPager(Activity mActivity) {
super(mActivity);
// TODO Auto-generated constructor stub
}
@Override
public View initView() {
TextView text=new TextView(mActivity);
text.setText("菜单详情页-新闻");
text.setTextColor(Color.RED);
text.setTextSize(25);
text.setGravity(Gravity.CENTER);
return text;
}
}
private ArrayList<BaseMenuDetailPager> mPagers;
在NewsCenterPager(新闻页签类)中,进行Fragment替换:
BaseMenuDetailPager pager = mPagers.get(position);//获取当前要显示的菜单详情页
flcontent.removeAllViews();//清除之前的布局
flcontent.addView(pager.mRootView);//将菜单详情页添加到Fragment中
另附完整的新闻页签代码:
package com.example.zhihuibj.basepager;
import java.util.ArrayList;
import com.example.zhihuibj.MainActivity;
import com.example.zhihuibj.R;
import com.example.zhihuibj.BaseMenuDetailPager.BaseMenuDetailPager;
import com.example.zhihuibj.BaseMenuDetailPager.InteractMenuDetailPager;
import com.example.zhihuibj.BaseMenuDetailPager.NewsMenuDetailPager;
import com.example.zhihuibj.BaseMenuDetailPager.PhotoMenuDetailPager;
import com.example.zhihuibj.BaseMenuDetailPager.TopicMenuDetailPager;
import com.example.zhihuibj.domain.NewsData;
import com.example.zhihuibj.fragment.LeftMenuFragment;
import com.example.zhihuibj.global.GlobalContants;
import com.google.gson.Gson;
import com.jeremyfeinstein.slidingmenu.lib.SlidingMenu;
import com.lidroid.xutils.HttpUtils;
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 android.R.color;
import android.app.Activity;
import android.graphics.Color;
import android.provider.ContactsContract.Data;
import android.view.Gravity;
import android.view.View;
import android.widget.TextView;
import android.widget.Toast;
/*
* 新闻
*/
public class NewsCenterPager extends BasePager{
private ArrayList<BaseMenuDetailPager> mPagers;
private NewsData Data1;
public NewsCenterPager(Activity activity) {
super(activity);
// TODO Auto-generated constructor stub
}
@Override
public void initData() {
System.out.println("新闻界面初始化....");
tvTitle.setText("新闻");
setSlidingMenuEnable(true);
//向flcontent动态加载数据
// TextView text=new TextView(mAcitivty);
// text.setText("新闻中心");
// text.setTextColor(Color.RED);
// text.setTextSize(25);
// text.setGravity(Gravity.CENTER);
// flcontent.addView(text);//获得
GetDataFromService();
}
/*
* 获取网络数据
*/
private void GetDataFromService() {
HttpUtils utils=new HttpUtils();
utils.send(HttpMethod.GET, GlobalContants.CATEGORIES_URL,
new RequestCallBack<String>() {
@Override
public void onSuccess(ResponseInfo<String> responseInfo) {
String result= responseInfo.result;
System.out.println("返回结果"+result);
parseData(result);
}
@Override
public void onFailure(HttpException error, String msg) {
Toast.makeText(mAcitivty, msg, Toast.LENGTH_SHORT).show();
error.printStackTrace();
System.out.println("解析错误!!!");
}
});
}
/*
* 解析网络数据
*/
protected void parseData(String result) {
Gson gson =new Gson();
Data1 = gson.fromJson(result, NewsData.class);//直接填入类名
System.out.println("解析结果"+Data1);
//刷新侧边栏数据
MainActivity MainUi =(MainActivity)mAcitivty;//获取主页面MainActivity类,MainActivity经过多次传递,调用时需要显示的转换一下
LeftMenuFragment leftmenufragment = MainUi.getleftMenuFragment();//获取侧边栏LeftFragment
leftmenufragment.setMenuData(Data1);//将数据传递到NewsCenterPager的数据设置函数set
//准备4个菜单详情页
mPagers = new ArrayList<BaseMenuDetailPager>();
mPagers.add(new NewsMenuDetailPager(mAcitivty));
mPagers.add(new InteractMenuDetailPager(mAcitivty));
mPagers.add(new PhotoMenuDetailPager(mAcitivty));
mPagers.add(new TopicMenuDetailPager(mAcitivty));
SetCurrentDetailPager(0);//将当前页面设置为第一页面-新闻为默认
}
/*
* 设置当前菜单详情页
* mRootViewBasePager是base_pager经过inflata过来的View对象
* 正确简单的处理方式是在基类basepager中进行inflate之后,将所有的相关控件声明为全局变量
* 这样在子类可直接调用控件,不需要再次findviewById了
* tvtitle.setText()即可,tvTitle在基类中已经拿到被声明成全局变量了
*/
public void SetCurrentDetailPager(int position)
{
BaseMenuDetailPager pager = mPagers.get(position);//获取当前要显示的菜单详情页
flcontent.removeAllViews();//清除之前的布局
flcontent.addView(pager.mRootView);//将菜单详情页添加到Fragment中
TextView title1 = (TextView)mRootViewBasePager.findViewById(R.id.tv_title);
//得到数据
//System.out.println(Data1.data.get(position).title);
title1.setText(Data1.data.get(position).title+"");
}
}