项目实战①―高仿知乎日报（2）―>使用pullrefesh+Slidingmenu+自定义组件写主布局2
栏目：综合技术时间：2014-12-14 08:36:51
在这1篇开头我要感谢我的老师李卫民同志，没有他这个东西做不出来，有了他这个Demo逼近真实的XX日报
现在清晨了，似乎大脑更加清晰了，有助于我清算下思路，继续写完我的博客，上1节讲完了，Slidingmenu的内容填充，既然将内容填充好了，似乎要加点乐子，那就是listview的点击事件。
① listview的点击事件处理
本来以为首页的数据和 其他页面的数据是1样的也就是我想用1个Fragment将所有的数据都写在里面 ，看来是不可能的了。我先不写主布局的Fragment 由于里面藏着1个自定义的1个类，先写其他页面的数据可以从易到难渐渐来
/* -------------------- ListView点击事件 -------------------- */
@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
// 关闭侧滑菜单
menu.toggle();
if (position == 0) { // 进入首页
initView();
} else {
// 填充Fragment
ThemeOther other = theme.getOthers().get(position);
cTitle.setTitle(other.getName());
FragmentTransaction fragmentTransaction = getSupportFragmentManager().beginTransaction();
fragmentTransaction.replace(R.id.fl_content, ContentFragment.newInstance(other.getId(), other.getDescription(), other.getImage()));
fragmentTransaction.commit();
}
}
是否是1目了然，和我说的1样，主要了 在Fragment里面 传值不要用构造方法 的bundle 这样会使Fragment 很多东西不能实现 要改1种方式 newInstance
②Fragment的代码实现
对Fragment 最1开始感觉挺不适应他的，由于总是和Viewpage1起出现，然后本来1个1个出现比较简单，1起出现我就懵了，后面越用用方便，最后发现其实 activity用的愈来愈少了......................它的生命周期很重要......
1取得从activity传来的数据
public static ContentFragment newInstance(long id, String description, String image) {
ContentFragment f = new ContentFragment();
Bundle args = new Bundle();
args.putLong("id", id);
args.putString("description", description);
args.putString("image", image);
f.setArguments(args);
return f;
}
2 在 Oncreate 里面将数据准备好
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
id = getArguments().getLong("id");
description = getArguments().getString("description");
image = getArguments().getString("image");
mQueue = Volley.newRequestQueue(getActivity());
}
2 在OncreateView里面初始化界面
固然首先要在里面填充1个布局罗，其实你看下Activity的源码 其实setContentView是和Fragment的 inflate 是相差不大的
View view = inflater.inflate(R.layout.fragment_content, container, false);
我给大家看看布局吧 免得下面的界面命名看不懂 <?xml version="1.0" encoding="utf⑻"?>
<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" >
<ScrollView
android:id="@+id/sv_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:ignore="UselessLeaf,UselessParent" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="200dp"
tools:ignore="UselessLeaf,UselessParent" >
<com.android.volley.toolbox.NetworkImageView
android:id="@+id/img_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
tools:ignore="ContentDescription" />
<TextView
android:id="@+id/tx_desc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginTop="10dp"
android:padding="10dp"
android:textColor="#FFFFFF"
android:textSize="18sp" />
</RelativeLayout>
<com.qf.teach.project.zhihudaily.custom.CustomListViewForScrollView
android:id="@+id/lv_theme"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:divider="#EEEEEE"
android:dividerHeight="5dp"
android:padding="10dp" />
</LinearLayout>
</ScrollView>
</LinearLayout>
里面有1个自定的listview 目的是解决和ScrollView抢焦点的问题
package com.qf.teach.project.zhihudaily.custom;
import android.content.Context;
import android.util.AttributeSet;
import android.widget.ListView;
public class CustomListViewForScrollView extends ListView {
public CustomListViewForScrollView(Context context) {
super(context);
}
public CustomListViewForScrollView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public CustomListViewForScrollView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
int expandSpec = MeasureSpec.makeMeasureSpec(Integer.MAX_VALUE >> 2, MeasureSpec.AT_MOST);
super.onMeasure(widthMeasureSpec, expandSpec);
}
}
回到java 代码....................
/**初始化界面
* @param view
*/
private void initView(View view) {
//设置广告页标题
txDesc = (TextView) view.findViewById(R.id.tx_desc);
txDesc.setText(description);
//设置广告页的图片
imgContent = (NetworkImageView) view.findViewById(R.id.img_content);
imgContent.setImageUrl(image, new ImageLoader(mQueue, new BitmapCache()));
adapter = new MyBaseAdapter();
//自定义listview
lvTheme = (CustomListViewForScrollView) view.findViewById(R.id.lv_theme);
lvTheme.setOnItemClickListener(this);
lvTheme.setAdapter(adapter);
svContent = (ScrollView) view.findViewById(R.id.sv_content);
}
3初始化数据―利用volly联网得到json
/**
* 初始化数据
*/
private void initData() {
mQueue.add(new JsonObjectRequest(Method.GET, String.format(API.getTheme(), id), null, this, null));
}
我们先看看json结构吧 相信大家json解析都会 我就不叙述了
/* -------------------- 网络要求 -------------------- */
@Override
public void onResponse(JSONObject response) {
try {
themeStory = new ThemeStory();
themeStory.setDescription(response.getString("description"));
themeStory.setBackground(response.getString("background"));
themeStory.setImage(response.getString("image"));
themeStory.setColor(response.getInt("color"));
themeStory.setImage_source(response.getString("image_source"));
themeStory.setName(response.getString("name"));
// 解析stories
JSONArray arrayStories = response.getJSONArray("stories");
if (arrayStories != null && arrayStories.length() > 0) {
List<Story> stories = new ArrayList<Story>();
for (int i = 0 ; i < arrayStories.length() ; i++) {
JSONObject obj = arrayStories.getJSONObject(i);
Story story = new Story();
story.setType(obj.getInt("type"));
story.setId(obj.getLong("id"));
story.setShare_url(obj.getString("share_url"));
story.setTitle(obj.getString("title"));
if (obj.has("multipic")) {
story.setMultipic(obj.getBoolean("multipic"));
}
// 图片数组
if (obj.has("images")) {
JSONArray array = obj.getJSONArray("images");
if (array != null && array.length() > 0) {
String[] images = new String[array.length()];
for (int x = 0 ; x < array.length() ; x++) {
images[x] = array.getString(x);
}
story.setImages(images);
}
}
stories.add(story);
}
themeStory.setStories(stories);
}
// 解析editors
JSONArray arrayEditors = response.getJSONArray("editors");
if (arrayEditors != null && arrayEditors.length() > 0) {
List<Editor> editors = new ArrayList<Editor>();
for (int i = 0 ; i < arrayEditors.length() ; i++) {
JSONObject obj = arrayEditors.getJSONObject(i);
Editor editor = new Editor();
editor.setAvatar(obj.getString("avatar"));
editor.setId(obj.getLong("id"));
editor.setName(obj.getString("name"));
editors.add(editor);
}
themeStory.setEditors(editors);
}
// 由于斟酌到 URl会变所以我们通知数据产生改变
adapter.notifyDataSetChanged();
//解决1开始进来不在最上面的问题
svContent.smoothScrollTo(0, 0);
} catch (JSONException e) {
e.printStackTrace();
}
}
4 填充adapter里面的数据
没啥好说的 看代码吧
/* -------------------- 网络要求 -------------------- */
class MyBaseAdapter extends BaseAdapter {
private ViewHolder viewHolder;
@Override
public int getCount() {
return themeStory == null ? 0 : themeStory.getStories().size();
}
@Override
public Object getItem(int position) {
return themeStory.getStories().get(position);
}
@Override
public long getItemId(int position) {
return position;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
if (convertView == null) {
convertView = LayoutInflater.from(getActivity()).inflate(R.layout.list_theme_news, parent, false);
viewHolder = new ViewHolder();
viewHolder.txTitle = (TextView) convertView.findViewById(R.id.tx_title);
viewHolder.imgThumb = (NetworkImageView) convertView.findViewById(R.id.img_thumb);
convertView.setTag(viewHolder);
} else {
viewHolder = (ViewHolder) convertView.getTag();
}
Story story = themeStory.getStories().get(position);
viewHolder.txTitle.setText(story.getTitle());
viewHolder.imgThumb.setVisibility(View.GONE);
if (story.getImages() != null && story.getImages().length > 0) {
viewHolder.imgThumb.setImageUrl(story.getImages()[0], new ImageLoader(mQueue, new BitmapCache()));
viewHolder.imgThumb.setVisibility(View.VISIBLE);
}
return convertView;
}
class ViewHolder {
public TextView txTitle;
public NetworkImageView imgThumb;
}
}
------分隔线----------------------------
------分隔线----------------------------