在Android Gridview中显示复合项目

Question

我想显示一个元素的网格，每个元素由一个包含在TextView顶部的ImageView的RelativeLayout组成。

我已经看到someone else问同样的问题，我已经采用了the proposed solution;无论如何，在这个解决方案中，getView()函数只返回一个ImageView项目，而不是TextView。我试图返回一个自定义项目，它扩展了RelativeLayout，但我无法看到Gridview中的元素。如果点击它们，我仍然会得到Toast消息（请参阅下面的侦听器代码），但只有Gridview的（灰色）背景可以在屏幕上看到。

如果我仅通过ImageView或TextView，正如上面的解决方案中所建议的那样，我仍然可以看到单个项目。所以我的问题是如何管理getView在自定义View中返回两个项目。

这里是我到目前为止的代码：

活动类：

List<String> mItemsImage; 
List<String> mItemsText; 

@Override 
public void onCreate(Bundle savedInstanceState){ 
    super.onCreate(savedInstanceState); 
    setContentView(R.layout.mylayout); 

    mItemsImage = new ArrayList<String>(); 
    mItemsText = new ArrayList<String>(); 

    mGridView = (GridView) findViewById(R.id.mygridview); 

    fillArraylists(); 

    mGridView.setAdapter(new CustomItemAdapter(this, mItemsImage, mItemsText)); 

    mGridView.setOnItemClickListener(new OnItemClickListener() { 
     public void onItemClick(AdapterView<?> parent, View v, int position, long id) { 
      Toast.makeText(MyActivity.this, "text is + "mItemsText.get(position), Toast.LENGTH_SHORT).show(); 
     } 
    }); 
} 

适配器类：

class CustomItemAdapter extends BaseAdapter{ 
    private Context mContext; 
    private List<String> mImageList; 
    private List<String> mTextList; 

    public CustomItemAdapter(Context c, List<String> imageList, List<String> textList) { 
     mContext = c; 
     mImageList = imageList; 
     mTextList = textList; 
    } 

    @Override 
    public View getView(int position, View convertView, ViewGroup parent) { 
     CustomItem item; 

     if (convertView == null) { // if it's not recycled, initialize some attributes 
      item = new CustomItem(mContext, mImageList.get(position), mTextList.get(position)); 
      item.findViewById(R.id.grid_item);//Tried to add this line in a second moment, but it didn't work anyway 
      item.setLayoutParams(new GridView.LayoutParams(parent.getWidth() >> 2, parent.getHeight() >> 2)); 
     } else { 
      item = (CustomItem) convertView; 
     } 
     return item; 
     //if I do 'return item.image' or 'return item.text' I can see the View on screen normally 
    } 
} 

定制项目类：

class CustomItem extends RelativeLayout{ 
    public ImageView image; 
    public TextView text; 

    public CustomItem(Context ctx, String imagepath, String description){ 
     super(ctx); 

     image = new ImageView(ctx); 
     image.findViewById(R.id.grid_item_image); 
     image.setScaleType(ImageView.ScaleType.CENTER_CROP); 
     image.setPadding(8, 8, 8, 8); 
     image.setImageBitmap(BitmapFactory.decodeFile(imagepath)); 

     text = new TextView(ctx); 
     text.findViewById(R.id.grid_item_text); 
     text.setPadding(8, 0, 8, 0); 
     text.setText(description); 
    } 
} 

mylayout.xml：

... 

<GridView 
    android:id="@+id/mygridview" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:background="@drawable/background_lightgrey_rect" 
    android:gravity="center" 
    android:numColumns="2" 
    android:stretchMode="columnWidth" > 
</GridView> 

grid_item.xml：

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:id="@+id/grid_item" > 

    <ImageView 
     android:id="@+id/grid_item_image" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentLeft="true" 
     android:layout_alignParentTop="true" 
     android:src="@drawable/default_image" 
     android:contentDescription="@string/image_not_found" /> 

    <TextView 
     android:id="@+id/grid_item_text" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_below="@+id/grid_item_image" 
     android:layout_centerHorizontal="true" 
     android:text="@string/image_not_found" 
     android:textAppearance="?android:attr/textAppearanceMedium" /> 
</RelativeLayout> 

Answer 1

好吧，我发现 - 解决方案 - 的一部分。

此基础上this，我编辑的getView方法如下：

@Override 
public View getView(int position, View convertView, ViewGroup parent) { 
    RelativeLayout item; 

    if (convertView == null) { // if it's not recycled, initialize some attributes 
     LayoutInflater inflater = (LayoutInflater) mContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE); 

     item = (RelativeLayout) inflater.inflate(R.layout.grid_item, null, true); 
     ImageView image = (ImageView) item.findViewById(R.id.grid_item_image); 
     image.setScaleType(ImageView.ScaleType.CENTER_CROP); 
     image.setImageBitmap(BitmapFactory.decodeFile(mImageList.get(position))); 

     TextView text = (TextView) item.findViewById(R.id.grid_item_text); 
     text.setText(mTextList.get(position)); 
     item.setLayoutParams(new GridView.LayoutParams(parent.getWidth() >> 2, parent.getHeight() >> 2)); 

    } else { 
     item = (RelativeLayout) convertView; 
    } 

    return item; 
} 

我不再需要定制项目类。

grid_item.xml现在是：

<ImageView 
    android:id="@+id/grid_item_image" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_above="@+id/grid_item_text" 
    android:layout_alignParentLeft="true" 
    android:layout_alignParentTop="true" 
    android:contentDescription="@string/image_not_found" 
    android:src="@drawable/default_image" /> 

<TextView 
    android:id="@+id/grid_item_text" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_alignParentBottom="true" 
    android:layout_centerHorizontal="true" 
    android:text="@string/image_not_found" 
    android:textAppearance="?android:attr/textAppearanceLarge" /> 

（我仍然有GridView的一些可视化问题，虽然第一个元素是失踪了，我可以过去的方式滚动的第二个元素以上）。