在android中动态使用卡片视图

时间:2016-04-08 12:00:52

标签: android xml android-studio android-cardview

我在android studio中创建一个页面,我需要使用卡片的概念,其中卡片包含一个人的图像和图像下方的人名,卡片必须出现在网格中,例如android marshmallow's联系人列表,其中每个联系人在网格视图中显示为磁贴。

我尝试了不同的方法,但无法纠正这一点,请帮助我。 This is the Image of how the final output should look like.

  <android.support.v7.widget.CardView
      android:layout_width="104dp"
      android:layout_height="wrap_content"
      android:id="@+id/cardview">

      <ImageView
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:paddingLeft="25dp"
          android:src="@drawable/calendar_screen_launch_forcard"
          android:id="@+id/coach_img"
          android:paddingTop="5dp" />

      <TextView
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:layout_toRightOf="@+id/person_name"
          android:text="Mark Linonel Jr"
          android:textSize="10dp"
          android:singleLine="false"
          android:paddingTop="70dp"
          android:paddingLeft="20dp"
          android:background="#00000000" />
  </android.support.v7.widget.CardView>

这是我如何生成一张卡片,但我还需要另外四张平铺形状的卡片,这些卡片应根据人数自动生成。

谢谢你。

2 个答案:

答案 0 :(得分:1)

RecyclerViewGridLayoutManagerAndroid RecyclerView)一起使用 像这样:

RecyclerView recyclerView = findViewById(R.id.my_recyclerview);
GridLayoutManager layoutManager = new GridLayoutManager(context, 2);
recyclerView.setLayoutManager(layoutManager);

然后创建自己的课程MyAdapter,其中RecyclerView.Adapter扩展cardview.xml布局,并将其设置为RecyclerView

MyAdapter adapter = new MyAdapter(dataset);
recyclerView.setAdapter(adapter);

有关如何执行此操作的详细说明,请参阅this link

答案 1 :(得分:1)

您可以使用GridView轻松完成此操作。 您需要一个自定义适配器类,您可以在其中填充cardview

这是适配器类的示例代码

public class CustomGrid extends BaseAdapter{
    private Context mContext;
    private final String[] web;
    private final int[] Imageid;

    public CustomGrid(Context c,String[] web,int[] Imageid ) {
        mContext = c;
        this.Imageid = Imageid;
        this.web = web;
    }

    @Override
    public int getCount() {
        // TODO Auto-generated method stub
        return web.length;
    }

    @Override
    public Object getItem(int position) {
        // TODO Auto-generated method stub
        return null;
    }

    @Override
    public long getItemId(int position) {
        // TODO Auto-generated method stub
        return 0;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        // TODO Auto-generated method stub
        View grid;
        LayoutInflater inflater = (LayoutInflater) mContext
            .getSystemService(Context.LAYOUT_INFLATER_SERVICE);

        if (convertView == null) {

            grid = new View(mContext);
            grid = inflater.inflate(R.layout.grid_single, null);
            TextView textView = (TextView) grid.findViewById(R.id.grid_text);
            ImageView imageView = (ImageView)grid.findViewById(R.id.grid_image);
            textView.setText(web[position]);
            imageView.setImageResource(Imageid[position]);
        } else {
            grid = (View) convertView;
        }

        return grid;
    }
}

从您这样的活动中调用此适配器类

public class MainActivity extends Activity {
    GridView grid;
    String[] name = {
                "Google",
                "Github",
                "Instagram",
                "Facebook"
    };
    
    int[] imageId = {
            R.drawable.image1,
            R.drawable.image2,
            R.drawable.image3,
            R.drawable.image4           
 
    };
         
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
 
        CustomGrid adapter = new CustomGrid(MainActivity.this, name, imageId);
        grid=(GridView)findViewById(R.id.grid);
                grid.setAdapter(adapter);
                grid.setOnItemClickListener(new AdapterView.OnItemClickListener() {
 
                    @Override
                    public void onItemClick(AdapterView<?> parent, View view,
                                            int position, long id) {
                        Toast.makeText(MainActivity.this, "You Clicked at " +name[+ position], Toast.LENGTH_SHORT).show();
 
                    }
                });
 
    }
 
}

按照本教程link 1link 2

进行操作