自定义ListView包含图像,文本和添加项按钮

时间:2017-06-10 18:23:51

标签: java android listview arraylist

我对Android很陌生,无法实现这一目标,一整天都在搜索。

Layout I'm trying to create.

我已经创建了自定义xml布局,我已经找到了在创建时添加项目的方法,但我需要列表为空,而不是按下按钮从列表中添加时。

这是布局:

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">

<TableRow>

<ImageView
android:id="@+id/info_img_view"
android:layout_width="30dp"
        android:layout_height="30dp" />

    <TextView
        android:id="@+id/info_text_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center" />

    <TextView
        android:id="@+id/info_time_text_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:gravity="right"
        />

</TableRow>

我在主要活动中有一个ListView:

<ListView
            android:id="@+id/list_view"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

我该如何解决这个问题?我很感激,如果有人能指出我可以了解代码实际在做什么的资源,而不是我找到的只是复制和粘贴的教程...

谢谢!

编辑,更多地解释我想要实现的目标

我有6个按钮。按下按钮时,它应该添加一个包含两个文本视图的列表项,以及总共三个图像中的一个图像。

因此,例如,如果按下Button1:添加列表项&gt; &#34;发短信&#34; &#34;发短信&#34; &#34; imageTwoOfThree&#34;

比,如果按下Button2:在顶部添加列表项&gt; &#34;文字二&#34; &#34;文字二&#34; &#34; imageTwoOfThree&#34;

依此类推......文字是硬编码的。

2 个答案:

答案 0 :(得分:1)

这里用这个: 我创建了一个带有dummydata的列表,你可以根据你改变文本和图像

首先创建一个类Data:

public class Data {

    private String name,price;
    private int imageId;
    public Data(){}

    public Data(String name,String price,int imageId){
        this.name = name;
        this.price = price;
        this.imageId = imageId;
    }

    public String getPrice() {
        return price;
    }

    public void setPrice(String price) {
        this.price = price;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public int getImageId() {
        return imageId;
    }

    public void setImageId(int imageId) {
        this.imageId = imageId;
    }
}

然后创建一个ListView适配器来处理您的数据:

public class ListViewAdaptor extends RecyclerView.Adapter<ListViewAdaptor.MyViewHolder> {
    private List<Data> mDataList;

    public class MyViewHolder extends RecyclerView.ViewHolder{
        public TextView name,price;
        public ImageView imageView;

        public MyViewHolder(View view){
            super(view);
            name = (TextView) view.findViewById(R.id.name);
            price= (TextView) view.findViewById(R.id.price);
            imageView = (ImageView) view.findViewById(R.id.image);
        }
    }

    public ListViewAdaptor(List<Data> dataList){
        this.mDataList = dataList;
    }


    @Override
    public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View itemView = LayoutInflater.from(parent.getContext())
                .inflate(R.layout.list_view_item, parent, false);

        return new MyViewHolder(itemView);
    }

    @Override
    public void onBindViewHolder(MyViewHolder holder, int position) {
        Data data = mDataList.get(position);
        holder.name.setText(data.getName());
        holder.price.setText(data.getPrice());
        holder.imageView.setImageResource(data.getImageId());
    }

    @Override
    public int getItemCount() {
        return mDataList.size();
    }
}

列表视图项的布局将其命名为list_view_item:

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

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/ic_launcher"
        android:id="@+id/image"
        />

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/name"
        android:text="name"
        android:gravity="center"
        android:textSize="26sp"
        android:layout_weight="1"/>

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/price"
        android:text="price"
        android:gravity="center"
        android:textSize="26sp"
        android:layout_weight="1"/>

</LinearLayout>

然后从您想要添加listView的活动中添加recyclelerView布局:

<android.support.v7.widget.RecyclerView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/recycler_view">

    </android.support.v7.widget.RecyclerView>

然后像这样使用这个rec​​yclerview: //我从我的MainActivity中调用它,你可以在任何你喜欢的活动中使用它

public class MainActivity extends AppCompatActivity {


    private RecyclerView mRecyclerView;
    private ListViewAdaptor mAdapter;
    private List<Data> mDataList = new ArrayList<>();

    private static final String TAG = "MainActivity";
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        mRecyclerView = (RecyclerView) findViewById(R.id.recycler_view);

        mAdapter = new ListViewAdaptor(mDataList);
        RecyclerView.LayoutManager mLayoutManager = new LinearLayoutManager(getApplicationContext());
        mRecyclerView.setLayoutManager(mLayoutManager);
        mRecyclerView.setItemAnimator(new DefaultItemAnimator());
        mRecyclerView.setHasFixedSize(true);
        mRecyclerView.setAdapter(mAdapter);
        prepareList();
    }

    public void prepareList(){
       Data data = new Data("Item1","Price1",R.drawable.star);
        mDataList.add(data);
        data = new Data("Item2","Price2",R.drawable.star);
        mDataList.add(data);
        data = new Data("Item3","Price3",R.drawable.star);
        mDataList.add(data);
        data = new Data("Item4","Price4",R.drawable.star);
        mDataList.add(data);
        data = new Data("Item5","Price5",R.drawable.star);
        mDataList.add(data);
    }

}

希望这有帮助!!!

答案 1 :(得分:0)

你会发现很多在线资源。但是,让我简单地说一下。 假设您要在一行中存储2个文本视图。 1.对于行的每个布局,您需要制作自定义布局xml文件并在那里设计布局。

  1. 接下来,创建一个存储数据的类,并通过getter返回数据。

    class Category {
    private String categoryName;
    private String categoryImageURL;
    
    Category (String categoryName, String categoryImageUrl) {
        this.categoryName = categoryName;
        this.categoryImageURL = categoryImageUrl;
    }
    String getCategoryName () {
        return categoryName;
    }
    String getCategoryImageURL () {
        return categoryImageURL;
    }
    }
    
  2. 现在创建一个自定义arrayadapter,它将链接数据和布局。 使用您在上面定义的类扩展arrayadapter类。

    private class categoryArrayAdapter extends ArrayAdapter<Category> {
    private Context context;
    private List<Category> categories;
    
    public categoryArrayAdapter (Context context, int resource, ArrayList<Category> objects) {
        super(context, resource, objects);
    
        this.context = context;
        this.categories = objects;
    }
    
    public View getView (int position, View convertView, ViewGroup parent) {
        Category category = categories.get(position);
    
        LayoutInflater inflater = (LayoutInflater) context.getSystemService(Activity.LAYOUT_INFLATER_SERVICE);
        View           view     = inflater.inflate(R.layout.category_row_view, null);
    
        TextView  categoryListRowText  = (TextView) view.findViewById(R.id.categoryListRowText);
        TextView  categoryListRowImage    = (TextView) view.findViewById(R.id.categoryListRowImage);
    
        categoryListRowText.setText(category.getCategoryName());
        categoryListRowImage.setText(category.getCategoryImageURL());
    
        return view;
    }
    }
    
  3. 最后将适配器链接到列表视图

    ArrayAdapter<Category> adapter = new categoryArrayAdapter(this, 0, categories);
    categoryListView.setAdapter(adapter);
    
  4. 希望这能回答你的问题。