总结一下最近做的一个项目首页,也是众多APP常见的首页效果:自动滚动的头图&ListView展示具体信息,效果大概类似于知乎日报的首页
写了一个简单的demo,没有仔细去设计布局,仅实现了类似的效果,并加上了google提倡的material design的下拉刷新风格,项目用到了以下几个著名的开源库:
1,图片加载库:imageloader
2,头图的小圆点:androidViewPagerIndicatorlibrary
3,下拉刷新控件:ultra-pullToRefreshlistview
【实现】
思路:总布局是一个ptr-listview,头图通过listview的setHeader设置,如果有分页加载,则加载更多的view通过listview的setFooter实现。头图是一个viewpager,自动滚动通过一个无限循环的handler实现。
【实现效果】
【代码结构】
【核心代码】
-1:主Activity
package com.baozou.headerviewtest;
import android.content.Intent;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.util.DisplayMetrics;
import android.view.GestureDetector;
import android.view.LayoutInflater;
import android.view.MotionEvent;
import android.view.View;
import android.widget.ListView;
import android.widget.RelativeLayout;
import com.viewpagerindicator.CirclePageIndicator;
import java.util.ArrayList;
import java.util.List;
import in.srain.cube.views.ptr.PtrFrameLayout;
import in.srain.cube.views.ptr.PtrHandler;
import in.srain.cube.views.ptr.header.MaterialHeader;
public class MainActivity extends AppCompatActivity {
private HeaderPagerAdapter headerPagerAdapter;
private ViewPager viewPager;
List<News> newsList = new ArrayList<News>();
private GestureDetector mTapGestureDetector;
public static final int MSG_PAGER = 0x01;
public static final long TICK = 5000;
private final PagerTimerHandler mPagerTimerHandler = new PagerTimerHandler();
private CirclePageIndicator mTopPageIndicator;
//下拉刷新组件
private PtrFrameLayout mPtrFrameLayout;
private NewsAdapter newsAdapter;
private ListView mListView;
//头部view
private View mHeaderView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.ptr_listview);
setNews();
setView();
}
private void setNews() {
for (int i = 0; i < 3; i++) {
News news = new News();
news.setTitle("第" + i + "个");
news.setUrl("http://img5.duitang.com/uploads/blog/201407/17/20140717113117_mUssJ.thumb.jpeg");
newsList.add(news);
}
}
/**
* 初始化下拉刷新相关的
*/
private void initPtrViews() {
// header
final MaterialHeader header = new MaterialHeader(this);
int[] colors = getResources().getIntArray(R.array.google_colors);
header.setColorSchemeColors(colors);
header.setLayoutParams(new PtrFrameLayout.LayoutParams(-1, -2));
header.setPadding(0, DisplayUtils.dpToPixel(this, 15), 0, DisplayUtils.dpToPixel(this, 10));
header.setPtrFrameLayout(mPtrFrameLayout);
mPtrFrameLayout.setLoadingMinTime(1000);
mPtrFrameLayout.setPinContent(true);
mPtrFrameLayout.setDurationToCloseHeader(100);
mPtrFrameLayout.setHeaderView(header);
mPtrFrameLayout.addPtrUIHandler(header);
mPtrFrameLayout.setPtrHandler(new PtrHandler() {
@Override
public boolean checkCanDoRefresh(PtrFrameLayout frame, View content, View header) {
return true;
}
@Override
public void onRefreshBegin(PtrFrameLayout frame) {
//刷新操作
}