locked
StackPanel ou Grid? RRS feed

  • Pergunta

  • Boa noite amigos, como estão?

    Como sabem, sou iniciante no desenvolvimento de aplicativos para Windows Phone, e até já fiz um App e disponibilizei na Marketplace.

    Agora, vou começar um segundo aplicativo e logo de cara já me deparei com uma dúvida que é conhecimento obrigatório.

    Para estruturar o conteúdo das minhas views (controle Panorama), uso StackPanel ou Grid? Quero que o conteúdo seja devidamente separado por areas. Porem, uso StackPanel ou Grid? Em meu outro aplicativo, usei StackPanel para tudo. Tentei aqui fazer algo em Grid, mas não entendi muito bem o funcionamento. Se alguem pudesse me explicar a diferença entre as duas, o que é recomendado, e como criar adequadamente uma Grid, pra mim seria ideal.

    Obrigado, amigos.

    domingo, 6 de maio de 2012 21:59

Respostas

  • Ora viva Rafael,

    O StackPanel é um controlo de layout muito simples e rápido de usar; o maior uso que lhe dou é para fazer formulários em que simplesmente coloco controlos dentro dele e ele os coloca uns em cima dos outros. Exemplo:

    <StackPanel>
        <TextBlock>Name</TextBlock>
        <TextBox x:Name="NameTextBox" />
        <TextBlock>Email</TextBlock>
        <TextBox x:Name="EmailTextBox" />
        <Button>Ok</Button>
        <Button>Cancel</Button>
    </StackPanel>

    A Grid permite definir layouts bem mais complexos; tal como o nome indica, defines uma grelha ou tabela com base em linhas (Rows) e colunas (Columns) e depois colocas os controlos indicando em que linha e coluna os queres. Exemplo:

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition />
            <RowDefinition />
        </Grid.RowDefinitions>
    
        <TextBlock>Name</TextBlock>
        <TextBox x:Name="NameTextBox" Grid.Column="1" />
        <TextBlock Grid.Row="1">Email</TextBlock>
        <TextBox x:Name="EmailTextBox" Grid.Row="1" Grid.Column="1" />
        <Button Grid.Row="2">Ok</Button>
        <Button Grid.Row="2" Grid.Column="1">Cancel</Button>
    </Grid>

    Nenhum é melhor do que o outro, cada um tem a sua funcionalidade e por vezes, chegamos mesmo a usar os dois simultaneamente (um dentro do outro, por exemplo!)

    <StackPanel>
        <TextBlock>Name</TextBlock>
        <TextBox x:Name="NameTextBox" />
        <TextBlock>Email</TextBlock>
        <TextBox x:Name="EmailTextBox" />
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition />
                <ColumnDefinition />
            </Grid.ColumnDefinitions>
    
            <Button>Ok</Button>
            <Button Grid.Column="1">Cancel</Button>
        </Grid>
    </StackPanel>



    Pedro Lamas
    DevScope | Senior Software Development Engineer & WP7 Development Speaker
    www.pedrolamas.com | @pedrolamas

    segunda-feira, 7 de maio de 2012 09:22

Todas as Respostas

  • Ora viva Rafael,

    O StackPanel é um controlo de layout muito simples e rápido de usar; o maior uso que lhe dou é para fazer formulários em que simplesmente coloco controlos dentro dele e ele os coloca uns em cima dos outros. Exemplo:

    <StackPanel>
        <TextBlock>Name</TextBlock>
        <TextBox x:Name="NameTextBox" />
        <TextBlock>Email</TextBlock>
        <TextBox x:Name="EmailTextBox" />
        <Button>Ok</Button>
        <Button>Cancel</Button>
    </StackPanel>

    A Grid permite definir layouts bem mais complexos; tal como o nome indica, defines uma grelha ou tabela com base em linhas (Rows) e colunas (Columns) e depois colocas os controlos indicando em que linha e coluna os queres. Exemplo:

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition />
            <RowDefinition />
        </Grid.RowDefinitions>
    
        <TextBlock>Name</TextBlock>
        <TextBox x:Name="NameTextBox" Grid.Column="1" />
        <TextBlock Grid.Row="1">Email</TextBlock>
        <TextBox x:Name="EmailTextBox" Grid.Row="1" Grid.Column="1" />
        <Button Grid.Row="2">Ok</Button>
        <Button Grid.Row="2" Grid.Column="1">Cancel</Button>
    </Grid>

    Nenhum é melhor do que o outro, cada um tem a sua funcionalidade e por vezes, chegamos mesmo a usar os dois simultaneamente (um dentro do outro, por exemplo!)

    <StackPanel>
        <TextBlock>Name</TextBlock>
        <TextBox x:Name="NameTextBox" />
        <TextBlock>Email</TextBlock>
        <TextBox x:Name="EmailTextBox" />
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition />
                <ColumnDefinition />
            </Grid.ColumnDefinitions>
    
            <Button>Ok</Button>
            <Button Grid.Column="1">Cancel</Button>
        </Grid>
    </StackPanel>



    Pedro Lamas
    DevScope | Senior Software Development Engineer & WP7 Development Speaker
    www.pedrolamas.com | @pedrolamas

    segunda-feira, 7 de maio de 2012 09:22
  • Rapaz, aí sim hein! Que aula. rs

    Obrigado! Graças a isso ficou claro o conceito, e o uso quanto a esses dois controles.

    Mas apenas uma dúvida: Então, por cada Header no meu Panorama (ou em alguma outra page qualquer), só posso (ou só devo) ter apenas uma grid?

    Resumidamente: uma Grid por Panorama?

    segunda-feira, 7 de maio de 2012 11:56
  • Tal como te disse, isso depende do que pretendes! :)

    Podes ter uma Grid por Panorama, dentro dessa Grid ter outras Grid's ou StackPanel's ou... o que quiseres!!!


    Pedro Lamas
    DevScope | Senior Software Development Engineer & WP7 Development Speaker
    www.pedrolamas.com | @pedrolamas

    segunda-feira, 7 de maio de 2012 13:33
  • Pedro, muito obrigado pela explicação.

    Agora tudo ficou bem claro.


    segunda-feira, 7 de maio de 2012 13:34