Formularios em duas colunas

[Vinícius Velasco]

Olá pessoa eu tenho um tela que tera vários campos, qual a sugestao que me dão, estou tentando fazer em duas colunas os campos mas ficam mto desalinhados, tera telas que precisaram de 3 colunas.

Alguma sugestao??


Grato

--
Vinícius Velasco
MSN: ircvi...@hotmail.com
Skype: ircvinicius
Fone: 66 9206 6966
Rondonópolis - Mato Grosso - Brasil

"Nos seus momentos de aflição, não se envergonhe de baixar a cabeça e
chamar por Deus!!!"

[All Pereira]

Não consegui interpretar bem sua pergunta, mas acho que quanto você
referesse a 2 colunas quer dizer:
coluna1 coluna2
Nome: [ input do nome]

Certo? se sim, então veja a explicação abaixo.

Se você estiver usando o modelo de Layout Form podes fazer o seguinte:

<mx:Form width="50%" height="80%" horizontalCenter="0" top="10">
<mx:FormItem label="Nome:">
<mx:TextInput/>
</mx:FormItem>
</mx:Form>

Onde:
# <mx:Form/>é o nosso layout do tipo Form;

# <mx:FormItem/> é o nosso item do formulário, ou seja, dentro desta
tag é possível colocar algum Control, bem como, TextInput, DataGrid,
entre outros.( a sua propiedade label é o mesmo Control label)

# <mx:TextInput/> é o nosso textInput que pertence ai FormItem.

[All Pereira]

[Marcelo Caser]

<mx:HBox>?

2009/10/19 All Pereira <allysson...@gmail.com>

[Vinícius Velasco]

Olá pessoal desculpa nao expliquei muito bem... vou tentar novamente.

 

Tenho um formulario que tera uns 30 campos... se colocar um embaixo do outro vai ficar uma tripa enorme.... rsrsrsrs entao que eu queria era que fica tres colunas de componentes com 10 cada uma, eu usei um HBox, mas ocorreu que alguma linha tera componente soh na primeira coluna e ai ficam desalinhados e eu queria que todos os componentes do formulario ficasse alinhados um na frente do outro. Vou tentar fazer um desenho abaixo:

 

 

Codigo: inputtext

Nome: inputtext

Endereco: inputtext                                                                   Cidade: inputtext                                            Estado: combobox

Nascimento: date                                                                      Cadastro:date

 

 

Seria mais ou menos isso ai...

 

 

Alguem teria uma dica pra isso??

 

Grato

2009/10/19 Marcelo Caser <marcel...@gmail.com>

[cocuroci]

Só usar FormItem dentro de Form e Form dentro de HBox

Assim:

    <mx:HBox width="900">
        <mx:Form width="100%">
            <mx:FormItem label="nome">
                <mx:TextInput />
            </mx:FormItem>
        </mx:Form>
        <mx:Form width="100%">
            <mx:FormItem label="nome">
                <mx:TextInput />
            </mx:FormItem>
        </mx:Form>
        <mx:Form width="100%">
            <mx:FormItem label="nome">
                <mx:TextInput />
            </mx:FormItem>
        </mx:Form>
    </mx:HBox>

2009/10/19 Vinícius Velasco <irc.vi...@gmail.com>

[Vinícius Velasco]

Olá cocuroci,
obrigado por responder, fiz como você disse mas não deu, estou mandando um print como anexo, podem ver que ativou o scroll porque tem mais um campo na frente que nao aparece na imagem, coisas que eu também não queria e os objetos não ficam alinhados as linhas ficam uma mais acima da outra os espaços em branco eu fiz com formitem sem campos

Grato

2009/10/19 cocuroci <cocu...@gmail.com>

[cocuroci]

Vinícius, acho que vc precisa setar os tamanhos dos FormItens e dos componentes dentro deles para eliminar essa rolagem.

2009/10/20 Vinícius Velasco <irc.vi...@gmail.com>

[Vinícius Velasco]

enetendo, sobre o alinhamento teria uma sugestao?

2009/10/20 cocuroci <cocu...@gmail.com>

[All Pereira]

Tenta alinhar a esquerda e colocar os tamanhos em porcentagem.

Ve se funciona, senão posta o código deste view aqui!

[Vinícius Velasco]

Olá All,
Obrigado por responder.
Estou enviando o código

        <mx:VDividedBox x="0" y="0" width="100%" height="95%">
            <mx:Canvas id="cnvForm" width="100%" height="100%">
                <mx:HBox width="100%" height="100%">
                    <mx:Form width="100%" height="100%">
                        <mx:FormItem label="Contrato">
                            <flexPe:MasterTextInput id="txtContrato" inputMask="99/99999" width="80" height="22"/>
                        </mx:FormItem>
                        <mx:FormItem label="Empresa">
                            <mx:HBox width="100%">
                                <flexPe:MasterTextInput id="txtIdEmpresa" onlyRestrict="number" width="55"/>
                                <flexMaggi:PopUpSelector height="22" width="20"/>
                                <mx:TextInput id="txtEmpresa" width="200" editable="false" enabled="false"/>
                            </mx:HBox>
                        </mx:FormItem>
                        <mx:FormItem label="Produto">
                            <mx:HBox width="100%">
                                <flexPe:MasterTextInput id="txtIdProduto" onlyRestrict="number" width="55"/>
                                <flexMaggi:PopUpSelector height="22" width="20"/>
                                <mx:TextInput id="txtProduto" width="200" editable="false" enabled="false"/>
                            </mx:HBox>                       
                        </mx:FormItem>
                        <mx:FormItem label="Cliente">
                            <mx:HBox width="100%">
                                <flexPe:MasterTextInput id="txtIdCliente" onlyRestrict="number" width="55"/>
                                <flexMaggi:PopUpSelector height="22" width="20"/>
                                <mx:TextInput id="txtCliente" width="200" editable="false" enabled="false"/>
                            </mx:HBox>                       
                        </mx:FormItem>
                        <mx:FormItem label="Data Contrato">
                            <mx:DateField id="dfDataContrato"/>

                        </mx:FormItem>
                    </mx:Form>
                    <mx:Form width="100%">

                        <mx:FormItem height="22"/>
                        <mx:FormItem label="Filial">
                            <mx:HBox width="100%">
                                <flexPe:MasterTextInput id="txtIdFilial" onlyRestrict="number" width="55"/>
                                <flexMaggi:PopUpSelector height="22" width="20"/>
                                <mx:TextInput id="txtFilial" width="200" editable="false" enabled="false"/>
                            </mx:HBox>
                        </mx:FormItem>
                        <mx:FormItem height="22"/>
                        <mx:FormItem label="Endereço">
                            <mx:HBox width="100%">
                                <flexPe:MasterTextInput id="txtIdEndereco" onlyRestrict="number" width="55"/>
                                <flexMaggi:PopUpSelector height="22" width="20"/>
                                <mx:TextInput id="txtEndereco" width="200" editable="false" enabled="false"/>
                            </mx:HBox>                       
                        </mx:FormItem>
                        <mx:FormItem label="Porto de Origem">
                            <mx:HBox width="100%">
                                <flexPe:MasterTextInput id="txtIdPortoOrigem" onlyRestrict="number" width="55"/>
                                <flexMaggi:PopUpSelector height="22" width="20"/>
                                <mx:TextInput id="txtPortoOrigem" width="200" editable="false" enabled="false"/>
                            </mx:HBox>                       

                        </mx:FormItem>
                    </mx:Form>
                    <mx:Form width="100%">

                        <mx:FormItem/>
                        <mx:FormItem/>
                        <mx:FormItem/>
                        <mx:FormItem/>
                        <mx:FormItem label="Porto de Destino">
                            <mx:HBox width="100%">
                                <flexPe:MasterTextInput id="txtIdPortoDestino" onlyRestrict="number" width="55"/>
                                <flexMaggi:PopUpSelector/>
                                <mx:TextInput id="txtPortoDestino" width="250" editable="false" enabled="false"/>
                            </mx:HBox>                       

                        </mx:FormItem>                       
                    </mx:Form>
                </mx:HBox>
               

            </mx:Canvas>

2009/10/20 All Pereira <allysson...@gmail.com>

Tenta alinhar a esquerda e colocar os tamanhos em porcentagem.

Ve se funciona, senão posta o código deste view aqui!

[Bruno Carneiro]

Também estou interessado em um form de duas colunas... creio que nas
próximas versões do flex o form deve vir com essa opção...

[Vinícius Velasco]

2009/10/21 Bruno Carneiro <guimarae...@gmail.com>

Também estou interessado em um form de duas colunas... creio que nas
próximas versões do flex o form deve vir com essa opção...

[Vinícius Velasco]

Olá Bruno,
Então cara queria muito isso, se exisitisse um tipo table do html misturado com um form do flex ia ser perfeito

2009/10/21 Bruno Carneiro <guimarae...@gmail.com>

Também estou interessado em um form de duas colunas... creio que nas
próximas versões do flex o form deve vir com essa opção...

[Mário Júnior]

Ninguem gosta de usar o <mx:Grid> ???? coitado... ele vai ficar lá com depressao.... :P

2009/10/21 Vinícius Velasco <irc.vi...@gmail.com>

--
Mario Junior
Enterprise Java / Flex Architectures
Adobe Certified Expert Flex 3 with AIR

Sofshore Informática
http://www.sofshore.com.br
+55 (48) 3337 2003
Rua Pastor Willian Richard Schisler Filho 452 sl 102, 88034-100 Itacorubi
Florianopolis SC Brasil

[Vinícius Velasco]

rsrsrsrsrs coitado mesmo Mário, eu vi ele ali na hora achei ele estranho mas não tem jeito vai ser ele mesmo porque com form não ta ficando do jeito que queria :P... amanha falo aqui se deu certo

2009/10/21 Mário Júnior <junin...@gmail.com>