Android:漫画APP开发笔记之ListView中图片按屏幕宽度缩放

一、listview

<ListView
android:id="@+id/piclist"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_above="@+id/bottom"
android:layout_marginTop="106dp"
android:divider="#00000000"
android:listSelector="#00000000"
android:scrollbars="none" />

其中，

android:divider="#00000000"

设置列表项的间隔颜色透明，

android:listSelector="#00000000"

设置点击图片时无背景色（透明色，不用系统背景色）

二、piclist_item

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView
android:id="@+id/piclist_item"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:scaleType="fitStart"/>
</RelativeLayout>

三、PicListInfo

package com.cartoon.adapters;

import android.graphics.Bitmap;

public class PicListInfo {
private Bitmap PicUrl;   //图片地址
//下面是上面属性的get和set方法

public Bitmap getPicUrl() {
return PicUrl;
}

public void setPicUrl(Bitmap picUrl) {
PicUrl = picUrl;
}

}

四、PicListAdapter

package com.cartoon.adapters;

import java.util.ArrayList;

import com.cartoon.R;

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.MeasureSpec;
import android.view.ViewGroup;
import android.view.ViewGroup.MarginLayoutParams;
import android.view.WindowManager;
import android.widget.ArrayAdapter;
import android.widget.ImageView;
import android.widget.ListAdapter;
import android.widget.ListView;
import android.widget.RelativeLayout;
import android.widget.TextView;

public class PicListAdapter extends ArrayAdapter<PicListInfo>{

public PicListAdapter(Context context, int textViewResourceId, ArrayList<PicListInfo> objects)
{
super(context, textViewResourceId, objects);
}

@Override
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder holder =null;
View view;
WindowManager wm = (WindowManager) getContext()
.getSystemService(Context.WINDOW_SERVICE);
int width = wm.getDefaultDisplay().getWidth();

if (convertView == null) {
view = LayoutInflater.from(getContext()).inflate(R.layout.piclist_item, null);
<pre name="code" class="java">                //设置图片的尺寸
holder = new ViewHolder();
holder.piclist_item = (ImageView)view.findViewById(R.id.piclist_item);
ViewGroup.LayoutParams margin = new ViewGroup.LayoutParams(holder.piclist_item.getLayoutParams());
   RelativeLayout.LayoutParams layoutParams  = new RelativeLayout.LayoutParams(margin);

layoutParams.height = (int) (width*0.5677);//设置图片的高度

layoutParams.width = width; //设置图片的宽度

layoutParams.setMargins(15, 0, 15, 0);

holder.piclist_item.setLayoutParams(layoutParams);

holder.piclist_item.setScaleType(ImageView.ScaleType.FIT_START); view.setTag(holder);} else {view = convertView;holder = (ViewHolder)convertView.getTag();} final PicListInfo singleoder = getItem(position); if (singleoder != null) {holder.piclist_item.setImageBitmap(singleoder.getPicUrl());
}return view;}public class ViewHolder{public ImageView piclist_item;}}

使用listview+adapter遇到了表项高度的问题，通用的方法只将图片显示在每个表项左边的狭小区域中。而项目要求图片与屏幕等宽、高度按照比例缩放，因此先获取屏幕宽度

WindowManager wm = (WindowManager) getContext()
.getSystemService(Context.WINDOW_SERVICE);

int width = wm.getDefaultDisplay().getWidth();
int height = wm.getDefaultDisplay().getHeight();

再调整图片尺寸，注释已经写的比较清楚：

<pre name="code" class="java">                holder.piclist_item = (ImageView)view.findViewById(R.id.piclist_item);
ViewGroup.LayoutParams margin9 = new ViewGroup.LayoutParams(holder.piclist_item.getLayoutParams());
   RelativeLayout.LayoutParams layoutParams  = new RelativeLayout.LayoutParams(margin);

layoutParams.height = (int) (width*0.5677);//设置图片的高度

layoutParams.width = width; //设置图片的宽度

layoutParams.setMargins(15, 0, 15, 0);//左右边距15.0px，与主框架一致

holder.piclist_item.setLayoutParams(layoutParams);

holder.piclist_item.setScaleType(ImageView.ScaleType.FIT_START); //按比例扩大或缩小到View的宽度，然后置顶显示

view.setTag(holder);

由于已知图片宽高比例，在将宽度按屏幕宽度缩放时，只需将高度乘以对应比例即可。或者通过ScaleType缩放。

附：ScaleType属性

1）CENTER

按图片的原来size 居中显示，当图片长宽超过View的上宽时，则截取图片的居中部分显示

2）CENTER_CROP

按比例扩大图片的size 居中显示，使得图片的长宽的等于或大于View的长宽

3）CENTER_INSIDE

将图片的内容完整居中显示，通过按比例缩小或原来的size使得图片长宽等于或小于view的长宽

4）FIT_CENTER

把图片按比例扩大或缩小到View的宽度，然后居中显示

5）FIT_STAR

把图片按比例扩大或缩小到View的宽度，然后置顶显示

6）FIT_END

把图片按比例扩大或缩小到View的宽度，然后置于底部显示

7）FIT_XY

不按比例缩放图片，目标是把整个图片塞满整个View

如果