Android仿微信朋友圈查看页面

blog出处：http://blog.csdn.net/allen315410/article/details/40264551

添加权限

图片查看器实现的图片的缩放效果使用的是开源组件PhotoView

地址：https://github.com/chrisbanes/PhotoView

compile 'com.github.chrisbanes:PhotoView:1.3.0'

布局代码

HeckyViewpager

public class HackyViewPager extends ViewPager {  
  
    private static final String TAG = "HackyViewPager";  
  
    public HackyViewPager(Context context) {  
        super(context);  
    }  
  
    public HackyViewPager(Context context, AttributeSet attrs) {  
        super(context, attrs);  
    }  
  
    @Override  
    public boolean onInterceptTouchEvent(MotionEvent ev) {  
        try {  
            return super.onInterceptTouchEvent(ev);  
        } catch (IllegalArgumentException e) {  
            // 不理会  
            Log.e(TAG, "hacky viewpager error1");  
            return false;  
        } catch (ArrayIndexOutOfBoundsException e) {  
            // 不理会  
            Log.e(TAG, "hacky viewpager error2");  
            return false;  
        }  
    }  
  
}  

图片查看器

就是一个activity

/** 
 * 图片查看器 
 */  
public class ImagePagerActivity extends FragmentActivity {  
    private static final String STATE_POSITION = "STATE_POSITION";  
    public static final String EXTRA_IMAGE_INDEX = "image_index";  
    public static final String EXTRA_IMAGE_URLS = "image_urls";  
  
    private HackyViewPager mPager;  
    private int pagerPosition;  
    private TextView indicator;  
  
    @Override  
    public void onCreate(Bundle savedInstanceState) {  
        super.onCreate(savedInstanceState);  
        setContentView(R.layout.image_detail_pager);  
  
        pagerPosition = getIntent().getIntExtra(EXTRA_IMAGE_INDEX, 0);  
        ArrayList urls = getIntent().getStringArrayListExtra(  
                EXTRA_IMAGE_URLS);  
  
        mPager = (HackyViewPager) findViewById(R.id.pager);  
        ImagePagerAdapter mAdapter = new ImagePagerAdapter(  
                getSupportFragmentManager(), urls);  
        mPager.setAdapter(mAdapter);  
        indicator = (TextView) findViewById(R.id.indicator);  
  
        CharSequence text = getString(R.string.viewpager_indicator, 1, mPager  
                .getAdapter().getCount());  
        indicator.setText(text);  
        // 更新下标  
        mPager.setOnPageChangeListener(new OnPageChangeListener() {  
  
            @Override  
            public void onPageScrollStateChanged(int arg0) {  
            }  
  
            @Override  
            public void onPageScrolled(int arg0, float arg1, int arg2) {  
            }  
  
            @Override  
            public void onPageSelected(int arg0) {  
                CharSequence text = getString(R.string.viewpager_indicator,  //  %1$d/%2$d,%1$d表示需要替换的第一个整形内容
                        arg0 + 1, mPager.getAdapter().getCount());  
                indicator.setText(text);  
            }  
  
        });  
        if (savedInstanceState != null) {  
            pagerPosition = savedInstanceState.getInt(STATE_POSITION);  
        }  
  
        mPager.setCurrentItem(pagerPosition);  
    }  
  
    @Override  
    public void onSaveInstanceState(Bundle outState) {  
        outState.putInt(STATE_POSITION, mPager.getCurrentItem());  
    }  
  
    private class ImagePagerAdapter extends FragmentStatePagerAdapter {  
  
        public ArrayList fileList;  
  
        public ImagePagerAdapter(FragmentManager fm, ArrayList fileList) {  
            super(fm);  
            this.fileList = fileList;  
        }  
  
        @Override  
        public int getCount() {  
            return fileList == null ? 0 : fileList.size();  
        }  
  
        @Override  
        public Fragment getItem(int position) {  
            String url = fileList.get(position);  
            return ImageDetailFragment.newInstance(url);  
        }  
  
    }  
}  

图片界面为fragment

图片界面

image_detail_fragment.xml

图片界面代码

/** 
 * 单张图片显示Fragment 
 */  
public class ImageDetailFragment extends Fragment {  
    private String mImageUrl;  
    private ImageView mImageView;  
    private ProgressBar progressBar;  
    private PhotoViewAttacher mAttacher;  
  
    public static ImageDetailFragment newInstance(String imageUrl) {  
        final ImageDetailFragment f = new ImageDetailFragment();  
  
        final Bundle args = new Bundle();  
        args.putString("url", imageUrl);  
        f.setArguments(args);  
  
        return f;  
    }  
  
    @Override  
    public void onCreate(Bundle savedInstanceState) {  
        super.onCreate(savedInstanceState);  
        mImageUrl = getArguments() != null ? getArguments().getString("url")  
                : null;  
    }  
  
    @Override  
    public View onCreateView(LayoutInflater inflater, ViewGroup container,  
            Bundle savedInstanceState) {  
        final View v = inflater.inflate(R.layout.image_detail_fragment,  
                container, false);  
        mImageView = (ImageView) v.findViewById(R.id.image);  
        mAttacher = new PhotoViewAttacher(mImageView);  
  
        mAttacher.setOnPhotoTapListener(new OnPhotoTapListener() {  
  
            @Override  
            public void onPhotoTap(View arg0, float arg1, float arg2) {  
                getActivity().finish();  
            }  
        });  
  
        progressBar = (ProgressBar) v.findViewById(R.id.loading);  
        return v;  
    }  
  
    @Override  
    public void onActivityCreated(Bundle savedInstanceState) {  
        super.onActivityCreated(savedInstanceState);  
  
       Glide.with(this).load(mImageUrl).into(mImageView);//采用Glide框架
    }  
}  

点击实现

ArrayList imageUrls = new ArrayList<>();
//添加数据
......
gridview的布局与初始化省略：
// 点击回帖九宫格，查看大图  
        gridview.setOnItemClickListener(new OnItemClickListener() {  
  
            @Override  
            public void onItemClick(AdapterView parent, View view,  
                    int position, long id) {  
                // TODO Auto-generated method stub  
                imageBrower(position, imageUrls);  
            }  
        });  

imageBrower(int position, ArrayList imageUrls) 如下所示

/** 
     * 打开图片查看器 
     *  
     * @param position 
     * @param urls2 
     */  
    protected void imageBrower(int position, ArrayList urls2) {  
        Intent intent = new Intent(mContext, ImagePagerActivity.class);  
        // 图片url,为了演示这里使用常量，一般从数据库中或网络中获取  
        intent.putExtra(ImagePagerActivity.EXTRA_IMAGE_URLS, urls2);  
        intent.putExtra(ImagePagerActivity.EXTRA_IMAGE_INDEX, position);  
        mContext.startActivity(intent);  
    }