android - span - xamarin forms image grid

¿Configurar rowSpan o colSpan de un hijo de un GridLayout programáticamente?

Question

Tengo un GridLayout con 5 columnas y 3 filas. Ahora puedo insertar vistas de niños arbitrarias, lo cual es genial. Aún mejor es que puedo asignar columnSpan=2 a algún elemento para columnSpan=2 a 2 columnas (lo mismo con rowSpan).

El problema ahora es que no puedo asignar rowSpan o columnSpan mediante programación (es decir, en tiempo de ejecución). Algunas búsquedas sugirieron algo como esto:

layoutParams.columnSpec = GridLayout.spec(0, columnSpan);

Pero no entiendo muy bien qué significan los parámetros de especificación (inicio y tamaño). La documentación también es bastante pobre en este punto.

¡Cualquier ayuda es muy apreciada!

Answer 1

¿Qué tal esto?

GridLayout.LayoutParams layoutParams = new GridLayout.LayoutParams();
layoutParams.rowSpec = GridLayout.spec(GridLayout.UNDEFINED, item.getRowSpan());
layoutParams.columnSpec = GridLayout.spec(GridLayout.UNDEFINED, item.getColumnSpan());

De acuerdo con la documentación, también debe llamar a setLayoutParams en GridLayout SI cambia la columna o el intervalo de fila DESPUÉS DE QUE las vistas secundarias se inserten en GridLayout. No necesitas esto si los agregas mientras configuras el intervalo

Answer 2

Bueno, pasé algunas horas averiguando qué está pasando aquí. Bueno, no encontré ninguna manera de configurar columnSpan o rowSpan en tiempo de ejecución.

Pero encontré una solución que funciona (al menos para mí):

Código Java

private LinearLayout addNewSpannedView(Integer resourceId, ViewGroup rootElement) {
    return (LinearLayout) ((ViewGroup) getLayoutInflater().inflate(resourceId, rootElement, true)).getChildAt(rootElement.getChildCount() - 1);
}
// set columnSpan depending on some logic (gridLayout is the layout to add the view''s to -> in my case these are LinearLayouts)
shape = addNewSpannedView(columnSpan == 1 ? R.layout.grid_ll_col_span_1 : R.layout.grid_ll_col_span_2, gridLayout);

grid_ll_col_span_2.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="@dimen/shapeWidth"
    android:layout_height="wrap_content"
    android:layout_columnSpan="2"/>

Sugerencia: es muy importante que configure los atributos de ancho y alto, antes de que inflate () agregue la vista al elemento raíz (es decir, el elemento principal).

Espero que alguien pueda usar esto ;-)

Answer 3

Estoy cambiando la columna de aproximadamente 2 celdas programáticamente y luego de inflar con este código:

GridLayout.LayoutParams itemLP = (GridLayout.LayoutParams)gridItemV.getLayoutParams();
itemLP.columnSpec = GridLayout.spec(0, 2);
gridItemV.setLayoutParams(itemLP);

lo importante es llamar a setLayoutParams después de cambiar la columnSpec espero que también te columnSpec ayuda

Answer 4

Podría modificar el atributo layout_rowSpan de GridLayout de esta manera:

// View allocated in first row and first column
View child = findViewById(R.id.row0column0);

GridLayout.LayoutParams params =
   new GridLayout.LayoutParams(child.getLayoutParams());

params.rowSpec = GridLayout.spec(0, 2);    // First cell in first row use rowSpan 2.
params.columnSpec = GridLayout.spec(0, 2); // First cell in first column use columnSpan 2.
child.setLayoutParams(params);

Estoy de acuerdo con la documentación necesita un poco de mejora en este sentido.

Answer 5

    GridLayout gridLayout = (GridLayout)findViewById(R.id.tableGrid);

    gridLayout.removeAllViews();

    int total = 12;
    int column = 5;
    int row = total / column;
    gridLayout.setColumnCount(column);
    gridLayout.setRowCount(row + 1);
    for(int i =0, c = 0, r = 0; i < total; i++, c++)
    {
        if(c == column)
        {
            c = 0;
            r++;
        }
        ImageView oImageView = new ImageView(this);
        oImageView.setImageResource(R.drawable.ic_launcher);
        GridLayout.LayoutParams param =new GridLayout.LayoutParams();
        param.height = LayoutParams.WRAP_CONTENT;
        param.width = LayoutParams.WRAP_CONTENT;
        param.rightMargin = 5;
        param.topMargin = 5;
        param.setGravity(Gravity.CENTER);
        param.columnSpec = GridLayout.spec(c);
        param.rowSpec = GridLayout.spec(r);
        oImageView.setLayoutParams (param);
        gridLayout.addView(oImageView);
    }