Archive by Author

Encontrando domínio do email AS3

Olá a todos!  Por estes dias estive trabalhando com servidores de email, e surgiu a necessidade de buscar o domínio do email, então desenvolvi uma função para realizar este trabalho. Achei interessante postar aqui como uma breve dica espero que seja útil.

private function buscaDominio(email:String):String{
  var array:Array = email.split("@");
  
  if(array[1] != null){
    return array[1]
  }
  else{
    return "";
  }
}

Abraços, e até a próxima.

Web Services com Flex

Olá a todos. Neste post vou fala um pouco sobre umas das formas que o flex usa para comunicação com outras linguagens de programação, os web services. Irei mostrar somente como e feita a chamada pelo flex, usando o objeto WebService para realizar esta operação. Segue o codigo para análise:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
  <mx:Script>
    <![CDATA[
      import mx.controls.Alert;
      import mx.rpc.events.FaultEvent;
      import mx.rpc.events.ResultEvent;
      
      private function clickBotao():void{
        //chamada da operação do web service
        webService.getOperation("OperacaoWebService").send();
      }
      
      private function retornaWebService(evt:ResultEvent):void{
        //O retorno do seu web service deve ser tratado aqui
        trace(evt.result);  
      }
      
      private function erroWebService(erro:FaultEvent):void{
        Alert.show("Ocorreu um erro!");
      }
      
    ]]>
  </mx:Script>
  <mx:Button x="430" y="66" label="Botão" click="clickBotao();"/>
  <mx:WebService id="webService" wsdl="http://meudominio.com.br/MeuWebService.asmx?wsdl">
    <mx:operation name="OperacaoWebService" result="retornaWebService(event)" fault="erroWebService(event)"/> 
  </mx:WebService>
</mx:Application>

Logo a cima temos a classe WebService com uma operação chamada de “OperacaoWebService”, este nome será substituido pelo nome do web service desenvolvido. No exemplo não existe passagem de parâmetros, e o mesmo pode existir retorno ou não.

Neste exemplo é usado um web service asp net mas poderia ser usado um em php, jsp e outros. A implementação do web service não aparece no exemplo, ficando livre para futuras implementações.

Na prática ele servirá para buscar uma lista de objetos, retonar uma string ou mesmo chamar um procedimento simples sem parâmetros.

Tanto o erro quanto o retorno são tratados no objeto operation, e neste objeto também que podemos passar parâmetros caso necessário. Na hora da chamada do web service  basta colocar os dados no send. Segue o exemplo:

webService.getOperation("OperacaoWebService").send(“Nome”, “Endereco”, “CEP”);

Por hoje e só. Ate++

Upload de arquivos em Flex

Olá a todos, hoje venho falar um pouco sobre upload de arquivos no flex. O exemplo trata da primeira parte do trabalho, que e a captura do arquivo na maquina do cliente e o envio do arquivo através de uma requisição GET. No flex e necessário que uma outra página capture este arquivo e trate o mesmo, ela pode ser um pagina, jsp, php, aspx, ou alguma outra tecnologia que trabalhe com gerenciamento de arquivos WEB. Então vamos o código

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Script>
<![CDATA[

  private var arquivo:FileReference = new FileReference();

  private function onSelect(evt:Event):void {
    txtNomeArquivo.text = arquivo.name;
  }

  private function onUploadIoError(evt:IOErrorEvent):void {
    //Para erros no upload do arquivo tratar aqui.
  }

  private function onUploadSecurityError(evt:SecurityErrorEvent):void {
    //Para erros de segurança tratar aqui.
  }
]]>
</mx:Script>
<mx:Label x="337" y="136" text="Arquivo"/>
<mx:TextInput id="txtNomeArquivo" x="391" y="134" width="322"/>
<mx:Button x="391" y="164" label="Browser">
  <mx:click>
    <![CDATA[
      //Abre o browser para seleção do arquivo desejado.
      arquivo.addEventListener(Event.SELECT, onSelect);
      arquivo.addEventListener(IOErrorEvent.IO_ERROR, onUploadIoError);
      arquivo.addEventListener(SecurityErrorEvent.SECURITY_ERROR, onUploadSecurityError);

      var filtros:FileFilter = new FileFilter("Arquivos de Retorno *.txt; *.doc; *.docx; *.xls; *.xlsx",
                                              "*.txt; *.doc; *.docx; *.xls; *.xlsx");
      var array:Array = new Array(filtros);
      arquivo.browse(array);

    ]]>
  </mx:click>
</mx:Button>
<mx:Button x="472" y="164" label="Enviar">
  <mx:click>
    <![CDATA[
      //Envia o arquivo para Upload
       var sendVars:URLVariables = new URLVariables();
      sendVars.action = "upload";
      //aqui no sendVars poder ser passado mais de um variavel. 
      //Ex: sendVars.minhavariavel = "teste";

      //objeto usado para setar a pagina que receberá o arquivo
      var request:URLRequest = new URLRequest();
      request.data = sendVars;

      //e necessario uma pagina para receber o arquivo, ex: .php; .jsp; .aspx.
      //No caso foi usado um pagina de aspx .net.
      //A pagina deve receber o arquivo e tratá-lo.
      request.url = "http://meudominio.com.br/PaginaUpload.ashx";
      request.method = URLRequestMethod.GET; //requisição do tipo get

      //Aqui o objeto FileReference "arquivo" envia o arquivo que foi carregado 
                //com o nome de "NomeArquivo"
      //A pagina que reberá o arquivo deve este mesmo nome para manipula-lo
      arquivo.upload(request, "NomeArquivo");
    ]]>
  </mx:click>
</mx:Button>
</mx:Application>

No caso o trabalho de tramento do arquivo pode ser feito em uma tecnlogia de sua escolha, mas isto e tema para um outro post, por enquanto é só.

Ate++. Abraço a todos.

Image – Efeito de transição

Olá! Hoje vou falar um pouco sobre objetos personalizados, para quem já precisou de um menu feito de imagens ai vai o exemplo de um componente que pode ajudar.  Ao colocar uma imagem como menu uma das coisas que vem a cabeça seria, “quando eu passo o mouse sobre ele continua estatica”, não seria melhor se eu pudesse trocar a imagem e de quebra produzir um efeito de transição. Este foi o meu problema por estes dias, então achei um exemplo na net e fiz um adaptação nele.

O código abaixo e do componente que eu chamei de ImageMenu, com o efeito de transição já personalizado, ele trabalha com os states do Flex o que neste caso ajuda muito, este componente também usa o glow para criar um segundo efeito ao clicar na imagem. Para o glow, pode trocar a cor usada conforme a necessidade.

<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml"
 creationComplete="init()" creationPolicy="all" >

 <mx:Script>
 <![CDATA[
public var upImage:String; //Imagem padrão
 [Bindable]
public var overImage:String; //Imagem para efeito do mouse
public var fncClick:Function; //Função usada para o click do mouse
public var boEfeitoClick:Boolean = true;  //Flag para controle do efeito glow do click do mouse
private function init():void{
    up.source = upImage; //Coloca a imagem padrão 

    //Adicioniona os eventos a imagem
    addEventListener(MouseEvent.ROLL_OVER, mouseRollOver);
    addEventListener(MouseEvent.ROLL_OUT, mouseRollOut);
    addEventListener(MouseEvent.CLICK, mouseClick);

    //Executa o efeito ao iniciar.
    mouseRollOver(null);
    mouseRollOut(null);
}
private function mouseRollOver(e:MouseEvent):void{
 if(boEfeitoClick)
     currentState = 'overState';
    else
     currentState = 'overState2';
}
  private function mouseRollOut(e:MouseEvent):void{
    currentState = '';
}

private function mouseClick(e:MouseEvent):void{
 if(fncClick != null)
     fncClick();
}
 ]]>
</mx:Script>
<mx:Glow id="glowImage" duration="400"
    alphaFrom="1.0" alphaTo="0.3"
    blurXFrom="0.0" blurXTo="50.0"
    blurYFrom="0.0" blurYTo="50.0"
    color="0x8b9094"/>
<mx:Glow id="unglowImage" duration="400"
    alphaFrom="0.3" alphaTo="0.0"
    blurXFrom="50.0" blurXTo="0.0"
    blurYFrom="50.0" blurYTo="0.0"
    color="0x8b9094"/>
<mx:states>
 <!--O primeiro estado usa o efeito glow para o click no mouse-->
    <mx:State name="overState">
        <mx:RemoveChild target="{up}"/>
        <mx:AddChild relativeTo="{this}">
         <mx:Image source="{overImage}" id="imgOver"
           mouseDownEffect="{glowImage}"
           mouseUpEffect="{unglowImage}"/>
        </mx:AddChild>
    </mx:State>
    <!--No estado 2 não usa o efeito glow, o flag boEfeitoClick é que controla -->
    <mx:State name="overState2">
        <mx:RemoveChild target="{up}"/>
        <mx:AddChild relativeTo="{this}">
         <mx:Image source="{overImage}" id="imgOver2"/>
        </mx:AddChild>
    </mx:State>
</mx:states>
<!--Ao mudar de um estado para o outro executa o efeito de transição-->
<mx:transitions>
    <mx:Transition fromState="*" toState="overState">
     <mx:Fade duration="500" alphaFrom="0" alphaTo="1" target="{imgOver}"/>
    </mx:Transition>
    <mx:Transition fromState="overState" toState="*">
     <mx:Fade duration="200" alphaFrom="0" alphaTo="1" target="{up}"/>
    </mx:Transition>
     <mx:Transition fromState="*" toState="overState2">
     <mx:Fade duration="500" alphaFrom="0" alphaTo="1" target="{imgOver2}"/>
    </mx:Transition>
    <mx:Transition fromState="overState2" toState="*">
     <mx:Fade duration="200" alphaFrom="0" alphaTo="1" target="{up}"/>
    </mx:Transition>
 </mx:transitions>
  <!--Imagem usada para troca-->
<mx:Image id="up"/>
</mx:Canvas>

O código abaixo é um exemplo de como utilizar o componente:

<componentes:ImagemMenu id="imgNome" upImage="../imagens/ImagemPadrao.png"
     overImage="../imagens/ImagemMouseOver.png"
     fncClick="{imgNome_click}"/>

Por enquanto e só, até++.

Flex Builder 3 para Flash Builder 4 e Flex 4 SDK

Olá, para aqueles que ainda não tiveram a oportunidade de ver a ferramenta que é usada para desenvolver em Flex SDK, é o Flex Builder 3 e já está mudando de nome, agora irá se chamar Flash Builder 4 (codinome gumbo) já saiu o beta 1 do Flash Builder 4.

Hoje você que já desenvolve em Flex pode escolher usar Flex Builder 3 plugin no Eclipse ou o proprio console que trabalha em cima do Flex SDK 3 . A partir de agora o Flash Builder 4 poderá ser usado com plugin do Eclipse também e como console isolado trabalhando em cima do Flex 4 SDK, tudo parece uma jogada de marketing da Adobe, que quer promover o nome Flash Builder para o lado comercial ou seja este é pago, enquanto que o Flex 4 SDK continua a ser gratuito. Bem marketing a parte parece que a nova ferramenta tem bastante integração com outras ferramentas da Adobe, tal como o Flash, mais em especial o Flash Catalyst que e uma ferramenta para design de interfaces, o que parece ser um grande passo para separar designers de programadores.

Para aqueles que já usam o Flex Builder 3 como eu, já podem ir testando o Flash Builder Beta 1 é dar sua opinião para melhorá-lo, vou pesquisar um pouco mais e depois posto mais novidades, segue abaixo o link do projeto para exemplos, tutoriais e downloads:

http://labs.adobe.com/technologies/flashbuilder4/tutorials/

Passando parametros via post no Flex

Olá, para aqueles que estão acostumados com jsp, php, asp e bastante comum o uso de passagem de parâmetros via post, no caso do Flex  e mais comum o uso de web services, serviços http, e remote object. Estava criando um exemplo simples em Flex e não estava querendo usar o fluorine para integrar com o .net, até porque era uma página so, coisa muito simples, então acabei chegando em uma solução bem simples que lembra um pouco os tempos que eu trabalhava com jsp. Para aqueles que tem uma página que recebe parametros via post com este exemplo poderá usar o flex para realizar este procedimento.

Codigo Flex, chamada de uma página que recebe parametros via post:

private function chamaPaginaPost():void{
    var cabecalho:URLRequestHeader = new URLRequestHeader ("Content-type", "application/octet-stream");
    var url:String = "http://localhost/MinhaPagina.aspx";
    var requisicao:URLRequest = new URLRequest(url);

    var variaveis:URLVariables = new URLVariables();
    variaveis.codigo = 1;
    variaveis.nome = "José da Silva";

    requisicao.requestHeaders.push (cabecalho);
    requisicao.data = variaveis;
    navigateToURL(requisicao, "_blank");
}

Logo abaixo o exemplo da página aspx com C# que receber os parâmetros via post, esta pagina poderia ser em uma php, asp ou outra qualquer.

protected void Page_Load(object sender, EventArgs e)
{
    string codigo;
    string nome;

    try
    {
        codigo = Convert.ToString(Request.Params["codigo"]);
        nome = Convert.ToString(Request.Params["nome"]);

        Response.Write("Código: " + codigo + "<br/>");
        Response.Write("Nome: " + nome);
    }
    catch (Exception ex)
    {
       Response.Write("Erro" + ex.Message);
    }

}

Espero que tenha sido útil, até++.

Limpando componentes visuais em Flex

Olá a todos, uma das primeiras necessidades quando se desenvolve interfaces e um método genérico para limpar a tela. Este post trás uma classe genérica para limpar componentes visuais da tela, ela não tem todos os componentes visuais, mais pode ser adicionados novos componentes seguindo o modelo.

package
{
  import flash.display.DisplayObjectContainer;

  import mx.containers.Canvas;
  import mx.controls.CheckBox;
  import mx.controls.ComboBox;
  import mx.controls.DateField;
  import mx.controls.NumericStepper;
  import mx.controls.TextInput;

  public class LimpaTela
  {
    public function LimpaTela()
    {
    }

    public static function limparTela(obj:DisplayObjectContainer):void{
      for(var i:int=0;i<obj.numChildren;i++){
        if(obj.getChildAt(i) is TextInput){
          TextInput(obj.getChildAt(i)).text = "";
        }
        else if(obj.getChildAt(i) is CheckBox){
          CheckBox(obj.getChildAt(i)).selected = false;
        }
        else if(obj.getChildAt(i) is ComboBox){
          if(ComboBox(obj.getChildAt(i)).editable){
            ComboBox(obj.getChildAt(i)).text = "";
          }
          ComboBox(obj.getChildAt(i)).selectedIndex = -1;
        }
        else if(obj.getChildAt(i) is NumericStepper){
          NumericStepper(obj.getChildAt(i)).value = 0;
        }
        else if(obj.getChildAt(i) is DateField){
          DateField(obj.getChildAt(i)).text = "";
        }
        else if(obj.getChildAt(i) is Canvas){
          limparTela(Canvas(obj.getChildAt(i)));
        }
      }
    }

  }
}

Trata se de um método recursivo, ou seja ele chama ele mesmo no caso de componentes que possam ter outros componentes, este é o caso do ‘”Canvas” que serve como um container para se adicionar outros componentes. Na verdade o Canvas pode ser usado como uma tela, onde são colocados todos os componentes visuais que se deseja limpar e logo em seguida chama a função para limpar. Segue um exemplo de como se utilizar esta classe:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
   layout="absolute">
<mx:Script>
  <![CDATA[
    private function btnLimparTela_click():void{
      LimpaTela.limparTela(cnv);
    }
  ]]>
</mx:Script>

  <mx:Button id="btnLimpaTela" x="119" y="218" label="Limpar Tela"
    click="btnLimparTela_click();"/>
  <mx:Canvas id="cnv" x="10" y="10" width="200" height="200">
    <mx:TextInput x="20" y="10"/>
    <mx:ComboBox x="20" y="40">
    <mx:Array>
      <mx:String>Franca</mx:String>
      <mx:String>São Paulo</mx:String>
    </mx:Array>
    </mx:ComboBox>
  </mx:Canvas>
</mx:Application>

 
Até a proxima!

Alô Flex

Dando continuação ao post anterior falando um pouco sobre como codificar. O Flex usa tags padrão XML e Action Script. Um exemplo de uma tags padrão XML da biblioteca Flex 3 e o Button veja: <mx:Button x="470" y="159" label="Button"/>.

Para iniciar um exemplo Web bem simples, uma aplicação com um botão que dispara uma mensagem na tela. basica…

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">

    <mx:Script>

        <![CDATA[

            import mx.controls.Alert;

            private function btnExemplo_click():void{

                Alert.show("Alô Flex!");

            } 

        ]]>

    </mx:Script>

    <mx:Button id="btnExemplo" x="32" y="10" label="Meu Botão" click="btnExemplo_click();"/>

</mx:Application>

Application e o container para aplicações Web, ao criar um novo Flex Project no Flex Builder ele já gera automaticamente uma Application, o componente Button tem uma referencia no seu evento click para a função btnExemplo_click, que dispara a mensagem de alerta. Tudo que esta dentro da tag de Script e  programação em Action Script. Até a próxima.
 
 

Um pouco sobre Flex

Olá! Meu nome é Cristian Klauss, é com grande satisfação que me junto à este time para falar um pouco sobre desenvolvimento de sistemas. Trabalho já algum tempo com desenvolvimento e já usei algumas linguagens de programação tais como: Visual Basic 6, Java (Jsp), .Net (C#) e Flex. 

Hoje estou aqui para falar sobre o Flex, este post não vem a esgotar o conceito sobre o assunto, mais sim  dar uma visão geral.  Flex nada mais é do que  programação rica para internet (RIA), pode ser usado para a criação de sites, sistemas web e também para aplicações desktop (AIR),  para acesso à bancos de dados e necessário a utilização de uma linguagem auxiliar (back end), podendo ser C#, Java, PHP, Rubi dentre outras.

Atualmente na sua versão 3 o Flex vem crescendo gradativamente no mercado ganhado um espaço importante na chamada “WEB 2.0”. Uma da melhores ferramenta para desenvolvimento é o Flex Builder da Adobe, que também pode ser encontrado na versão plugin para Eclipse. Um dos pontos fortes da ferramenta é o conceito de Drag and Drop (arrastar e soltar).

Por enquanto é só, em breve estarei falando mais sobre o conceito Flex, e como utilizar esta ferramenta, um abraço a todos.