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

如果



郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。