带有自定义基础适配器的Android Grid View

Question

我已经开始学习android开发了。我正在制作一个应用程序，其中我想显示电影缩略图（图像视图和文本视图）结合在网格视图布局我已经制作自定义适配器但问题是我无法弄清楚如何一起显示图像视图和文本视图。当我运行应用程序它显示空白的白色屏幕。我已经尝试了很多解决方案，也搜索了很多但我无法弄清楚如何做到这一点，请帮助我。这是我的代码。

    public class ImageAdapter extends BaseAdapter {

    private Context mContext;
    private LayoutInflater inflater;
    public ImageAdapter(Context c) {

        mContext = c;
      //
    }

    @Override
    public int getCount() {
        return mThumbIds.length;
    }

    @Override
    public Object getItem(int i) {
        return null;
    }

    @Override
    public long getItemId(int i) {
        return 0;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup viewGroup) {


        NewHolder holder = null;
        ImageView imageView;

        inflater = (LayoutInflater) mContext.getSystemService( Context.LAYOUT_INFLATER_SERVICE );



        if(convertView==null){
            holder = new NewHolder();

            convertView =inflater.inflate(R.layout.activity_main,viewGroup,false);


            holder.imageView = new ImageView(mContext);
            holder.textView = new TextView(mContext);

            holder.imageView.setLayoutParams(new GridView.LayoutParams(85, 85));
            holder.imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);



         //   holder.textView.setLayoutParams(new GridView.LayoutParams(85, 85));

            convertView.setTag(holder);
            //textView.
           // textView.setText("Hello");
            holder.imageView.setPadding(8, 8, 8, 8);

        }


        else {
            holder = (NewHolder) convertView.getTag();
            //imageView= (ImageView) convertView. ;
            //textView = (TextView) convertView;
        }


//        convertView.
        holder.imageView.setImageResource(mThumbIds[position]);
     //   holder.textView.setText("hello");
        return convertView;



    }



    private Integer[] mThumbIds = {
            R.drawable.sample_2, R.drawable.sample_3,
            R.drawable.sample_4, R.drawable.sample_5,
            R.drawable.sample_6, R.drawable.sample_7,
            R.drawable.sample_0, R.drawable.sample_1,
            R.drawable.sample_2, R.drawable.sample_3,
            R.drawable.sample_4, R.drawable.sample_5,
            R.drawable.sample_6, R.drawable.sample_7,
            R.drawable.sample_0, R.drawable.sample_1,
            R.drawable.sample_2, R.drawable.sample_3,
            R.drawable.sample_4, R.drawable.sample_5,
            R.drawable.sample_6, R.drawable.sample_7
    };

}

主要活动

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        GridView gridview = (GridView) findViewById(R.id.grid_view);
        gridview.setAdapter(new ImageAdapter(this));
     //   setContentView(gridview);

    }

持有人类

public class NewHolder {

        public ImageView imageView;
        public TextView textView;
    }

主Xml布局文件

<?xml version="1.0" encoding="utf-8"?>
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/grid_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:columnWidth="90dp"
    android:numColumns="auto_fit"
    android:verticalSpacing="10dp"
    android:horizontalSpacing="10dp"
    android:stretchMode="columnWidth"
    android:gravity="center"
    />

Answer 1

这是您的问题的解决方案。 您未正确使用适配器。你正在给网格视图＆＃39;使用此行中的适配器。

convertView =inflater.inflate(R.layout.activity_main,viewGroup,false);

那不是你想要做的。您想要制作另一个XML Layout来表示TextView中的每个电影的标题和Imageview中的图像

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
<ImageView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/movieimage"
    android:src="@drawable/moviethumb"/>

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/movie_title"
    android:id="@+id/todo_list_item_bottom_text"
    android:layout_marginTop="10dp"
    android:textSize="12sp"/>
</LinearLayout>

本教程应该对您有所帮助。它是列表视图，但android中的所有适配器都以相同的方式工作。 Adapter Tutorial

我注意到你可以改进的东西。将inflator放在你的convertview == null内。如果没有使用它，那么创建这个对象是没有意义的。

Answer 2

您不应该膨胀适配器中的主要活动布局。相反，您应该在getView()方法中设置要膨胀的单个行的布局。

您需要做的是，您必须为适配器提供要在gridview中设置的数据列表。适配器根据给定的数据（模型）数量对行（网格中的单个项目）进行膨胀，然后您必须将数据分配给该行的各个元素。

所以，我已经纠正了适配器。希望这会有所帮助：

    public class ImageAdapter extends BaseAdapter {

    private Context mContext;
    private LayoutInflater inflater;



    private Integer[] mThumbIds = {
            R.drawable.sample_2, R.drawable.sample_3,
            R.drawable.sample_4, R.drawable.sample_5,
            R.drawable.sample_6, R.drawable.sample_7,
            R.drawable.sample_0, R.drawable.sample_1,
            R.drawable.sample_2, R.drawable.sample_3,
            R.drawable.sample_4, R.drawable.sample_5,
            R.drawable.sample_6, R.drawable.sample_7,
            R.drawable.sample_0, R.drawable.sample_1,
            R.drawable.sample_2, R.drawable.sample_3,
            R.drawable.sample_4, R.drawable.sample_5,
            R.drawable.sample_6, R.drawable.sample_7
    };

    private String mTexts[]={"a","b","d",....,"your texts"};

    public ImageAdapter(Context c) {
        mContext = c;
    }

    @Override
    public int getCount() {
        return mThumbIds.length; // adapter inflates the row according to the count of data given
    }

    @Override
    public Object getItem(int i) {
        return null;
    }

    @Override
    public long getItemId(int i) {
        return mThumbIds.length;// inflates rows according to data given
    }

    @Override
    public View getView(int position, View convertView, ViewGroup viewGroup) {


        NewHolder holder = null;
        ImageView imageView;

        if(convertView==null){//if convert view is null then only inflate the row
            inflater = (LayoutInflater) mContext.getSystemService( Context.LAYOUT_INFLATER_SERVICE );
            convertView = inflater.inflate(R.layout.grid_item_layout,viewGroup,false);

            holder = new NewHolder();

            //find views in item row
            holder.imageView = (ImageView)convertView.findViewById(R.id.imageview_id);
            holder.textView = (ImageView)convertView.findViewById(R.id.textview_id);

            convertView.setTag(holder);
        }
        else { //otherwise get holder from tag
            holder = (NewHolder) convertView.getTag();
        }

        //set data here
        holder.imageView.setImageResource(mThumbIds[position]);
        holder.textView.setText(mTexts[position]);

        return convertView;
    }

    public class NewHolder {
        public ImageView imageView;
        public TextView textView;
    }

}

并且您的 grid_item.xml 应该具有GridView中每个项目的布局，如：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="10dp" >

<ImageView
        android:id="@+id/textview_id"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>

 <TextView android:id="@+id/imageview_id"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
</LinearLayout>

Answer 3

制作您自己的网格项目布局。

<强>布局/ grid_item.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">

    <ImageView
        android:id="@+id/gridItemIV"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <TextView
        android:id="@+id/gridItemTextTV"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Medium Text"
        android:textAppearance="?android:attr/textAppearanceMedium" />
</LinearLayout>

变化：

    if(convertView==null){
        holder = new NewHolder();
        convertView =inflater.inflate(R.layout.grid_item,viewGroup,false);

            holder.imageView = (ImageView)convertView.findViewById(R.id.gridItemIV)
            holder.textView = (TextView)convertView.findViewById(R.id.gridItemTextTV)
     }else {
...