Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

GridView with different column sizes

Trying to make a highscore list, which is scrollable, and looks like this:

foo         1000
bar         876
foobar      500
foobarfoo   1

I am currently doing it with a GridView. I would like to set the name column width to 60% of the screen and the score column width to 40%. Is it possible?

Currently I am trying via a costum adapter. Here is the getview funcion for it:

public View getView(int position, View convertView, ViewGroup parent) {
    TextView tv;
    if (convertView == null) {
        tv = new TextView(context);
        tv.setTextSize(25);
        tv.setTextColor(Color.WHITE);              

        if (position % 2 == 0)
        {
            tv.setLayoutParams(new GridView.LayoutParams((width/10)*6, 50));
        }
        else
        {
            tv.setLayoutParams(new GridView.LayoutParams((width/10)*4, 50));
        }
    }
    else {
        tv = (TextView) convertView;
    }

    tv.setText(texts[position]);
    return tv;
}

The layout is built by the gridview and a button at the bottom. The XML file is:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent" android:orientation="vertical" android:id="@+id/top">
    <GridView android:layout_width="fill_parent"
              android:layout_height="wrap_content"
              android:layout_weight="2"
              android:id="@+id/grid"
              android:numColumns="2"
              android:columnWidth="0dp"
              >
    </GridView>
    <Button android:layout_width="fill_parent" android:layout_height="wrap_content" android:id="@+id/backbutton" android:text="@string/backstr"></Button>

</LinearLayout>

So the question again: Is it possible to set the GridView to let adding different sized columns? If yes, then my approach is good? (Probably not, since it is not working :)) Did I just miss something?

Thank you in advance!

like image 383
Szellszi Avatar asked Jul 11 '11 13:07

Szellszi


2 Answers

We had to do this for a project, and didn't want to use anything other than a GridView because the functionality was repeated, but on one GridView we needed a slightly different view configuration (but still using an adapter and all that other good stuff). We found that you CAN do this if you override GridView's layoutChildren function, although it's pretty poorly documented.

Our implementation has a check for a special view and for if the new layout has already been implemented:

@Override
protected void layoutChildren(){
    super.layoutChildren();
    if(!isSpecial || layoutAlreadySet) return;
    layoutAlreadySet = true;
    //Implement special layout....
}
like image 89
Steve Avatar answered Oct 15 '22 22:10

Steve


Working like a charm! Big thanks to Abhinav, who made a good advise. Here is the code for everyone who has the same problem:

public View getView(int position, View convertView, ViewGroup parent) {
    TextView tv1;
    TextView tv2;
    LinearLayout ll;
    if (convertView == null) {
        tv1 = new TextView(context);
        tv1.setTextSize(25);
        tv1.setTextColor(Color.WHITE);
        tv1.setGravity(Gravity.LEFT);
        tv1.setPadding(5, 5, 5, 5);
        tv1.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.FILL_PARENT,
                                                          LinearLayout.LayoutParams.FILL_PARENT,
                                                          (float) 3.0));

        tv2 = new TextView(context);
        tv2.setTextSize(25);
        tv2.setTextColor(Color.WHITE);  
        tv2.setGravity(Gravity.RIGHT);
        tv2.setPadding(5, 5, 5, 5);
        tv2.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.FILL_PARENT,
                                                              LinearLayout.LayoutParams.FILL_PARENT,
                                                              (float) 4.0));

        ll = new LinearLayout(context);
        ll.setOrientation(0);
        ll.setPadding(5, 5, 5, 10);

        tv1.setText(names[position]);
        tv2.setText(scores[position]);

        ll.addView(tv1);
        ll.addView(tv2);
    }
    else {
        ll = (LinearLayout) convertView;
        tv1 = (TextView) ll.getChildAt(0);
        tv2 = (TextView) ll.getChildAt(1);

        tv1.setText(names[position]);
        tv2.setText(scores[position]);
    }

    return ll;
}

And the XML file:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent" android:orientation="vertical" android:id="@+id/top">
    <ListView android:layout_width="fill_parent"
              android:layout_height="wrap_content"
              android:layout_weight="2"
              android:numColumns="2"
              android:columnWidth="0dp"
              android:id="@+id/list">
    </ListView>
    <Button android:layout_width="fill_parent" android:layout_height="wrap_content" android:id="@+id/backbutton" android:text="@string/back"></Button>

</LinearLayout>

If you think you can improve this code (since I am a newbie in this field) don't hesitate, to reply! Thanks in advance!

like image 26
Szellszi Avatar answered Oct 15 '22 21:10

Szellszi