使用Viewpager制作图片阅读器（3）-读取本地图片
前2篇都是从资源文件里面的直接读取出来的，现在实现读取本地SDcard里面的图片：
源码修改
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initViews();
findData();
}
布局文件为简单的ListView：
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ListView
android:id="@+id/list"
android:layout_width="match_parent"
android:layout_height="wrap_content">
</ListView>
</RelativeLayout>重点是findData()这个函数，不废话直接上代码：
/**
* 找到本地的所有的图片
*/
@SuppressLint("InlinedApi")
private void findData() {
mImageLoader = new ImageLoader();
Cursor c = getContentResolver().query(DataConfig.PHOTO_URI, null, null, null, null);
if (null != c && c.moveToFirst()){
do{
MyPhoto myPhoto = new MyPhoto();
String path = c.getString(c.getColumnIndex(MediaStore.Images.Media.DATA));
if (!TextUtils.isEmpty(path)){
myPhoto.setPath(path);
}
String displayName = c.getString(c.getColumnIndex(MediaStore.Images.Media.DISPLAY_NAME));
if (!TextUtils.isEmpty(displayName)){
myPhoto.setDisplayName(displayName);
}
String type = c.getString(c.getColumnIndex(MediaStore.Images.Media.MIME_TYPE));
if (!TextUtils.isEmpty(type)){
myPhoto.setType(type);
}
String title = c.getString(c.getColumnIndex(MediaStore.Images.Media.TITLE));
if (!TextUtils.isEmpty(title)){
myPhoto.setTitle(title);
}
int size = c.getInt(c.getColumnIndex(MediaStore.Images.Media.SIZE));
if (size > 0){
myPhoto.setSize(size);
}
int width = c.getInt(c.getColumnIndex(MediaStore.Images.Media.WIDTH));
if (width > 0){
myPhoto.setWidth(width);
}
int height = c.getInt(c.getColumnIndex(MediaStore.Images.Media.HEIGHT));
if (height > 0){
myPhoto.setHeight(height);
}
DataConfig.myArrayList.add(myPhoto);
}while(c.moveToNext());
}
}
代码的类型MyPhoto是自定义的类，表示一张图片的我们所要知道的相关信息，
新建一个model的包名，养成一个习惯，把一个东西的对应着实实在在的东西的类（现实事物的抽象）都放在这里面
public class MyPhoto {
private String path;
private String displayName;
private String type;
private String title;
private int size;
private int width;
private int height;
public String getPath() {
return path;
}
public void setPath(String path) {
this.path = path;
}
public String getDisplayName() {
return displayName;
}
public void setDisplayName(String displayName) {
this.displayName = displayName;
}
public String getType() {
return type;
}
public void setType(String type) {
this.type = type;
}
public String getTitle() {
return title;
}
public void setTitle(String title) {
this.title = title;
}
public int getSize() {
return size;
}
public void setSize(int size) {
this.size = size;
}
public int getWidth() {
return width;
}
public void setWidth(int width) {
this.width = width;
}
public int getHeight() {
return height;
}
public void setHeight(int height) {
this.height = height;
}
@Override
public String toString() {
return "MyPhoto [path=" + path + ", displayName=" + displayName + ", type=" + type
+ ", title=" + title + ", size=" + size + ", width=" + width + ", height=" + height
+ "]";
}
}
DataConfig.java 记录一下程序要使用的全局变量
public class DataConfig {
public static Uri PHOTO_URI = MediaStore.Images.Media.EXTERNAL_CONTENT_URI;
public static ArrayList<MyPhoto> myArrayList = new ArrayList<MyPhoto>();
}
在得到所有的图片之后就得要ListView 跟Adapter绑定了
LogUtils.i("myArrayList.size = " + DataConfig.myArrayList.size());
adapter = new MyAllPhotoAdapter(DataConfig.myArrayList, MainActivity.this);
mList.setAdapter(adapter);
adapter = new MyAllPhotoAdapter(DataConfig.myArrayList, MainActivity.this);
mList.setAdapter(adapter);
MyAllPhotoAdapater为自定义的Adapter
public class MyAllPhotoAdapter extends BaseAdapter{
protected static final String TAG = "MyAllPhoteAdapter";
Context mContext = null;
ArrayList<MyPhoto> mList = null;
public MyAllPhotoAdapter(ArrayList<MyPhoto> list , Context context){
mList = list;
mContext = context;
}
@Override
public int getCount() {
return mList.size();
}
@Override
public Object getItem(int arg0) {
return mList.get(arg0);
}
@Override
public long getItemId(int arg0) {
return arg0;
}
ViewHolder mHolder = null;
@Override
public View getView(int position, View view, ViewGroup parent) {
ViewHolder mHolder = null;
if (null == view){
view = LayoutInflater.from(mContext).inflate(R.layout.photo_list, null);
mHolder = new ViewHolder();
mHolder.mImage = (ImageView)view.findViewById(R.id.mImage);
mHolder.mCheckBox = (CheckBox)view.findViewById(R.id.mCheckBox);
mHolder.mText = (TextView)view.findViewById(R.id.mText);
mHolder.mImage.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
LogUtils.i(TAG , "mHolder.mImage is clicked");
}
});
mHolder.mCheckBox.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
LogUtils.i(TAG , "mHolder.mCheckBox is clicked");
}
});
mHolder.mText.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
LogUtils.i(TAG , "mHolder.mText is clicked");
}
});
view.setTag(mHolder);
}else{
mHolder = (ViewHolder)view.getTag();
}
mHolder.mText.setText(mList.get(position).getDisplayName());
// mHolder.mCheckBox.setVisibility(View.GONE);
MyPhotoAsyncTask myPhotoAsyncTask = new MyPhotoAsyncTask(mHolder.mImage);
myPhotoAsyncTask.execute(mList.get(position).getPath());
return view;
}
public class ViewHolder{
public ImageView mImage = null;
public CheckBox mCheckBox = null;
public TextView mText = null;
}
public class MyPhotoAsyncTask extends AsyncTask<String, Void, Bitmap>{
ImageView mImageView = null;
public MyPhotoAsyncTask(ImageView imageView){
mImageView = imageView;
}
@Override
protected Bitmap doInBackground(String... path) {
Bitmap bitmap = ImageLoader.decodeSampledBitmapFromResource(path[0], 90, 90);
return bitmap;
}
@Override
protected void onPostExecute(Bitmap bitmap) {
if(null != mImageView && null != bitmap){
mImageView.setImageBitmap(bitmap);
}
}
}
}布局文件
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="100dp"
>
<!-- android:descendantFocusability="blocksDescendants" -->
<ImageView
android:id="@+id/mImage"
android:layout_width="90dp"
android:layout_height="90dp"
android:scaleType="fitXY"
android:src="@drawable/empty_photo"/>
<TextView
android:layout_marginLeft="110dp"
android:id="@+id/mText"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:singleLine="true"
android:layout_centerVertical="true"
android:background="#ff00ff55"
/>
<CheckBox
android:id="@+id/mCheckBox"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginRight="20dp"
android:layout_centerInParent="true"
/>
</RelativeLayout>
这个布局有图片的预览，图片的名字，以及后面的钩钩，这个checkBox为以后使用，现在可以不看，但是加上他它之后，它的父控件就得不带焦点了：
这是有关ListView的Item得不到焦点的问题：
我在getView里面给3个控件 （ImageVIew TextVIew CheckBox都添加了点击的打印事件，这是监听Item里面的个控件的方法，有需要点击处理的可以再里面做）
如果ListView的Item点不到焦点也是说点击Item是得不到任何信息，
增加监听事件：
mList.setOnItemClickListener(new OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> arg0, View view, int position, long arg3) {
LogUtils.i("onItemClick position = " + position；
}
});
public void onItemClick(AdapterView<?> arg0, View view, int position, long arg3) {
LogUtils.i("onItemClick position = " + position；
}
});
不管怎么点击都没有用的，解决方法是让Item的子控件都得不到焦点：
方法1：
给Item的布局文件的每一个的子控件都设置
android:focusable="false"
想ImageView textVIew 本身就默认是false 就可以不设置了
方法2：
Item的布局文件的最外层layout设置
android:descendantFocusability="blocksDescendants" 让子控件得不到焦点的意思
<p><span style="font-family:SimSun;font-size:18px;">属性的值有三种：</span></p><p><span style="font-family:SimSun;font-size:18px;"> beforeDescendants：viewgroup会优先其子类控件而获取到焦点</span></p><p><span style="font-family:SimSun;font-size:18px;"> afterDescendants：viewgroup只有当其子类控件不需要获取焦点时才获取焦点</span></p><p><span style="font-family:SimSun;font-size:18px;"> blocksDescendants：viewgroup会覆盖子类控件而直接获得焦点</span> </p>
接下来就是点击Item事件的响应了，当然是点击Item时（当点击到子控件时是不会有反应的），当然是直接预览显示咯：
mList.setOnItemClickListener(new OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> arg0, View view, int position, long arg3) {
LogUtils.i("onItemClick position = " + position);
Intent it = new Intent(MainActivity.this , DetailActivity.class);
it.putExtra("position", position);
mCurPosition = position;
startActivityForResult(it, REQUEST_DETAIL);
}
});
public void onItemClick(AdapterView<?> arg0, View view, int position, long arg3) {
LogUtils.i("onItemClick position = " + position);
Intent it = new Intent(MainActivity.this , DetailActivity.class);
it.putExtra("position", position);
mCurPosition = position;
startActivityForResult(it, REQUEST_DETAIL);
}
});
把点击的position 传进去，在设置一个响应码，这是当预览完成退出时，是那一个position，那么listView就直接滚动到用户推出的那个position了
在@Override
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
LogUtils.i("requestCode = " + requestCode + "resultCode = " + resultCode + "data = " + data);
if (resultCode == RESULT_OK && requestCode == REQUEST_DETAIL){
if (null != data){
mCurPosition = data.getIntExtra("position", mCurPosition);
LogUtils.i("requestCode = " + requestCode + "resultCode = " + resultCode
+ "mCurPosition = " + mCurPosition);
mList.setSelection(mCurPosition);
}
}
}
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
LogUtils.i("requestCode = " + requestCode + "resultCode = " + resultCode + "data = " + data);
if (resultCode == RESULT_OK && requestCode == REQUEST_DETAIL){
if (null != data){
mCurPosition = data.getIntExtra("position", mCurPosition);
LogUtils.i("requestCode = " + requestCode + "resultCode = " + resultCode
+ "mCurPosition = " + mCurPosition);
mList.setSelection(mCurPosition);
}
}
}
加上打印信息，帮助大家也可以知道相关的信息
然后在看预览的那个Activity了（就是前2节中的那个Activity修改一下代码，修改一下名字而已）
public class DetailActivity extends Activity {
protected static final String TAG = "LocalphotoReader";
ViewPager mViewPager = null;
TextView mTextView = null;
ImageLoader mImageLoader = null;
int mCurPosition = 0;
/** 没有使用decodeSampledBitmapFromResource之前是使用内存是10.203M 13张图片 */
/** 没有使用decodeSampledBitmapFromResource之前是使用内存是30.391M 48张图片 */
/** 没有使用是使用decodeSampledBitmapFromResource(1024,720)内存是24.61M 48张图片 */
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_detail);
Intent it = getIntent();
if (null != it){
mCurPosition = it.getIntExtra("position", mCurPosition);
}
mImageLoader = new ImageLoader();
initViews();
}
protected static final String TAG = "LocalphotoReader";
ViewPager mViewPager = null;
TextView mTextView = null;
ImageLoader mImageLoader = null;
int mCurPosition = 0;
/** 没有使用decodeSampledBitmapFromResource之前是使用内存是10.203M 13张图片 */
/** 没有使用decodeSampledBitmapFromResource之前是使用内存是30.391M 48张图片 */
/** 没有使用是使用decodeSampledBitmapFromResource(1024,720)内存是24.61M 48张图片 */
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_detail);
Intent it = getIntent();
if (null != it){
mCurPosition = it.getIntExtra("position", mCurPosition);
}
mImageLoader = new ImageLoader();
initViews();
}
private void initViews() {
mViewPager = (ViewPager)findViewById(R.id.view_pager);
mViewPager.setAdapter(new ViewPagerAdapter(DetailActivity.this, mImageLoader));
mViewPager.setCurrentItem(mCurPosition);
mViewPager.setOnPageChangeListener(new OnPageChangeListener() {
@Override
public void onPageSelected(int position ) {
LogUtils.i(TAG , "onPageSelected position = " + position);
mTextView.setText( (position % DataConfig.myArrayList.size() + 1) + "/" + DataConfig.myArrayList.size());
mCurPosition = position;
}
@Override
public void onPageScrolled(int position, float arg1, int arg2) {
}
@Override
public void onPageScrollStateChanged(int arg0) {
}
});
// mViewPager.setPageTransformer(true, new ZoomOutPageTransformer()) ;
mViewPager.setPageTransformer(true, new DepthPageTransformer()) ;
mTextView = (TextView)findViewById(R.id.text);
mTextView.setText((mCurPosition + 1) + "/" + DataConfig.myArrayList.size());
}
@Override
protected void onPause() {
super.onPause();
}
@Override
protected void onDestroy() {
super.onDestroy();
}
@Override
public void onBackPressed() {
LogUtils.i(TAG , "onPageSelected setResult ");
Intent intent = new Intent();
intent.putExtra("position", mCurPosition);
setResult(RESULT_OK, intent);
super.onBackPressed();
}
}
mViewPager = (ViewPager)findViewById(R.id.view_pager);
mViewPager.setAdapter(new ViewPagerAdapter(DetailActivity.this, mImageLoader));
mViewPager.setCurrentItem(mCurPosition);
mViewPager.setOnPageChangeListener(new OnPageChangeListener() {
@Override
public void onPageSelected(int position ) {
LogUtils.i(TAG , "onPageSelected position = " + position);
mTextView.setText( (position % DataConfig.myArrayList.size() + 1) + "/" + DataConfig.myArrayList.size());
mCurPosition = position;
}
@Override
public void onPageScrolled(int position, float arg1, int arg2) {
}
@Override
public void onPageScrollStateChanged(int arg0) {
}
});
// mViewPager.setPageTransformer(true, new ZoomOutPageTransformer()) ;
mViewPager.setPageTransformer(true, new DepthPageTransformer()) ;
mTextView = (TextView)findViewById(R.id.text);
mTextView.setText((mCurPosition + 1) + "/" + DataConfig.myArrayList.size());
}
@Override
protected void onPause() {
super.onPause();
}
@Override
protected void onDestroy() {
super.onDestroy();
}
@Override
public void onBackPressed() {
LogUtils.i(TAG , "onPageSelected setResult ");
Intent intent = new Intent();
intent.putExtra("position", mCurPosition);
setResult(RESULT_OK, intent);
super.onBackPressed();
}
}
在原来的基础上增加了一个Back返回的时候，增加一个返回的position见：onBackPressed()
持续更新中...
再次增加点击button查看图片的详细信息，顺便找了一张背景图效果如图：
增加代码部分
修改photo_list.xml 增加一个button
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="100dp"
android:descendantFocusability="blocksDescendants"
>
<!-- android:descendantFocusability="blocksDescendants" -->
<ImageView
android:id="@+id/mImage"
android:layout_width="90dp"
android:layout_height="90dp"
android:scaleType="fitXY"
android:src="@drawable/empty_photo"/>
<TextView
android:layout_marginLeft="110dp"
android:id="@+id/mText"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:singleLine="true"
android:layout_centerVertical="true"
android:background="#ff00ff55"
/>
<CheckBox
android:id="@+id/mCheckBox"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginRight="20dp"
android:focusable="false"
android:layout_centerInParent="true"
/>
<Button
android:id="@+id/mButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginRight="100dp"
android:layout_centerVertical="true"
android:text="详细信息"/>
</RelativeLayout>
在MyAllPhotoAdapter中增加点击处理事件：
mHolder.mButton.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
showDetailInfo(position);
}
});显示一个对话框：
// 显示图片的一些相关信息
private void showDetailInfo(int position) {
MyPhoto photo = mList.get(position);
PhotoDailog mDailog = new PhotoDailog(mContext, R.style.dialog , photo);
mDailog.show();
}关键是 PhotoDialog，源码在下
public class PhotoDailog extends Dialog{
private String path;
private String displayName;
private String type;
private String title;
private int size;
private int width;
private int height;
private Context mContext = null;
private MyPhoto mPhoto;
private ImageView logo = null;
private TextView mTitle = null;
private TextView mPath = null;
private TextView mName = null;
private TextView mSize = null;
private TextView mType = null;
private TextView mWidth = null;
private TextView mHeight = null;
public String getPath() {
return path;
}
public void setPath(String path) {
this.path = path;
LogUtils.i("PhotoDailog setPath " + " mContext = " + mContext + "path = " + path);
if (null != mPath){
LogUtils.i("PhotoDailog setPath " + " mContext = " + mContext + "path = " + path);
mPath.setText(mContext.getString(R.string.path) + path);
}
}
public String getDisplayName() {
return displayName;
}
public void setDisplayName(String displayName) {
LogUtils.i("PhotoDailog setDisplayName " + " mContext = " + mContext + "displayName = " + displayName);
this.displayName = displayName;
if (null != mName){
LogUtils.i("PhotoDailog setDisplayName " + " mContext = " + mContext + "displayName = " + displayName);
mName.setText(mContext.getString(R.string.displayname) + displayName);
}
}
public String getType() {
return type;
}
public void setType(String type) {
LogUtils.i("PhotoDailog setType " + " mContext = " + mContext + "type = " + type);
this.type = type;
if (null != mType){
mType.setText(mContext.getString(R.string.type) + type);
}
}
public String getTitle() {
return title;
}
public void setTitle(String title) {
LogUtils.i("PhotoDailog setTitle " + " mContext = " + mContext + "title = " + title);
this.title = title;
if (null != mTitle){
mTitle.setText(title);
mTitle.setTextColor(Color.RED);
}
}
public int getSize() {
return size;
}
public void setSize(int size) {
this.size = size;
if (null != mSize){
mSize.setText(mContext.getString(R.string.size) + size);
}
}
public int getWidth() {
return width;
}
public void setWidth(int width) {
this.width = width;
if (null != mWidth){
mWidth.setText(mContext.getString(R.string.width) + width);
}
}
public int getHeight() {
return height;
}
public void setHeight(int height) {
this.height = height;
if (null != mHeight){
mHeight.setText(mContext.getString(R.string.height) + height);
}
}
public void setLog(Bitmap log){
if (null != logo){
logo.setImageBitmap(log);
}
}
public PhotoDailog(Context context, int theme, MyPhoto photo) {
super(context, theme);
LogUtils.i("PhotoDailog " + " mContext = " + mContext);
mContext = context;
mPhoto = photo;
}
@Override
protected void onCreate(Bundle savedInstanceState) {
setContentView(R.layout.dialogview1);
LogUtils.i("PhotoDailog " + " onCreate ");
logo = (ImageView)findViewById(R.id.logo);
mTitle = (TextView)findViewById(R.id.dialog_title);
mPath = (TextView)findViewById(R.id.path);
mName = (TextView)findViewById(R.id.dispalyname);
mType = (TextView)findViewById(R.id.type);
mWidth = (TextView)findViewById(R.id.width);
mHeight = (TextView)findViewById(R.id.height);
mSize = (TextView)findViewById(R.id.size);
setLog(ImageLoader.decodeSampledBitmapFromResource(mPhoto.getPath(), 90, 90));
setTitle(mPhoto.getTitle());
setPath(mPhoto.getPath());
setDisplayName(mPhoto.getDisplayName());
setType(mPhoto.getType());
setSize(mPhoto.getSize());
setWidth(mPhoto.getWidth());
setHeight(mPhoto.getHeight());
}
}持续更新中...