gridview与图像和文本android

时间:2012-07-30 08:13:07

标签: android gridview

我成功创建了一个填充了图像的gridview。现在,我想要做的是在图像下方放置一个文本。

这是我的应用程序到目前为止的截图。

http://i203.photobucket.com/albums/aa266/paulocarabuena_bucket/screen-2.png

这是我在imageadapter类中的getView方法..

public View getView(int position, View convertView, ViewGroup parent) {
ImageView imageView;

if (convertView == null) {
    imageView = new ImageView(this.context);
    imageView.setLayoutParams(new GridView.LayoutParams(85, 85));
    imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
    imageView.setPadding(8, 8, 8, 8);
} else {
    imageView = (ImageView) convertView;
}

imageView.setImageResource(this.thumbs[position]);
return imageView;
}

这是我主要活动的onCreate方法

public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    this.launchFullScreen();
    this.setContentView(R.layout.main);

    this.grids = (GridView) this.findViewById(R.id.elements);

    ImageAdapter adapter = new ImageAdapter(this);

    this.grids.setAdapter(adapter);

    this.grids.setOnItemClickListener(new OnItemClickListener() {
        public void onItemClick(AdapterView<?> parent, View v,
                int position, long id) {

        }
    });
}

提前致谢。 :)

5 个答案:

答案 0 :(得分:3)

您应该按照以下方式对视图进行充气,而不是直接使用图像视图:

<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
 android:id="@+id/widget44"android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:orientation="vertical"
 android:layout_x="201px"
 android:layout_y="165px"
 android:gravity="center_horizontal">
<ImageView
   android:id="@+id/icon_image"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content">
</ImageView>
<TextView
   android:id="@+id/icon_text"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:text="TextView"
   android:gravity="center_horizontal"
   android:textColorHighlight="#656565">
</TextView>
</LinearLayout>

你的适配器应该是这样的:

public class ImageAdapter extends BaseAdapter{
    Context mContext;
    public static final int ACTIVITY_CREATE = 10;
    public ImageAdapter(Context c){
        mContext = c;
    }
    @Override
    public int getCount() {
        // TODO Auto-generated method stub
        return 5;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        // TODO Auto-generated method stub
        View v;
        if(convertView==null){
            LayoutInflater li = getLayoutInflater();
            v = li.inflate(R.layout.icon, null);
            TextView tv = (TextView)v.findViewById(R.id.icon_text);
            tv.setText("Profile "+position);
            ImageView iv = (ImageView)v.findViewById(R.id.icon_image);
            iv.setImageResource(R.drawable.icon);

        }
        else
        {
            v = convertView;
        }
        return v;
    }
}

有关详细信息,请查看此帖子Custom Grid View

答案 1 :(得分:2)

您可以使用定义GridView单元格的XML:

来执行此操作

<强> image.xml

<?xml version="1.0" encoding="UTF-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center_horizontal"
    >
    <ImageView
        android:id="@+id/image"
        android:layout_marginBottom = "10dp"
        android:src="@drawable/cell_sfondo"
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content">
    </ImageView>

<TextView
        android:id="@+id/title" 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" 
        android:layout_gravity="center_horizontal"/>

</LinearLayout>

然后在getView()

if(convertView == null) {
            view = inflater.inflate(R.layout.image, null);
        }
        else
            view = convertView;
ImageView image = (ImageView)view.findViewById(R.id.image);
image.setImageResource(this.thumbs[position]);

答案 2 :(得分:2)

Paresh Mayani有一个非常好的简单例子。这对我帮助很大。

http://www.technotalkative.com/android-gridview-example/

答案 3 :(得分:1)

您可以在网格布局的每个单元格中为图像和文本创建布局。我建议从xml中扩展布局。您可以尝试这样做:

//Use a viewHolder to optimize the list
ViewHolder holder = null;

if (convertView == null) {
   //Create a new view holder to optimize the loading of elements in list
   holder = new ViewHolder();

   convertView = LayoutInflater.from(this.context).inflate(R.layout.my_custom_xml,null) ;
   holder.imageView = (ImageView)convertView.findViewByID(R.id.my_image_view);
   holder.textView = (TextView)convertView.findViewByID(R.id.my_text_view);

   convertView.setTag(holder);
} else {
   holder = (ViewHolder)convertView.getTag();
}

//Bind data to the row

//Set the position in holder
holder.position = position;
//Set the image for each row
holder.imageView ...
//Set the text for each row
holder.textView.setText()...


//And the viewholder looks like this

private class ViewHolder{
//The position of this row in list
private int position;

//The image view for each row
private ImageView imageView;

//The textView for each row
private TextView textView;
}

现在你可以简单地创建包含文本和图像视图的my_custom_xml:

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width= "fill_parent"
    android:layout_height = "wrap_content"
    android:orientation= "vertical">
       <ImageView
           android:id = "@+id/my_image_view"
           android:layout_width =  ....
           android:layout_height = ...
       />
      <TextView
          android:id = "@+id/my_text_view"
          android:layout_width = ....
          android:layout_height = ....
       />
</LinearLayout>

答案 4 :(得分:0)

您可以inflate layout在适配器的imageview下使用textview,而不是采用动态图像查看:

if(convertView==null){
            inflater=(LayoutInflater) mContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            holder=new Holder();
            convertView=inflater.inflate(R.layout.gridinflater, null);
            holder.imageView=(ImageView) convertView.findViewById(R.id.img);

            holder.textView=(TextView) convertView.findViewById(R.id.txt);

            convertView.setTag(holder);
        }
        else {
            holder = (Holder) convertView.getTag();
        }

其中gridInflater是在相对布局中的imageview下具有textview作为父级的布局。

public static class Holder {
        public ImageViewProgress imageView;
        public TextView textView;
    }