web-dev-qa-db-fra.com

Android définissez GridView pour avoir 2 colonnes par ligne uniquement

Voici mon code dans mon activité:

public class GridViewActivity extends Activity {

    GridView gridView;

    static final String[] MOBILE_OS = new String[] { "Android", "iOS",
            "Windows", "Blackberry" };

    @Override
    public void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        gridView = (GridView) findViewById(R.id.gridView1);

        gridView.setAdapter(new ImageAdapter(this, MOBILE_OS));

        gridView.setOnItemClickListener(new OnItemClickListener() {
            public void onItemClick(AdapterView<?> parent, View v,
                    int position, long id) {
                Toast.makeText(
                        getApplicationContext(),
                        ((TextView) v.findViewById(R.id.grid_item_label))
                                .getText(), Toast.LENGTH_SHORT).show();

            }
        });

    }

}

Et dans mon adaptateur d'image:

public class ImageAdapter extends BaseAdapter {
    private Context context;
    private final String[] mobileValues;

    private TextView t;
    public ImageAdapter(Context context, String[] mobileValues) {
        this.context = context;
        this.mobileValues = mobileValues;
    }

    public View getView(int position, View convertView, ViewGroup parent) {

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

        View gridView;

        if (convertView == null) {

            gridView = new View(context);

            // get layout from mobile.xml
            gridView = inflater.inflate(R.layout.mobile, null);




            // set value into textview
            TextView textView = (TextView) gridView
                    .findViewById(R.id.grid_item_label);
            textView.setText(mobileValues[position]);
            Button b = (Button) gridView.findViewById(R.id.grid_item_button);
            Button b2 = (Button) gridView.findViewById(R.id.grid_item_button2);
            t = (TextView) gridView
                    .findViewById(R.id.grid_item_number);
            b.setOnClickListener(new MyOnClickListener(t));
            b2.setOnClickListener(new MyOnClickListenerm(t));
            // set image based on selected text
            ImageView imageView = (ImageView) gridView
                    .findViewById(R.id.grid_item_image);

            String mobile = mobileValues[position];

            if (mobile.equals("Windows")) {
                imageView.setImageResource(R.drawable.windows_logo);
            } else if (mobile.equals("iOS")) {
                imageView.setImageResource(R.drawable.ios_logo);
            } else if (mobile.equals("Blackberry")) {
                imageView.setImageResource(R.drawable.blackberry_logo);
            } else {
                imageView.setImageResource(R.drawable.Android_logo);
            }

        } else {
            gridView = (View) convertView;
        }

        return gridView;
    }

    private void clickedButton(TextView tv){

        int num = Integer.parseInt(tv.getText().toString());
        ++num;
        tv.setText(Integer.toString(num));

    }
    private void clickedButtonm(TextView tv){

        int num = Integer.parseInt(tv.getText().toString());
        if(num>0){
            --num;
            tv.setText(Integer.toString(num));
        }
    }
    @Override
    public int getCount() {
        return mobileValues.length;
    }

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

    @Override
    public long getItemId(int position) {
        return 0;
    }
    class MyOnClickListener implements OnClickListener{

        public final TextView tv;

        public MyOnClickListener(TextView tv){
            this.tv=tv;
        }
        @Override
        public void onClick(View v) {
            // TODO Auto-generated method stub
            clickedButton(tv);
        }

    }
    class MyOnClickListenerm implements OnClickListener{

        public final TextView tv;

        public MyOnClickListenerm(TextView tv){
            this.tv=tv;
        }
        @Override
        public void onClick(View v) {
            // TODO Auto-generated method stub
            clickedButtonm(tv);
        }

    }

}

et mon mobile.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:padding="5dp" >

    <ImageView
        Android:id="@+id/grid_item_image"
        Android:layout_width="wrap_content"
        Android:layout_height="74dp"
        Android:layout_marginRight="10px"
        Android:layout_weight="1.44"
        Android:src="@drawable/Android_logo" >
    </ImageView>


    <LinearLayout
        Android:layout_width="wrap_content"
        Android:layout_height="match_parent"
        Android:orientation="vertical" >

        <Button
            Android:id="@+id/grid_item_button"
            Android:layout_width="30dp"
            Android:layout_height="23dp"
            Android:text=" " />

        <TextView
            Android:id="@+id/grid_item_number"
            Android:layout_width="wrap_content"
            Android:layout_height="wrap_content"
            Android:layout_gravity="center"
            Android:text="0" />

          <Button
            Android:id="@+id/grid_item_button2"
            Android:layout_width="30dp"
            Android:layout_height="23dp"
            Android:text=" " />
    </LinearLayout>

    <TextView
        Android:id="@+id/grid_item_label"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_marginTop="5px"
        Android:text="@+id/label"
        Android:textSize="15px" >
    </TextView>

</LinearLayout>

Je trouve un peu troublant de ne pas pouvoir faire la moue 2 articles par ligne. Je voudrais savoir comment formater ma GridView pour pouvoir réaliser une telle idée

Voici mon code source: http://www.mediafire.com/?25vae87fvahu4wp

22
Raphael Pineda

Utilisez le Android:numColumns="2" dans votre widget GridView

<?xml version="1.0" encoding="utf-8"?>
<GridView xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:id="@+id/grid"
    Android:layout_width="fill_parent"
    Android:layout_height="fill_parent"
    Android:numColumns="2"
    Android:verticalSpacing="10dp"
    Android:horizontalSpacing="10dp"
    Android:scrollbarStyle="outsideOverlay"
    Android:verticalScrollbarPosition="right"
    Android:scrollbars="vertical">
</GridView>

Vous pouvez vous familiariser avec Android UI dans cette lien . Essayez de vous concentrer sur la rubrique GridView

88
K_Anas

vous pouvez également définir le nombre de colonnes par programmation dans un GridView de la manière suivante: -

 gridview.setNumColumns(n);

où 'n' est le nombre de colonnes.

19
Naveen Kumar