Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

ezequiellorenzatti

Função para mostrar e ocultar componentes

Recommended Posts

Estou fazendo alguns testes com o propriedade de visibilidade dos componentes.

 

Criei um código para mostrar e ocultar um componente datagrid, a principio só consegui fazer como mostra abaixo, vejam o codigo.

 

A lógica é a seguinte:

Sempre que clicar no botão "Ocultar", o Datagrid é removido da tela, e o label do botão muda para "Mostrar", ao ao ser clicado mostra o datagrid e volta com o label para "Ocultar", reiniciando o ciclo.

 

Até então tudo certo, porêm só funciona com o datagrid específico.

 

Gostaria de criar um afunção que eu passe o id do componente que eu quero ocultar, para evitar ter que criar uma função pra cada vez que eu precise ocultar algum componente, algo como click=alteraestado('idcomponente')

 

Alguém já passou por isso, sabe me ajudar

 

 

 

 

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
			   xmlns:s="library://ns.adobe.com/flex/spark" 
			   xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
	<fx:Declarations>
		<!-- Place non-visual elements (e.g., services, value objects) here -->
	</fx:Declarations>
	<fx:Script>
		<![CDATA[
			public function alteraestado():void{
				if (dg_teste.visible)
				{
					dg_teste.visible = false;
					mostrar.label = "Mostrar";
				}
				else
				{
					dg_teste.visible = true;
					mostrar.label = "Ocultar"
				}
			}
				
		]]>
	</fx:Script>
	<mx:DataGrid x="48" y="83" id="dg_teste">
		<mx:columns>
			<mx:DataGridColumn headerText="Column 1" dataField="col1"/>
			<mx:DataGridColumn headerText="Column 2" dataField="col2"/>
			<mx:DataGridColumn headerText="Column 3" dataField="col3"/>
		</mx:columns>
	</mx:DataGrid>
	<s:Button x="48" y="54" label="Ocultar" id="mostrar" click="alteraestado()"/>
	<s:Label x="48" y="34" text="Mostrar e Ocultar Componentes" />
</s:Application>

Compartilhar este post


Link para o post
Compartilhar em outros sites

Fiz algumas alterações no exemplo, pra vocês verem como fica complicada a vida caso eu tiver que fazer vários componentes que podem ser ocultados.

 

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
			   xmlns:s="library://ns.adobe.com/flex/spark" 
			   xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
	<fx:Declarations>
		<!-- Place non-visual elements (e.g., services, value objects) here -->
	</fx:Declarations>
	<fx:Script>
		<![CDATA[	
			public function mostrarcoluna():void{
				if (dg_teste.columns[0].visible){
					dg_teste.columns[0].visible = false;
					btmostrarcoluna.label = "Mostrar Nome"
				}
				else{
					dg_teste.columns[0].visible = true;
					btmostrarcoluna.label = "Ocultar Nome"
				}
				
			}
			public function alteraestado():void{
				if (dg_teste.visible)
				{
					dg_teste.visible = false;
					mostrar.label = "Mostrar DataGrid";
					dgdisplay.visible = false;
				
				}
				else
				{
					dg_teste.visible = true;
					mostrar.label = "Ocultar DataGrid";
					dgdisplay.visible = true;
				}
			}
			public function ocultarcontainer():void{
				if (bcontainer.visible)
				{
					bcontainer.visible = false;
					btocultarcontainer.label = "Mostrar Container";
					
				}
				else
				{
					bcontainer.visible = true;
					btocultarcontainer.label = "Ocultar Container"
		
				}
			}
				
		]]>
	</fx:Script>
	<s:Label x="10" y="10" text="Mostrar e Ocultar Componentes"/>
	<s:Button x="10" y="29" label="Ocultar Container" id="btocultarcontainer" click="ocultarcontainer()"/>
	<s:BorderContainer id="bcontainer" x="6" y="78" width="327" height="220">
		<mx:DataGrid x="11" y="65" id="dg_teste" height="133">
			<mx:columns>
				<mx:DataGridColumn id="coluna1" headerText="Nome" dataField="col1"/>
				<mx:DataGridColumn id="coluna2" headerText="Fone" dataField="col2"/>
				<mx:DataGridColumn id="coluna3" headerText="Email" dataField="col3"/>
			</mx:columns>
		</mx:DataGrid>
		<s:Button x="9" y="35" label="Ocultar DataGrid" id="mostrar" click="alteraestado()"/>
		
		<s:Button x="218" y="35" label="Ocultar Nome" id="btmostrarcoluna" click="mostrarcoluna()"/>
		<s:Label x="138" y="134" text="DataGrid" id="dgdisplay"/>
		<s:Label x="137" y="10" text="Container"/>
	</s:BorderContainer>
	
</s:Application>

Compartilhar este post


Link para o post
Compartilhar em outros sites

Basta no metodo click do botao você passar o componete que você quer que seja tornado invisivel.

Abs

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.