Qual é o equivalente a "colspan" em um TableLayout do Android?


132

Estou usando um TableLayout no Android. No momento, tenho um TableRow com dois itens e, abaixo disso, um TableRow com um item. Renderiza assim:

-----------------------------
|   Cell 1    |  Cell 2     |
-----------------------------
|   Cell 3    |
---------------

O que eu quero fazer é fazer com que a célula 3 se estenda pelas duas células superiores, para que fique assim:

-----------------------------
|   Cell 1    |  Cell 2     |
-----------------------------
|           Cell 3          |
-----------------------------

Em HTML, eu usaria um COLSPAN .... como faço para que isso funcione no Android?


Imho, eu acho melhor maneira de fazer isso. Aqui está a resposta: stackoverflow.com/a/18682293/1979882
Vyacheslav

1
Para o registro, observe que um TableLayout é essencialmente um LinearLayout. Isso significa que você pode adicionar qualquer filho diretamente. Portanto, para uma visualização única de todas as colunas, você pode pular o TableRow.
Ralfoide # 02/02

Respostas:


196

Parece que há um atributo fazendo isso: layout_span

UPDATE: Este atributo deve ser aplicado aos filhos do TableRow. NÃO para o próprio TableRow.


8
Sim, este é o único. No entanto, o widget de layout do Eclipse parece não saber sobre ele, pois não foi listado entre as propriedades disponíveis. Mas funciona.
Spike Williams

2
Você sabe, +1 na sua atualização na resposta. Eu estava tentando descobrir por que o Eclipse não está dando essa opção no Ctrl + Space! : D;)
Nirav Zaveri

Eu uso layout_span na minha visão. Então não posso usar peso nessa visão. Eu tenho que usar wrap_content. Por quê?
eC Droid

93

Apenas para concluir a resposta, o atributo layout_span deve ser adicionado ao filho, não ao TableRow.

Este trecho mostra a terceira linha do meu tableLayout, que se estende por duas colunas.

<TableLayout>
    <TableRow
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_span="2"
            android:text="@string/create" />
    </TableRow>
</TableLayout>

36

E é assim que você faz programaticamente

//theChild in this case is the child of TableRow
TableRow.LayoutParams params = (TableRow.LayoutParams) theChild.getLayoutParams();
params.span = 2; //amount of columns you will span
theChild.setLayoutParams(params);

7
Você também pode precisar definir params.weight = 1 para fazer o conteúdo estendido preencher a linha.
precisa

1
Isso não funciona. stackoverflow.com/a/18682293/1979882 Aqui escrevi a explicação.
Vyacheslav

7
Certifique-se de adicionar o filho à linha primeiro.
Artem Kalinchuk

1
@DacSaunders Resposta revertida. Sua edição foi específica para sua necessidade. A resposta original é genérica para o método e 31 polegares para cima podem indicar que você está fazendo algo errado? Veja também o comentário de Artem, que destaca que a criança precisa ser adicionada primeiro. A childneste caso pode ser qualquer coisa, não apenas textview como a sua edição sugeriu. Obrigado
Onimusha

27

Você precisa usar layout_weight para preencher a linha inteira, caso contrário, ela ainda preenche a coluna esquerda ou direita do layout da tabela.

<TableRow
  android:id="@+id/tableRow1"
  android:layout_width="match_parent"
  android:layout_height="wrap_content">

        <Button
            android:id="@+id/button1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_span="2"
            android:layout_weight="1"
            android:text="ClickMe" />

    </TableRow>

3
Obrigado. Esta foi a informação que faltava para elementos pequenos ou flexíveis, no meu caso, um Spinner.
chksr

5

Talvez isso ajude alguém. Eu tentei a solução, layout_spanmas isso não está funcionando para mim. Então, resolvi o problema com esse truque. Basta usar LinearLayoutno lugar de TableRowonde você precisa colspan, só isso.


1
E não precisa ser um LinearLayout. Eu coloquei apenas uma visão, como eu queria.
JPMagalhaes 23/06

3

use android: layout_span no elemento filho do elemento TableRow


1

Eu tive algum problema com o tablespan, no caso de TableRow, Textview e assim por diante, gerado com o código. Mesmo que a resposta do Onimush pareça boa, ela não funciona com a interface do usuário gerada.

Aqui está um pedaço de código que ... não funciona:

            TableRow the_ligne_unidade = new TableRow(this);
            the_ligne_unidade.setBackgroundColor(the_grey);

            TextView my_unidade = new TextView(this);
            my_unidade.setText(tsap_unidade_nom);
            my_unidade.setTextSize(20);
            my_unidade.setTypeface(null, Typeface.BOLD);
            my_unidade.setVisibility(View.VISIBLE);

            TableRow.LayoutParams the_param;
            the_param = (TableRow.LayoutParams)my_unidade.getLayoutParams();
            the_param.span = 3;
            my_unidade.setLayoutParams(the_param);

            // Put the TextView in the TableRow
            the_ligne_unidade.addView(my_unidade);

O código parece estar OK, mas, quando você alcança o init de "the_params", ele retorna NULL.

Por outro lado, esse código funciona como um encanto:

            TableRow the_ligne_unidade = new TableRow(this);
            the_ligne_unidade.setBackgroundColor(the_grey);

            TextView my_unidade = new TextView(this);
            my_unidade.setText(tsap_unidade_nom);
            my_unidade.setTextSize(20);
            my_unidade.setTypeface(null, Typeface.BOLD);
            my_unidade.setVisibility(View.VISIBLE);

            // Put the TextView in the TableRow
            the_ligne_unidade.addView(my_unidade);

            // And now, we change the SPAN
            TableRow.LayoutParams the_param;
            the_param = (TableRow.LayoutParams)my_unidade.getLayoutParams();
            the_param.span = 3;
            my_unidade.setLayoutParams(the_param);

A única diferença é que eu pressiono o Textview dentro do TableRow antes de definir o intervalo. E, neste caso, funciona. Espero que isso ajude alguém!


0

Eu acho que você precisa envolver um layout em torno de outro. Tenha uma lista de Layout verticalmente; dentro, outra lista (ou nesse caso, duas) horizontalmente.

Ainda estou achando difícil dividir bem a interface para 50 a 50 partes do Android.


Acabei fazendo isso para contornar um bug diferente relacionado à tabela que estava causando 1/3 do meu layout oculto no modo paisagem, por motivos desconhecidos.
Spike Williams
Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.