2016-04-08 5 views
1

私はカードのコンセプトを使用する必要があるアンドロイドスタジオのページを作成しています。カードには人の画像と画像の下にある人物の名前が含まれています。例えば、アンドロイド・マシュマロの連絡先リスト(グリッド・ビュー内の各連絡先がタイルとして表示されます)。androidでカードビューを動的に使用する

私はさまざまな方法で試しましたが、これを修正することができませんでした。私はカードを生成したが、私は人々の数に基づいて自動的に生成されなければならないタイル張りの形状にさらに4枚のカードを必要とするどのよう 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> 

これ。

ありがとう。

+0

RecyclerViewとアダプタを使用するとかなり簡単に使用できます。必要に応じて開発した回答を書くことができます。 – xNeyte

+0

はい、それは本当に役立つでしょう。ありがとうございました –

答えて

1

このようなGridLayoutManagerAndroid RecyclerView) でRecyclerViewを使用します。

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

その後RecyclerView.Adapterを拡張し、あなたのcardview.xmlレイアウトを膨張しRecyclerViewにそれを設定する独自のクラスMyAdapterます

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

詳しい方法については、を参照してください0

1

GridViewを使用して簡単に行うことができます。 cardviewを入力するカスタムアダプタクラスが必要です。

この本

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(); 
  
                    } 
                }); 
  
    } 
  
} 

のようなあなたの活動からアダプタクラスのサンプルコード

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; 
    } 

}

呼び出し、このアダプタクラスは、このチュートリアルlink 1link 2

に従っています
関連する問題