logo
  • Home
  • Acerca
  • Autores
  • Faq
  • Rede
  Twitter   Feed-me! RSS!
Ago 31

[Adobe Flex] Estilizando gráficos

Escrito por Gabriel Versallini em 1, 2.0, 2009, 3.5, 4, 6, Adobe, app, AR, Artigo, back, BI, Bindable, C#, class, código, collection, custom, DataProvider, event, events, Flex, git, Gráfico, ide, IE, if, image, layout, library, mg, MXML, O, on, pt, RIA, Ria’s Geral, S+S, spark, Stroke, UI, XML @ 08 31st, 2011 | via http://www.versallini.com.br | Sem comentários
Gabriel Versallini
? X
  • Bookmarks

Blinkbits BlinkLists BlogLines Blogmarks Buddymarks CiteULike Co.mments Del.icio.us Digg Diigo

Fark Feed Me Links Furl Google Linkagogo ma.gnolia Mister Wong Newsvine Propeller Rawsugar

Reddit Rojo Simpy Sphinn Spurl Squidoo StumbleUpon Tailrank Technorati Yahoo

More »

Olá, galera! Neste artigo mostraremos uma maneira simples de estilizar gráficos no Flex, acrescentando poucas linhas de código. Veja a seguir:




	
		

	
		
	

	
		
	

	

		
			
				
					
				
			
		

		
			
				
					
				
			
		

		
			
		

		
			
				
					
				
			
		

		
			
		

		

			
				
					
				
			

			
				
					
				
			

		

	


Veja o resultado:

Gostou? Caso queria estilizar um pouco mais dê uma olhada na biblioteca CustomChartLib desenvolvida por Erko Bridee.

Até a próxima!
Abraço

Jun 16

Flex com Multilinguagem (internacionalização)

Escrito por SamuelFacchinello em 1, 2.0, 2009, 4, 6, Adobe, Adobe Flex, app, AR, BI, Bindable, blog, Blogs, botão, C#, DataProvider, exemplo, Flex, fonte, for, framework, Frameworks, function, Google, html, ide, idiomas, IE, image, instalação, int, label, layout, library, Links, mg, MXML, O, on, opensource, PMP, pt, RIA, Ria’s Geral, S+S, SDK, spark, string, SVN, TAT, Tema, TextInput, UI, uint, Vários, XML @ 06 16th, 2011 | via http://desenvolvendoemflex.blogspot.com/ | Sem comentários
SamuelFacchinello
? X
  • Bookmarks

Blinkbits BlinkLists BlogLines Blogmarks Buddymarks CiteULike Co.mments Del.icio.us Digg Diigo

Fark Feed Me Links Furl Google Linkagogo ma.gnolia Mister Wong Newsvine Propeller Rawsugar

Reddit Rojo Simpy Sphinn Spurl Squidoo StumbleUpon Tailrank Technorati Yahoo

More »

Olá!!

Hoje vou mostrar como fazer um sistema Multilinguagem (alterando locales) no Flex. Conforme o exemplo:

*Para ver o fonte, clique com o botão direito do mouse e ViewSource.

Para isso você precisa ter os locales das linguagens. Os locales podem ser baixados nesses links:

  • 3.x (pt_BR)
  • 4.x (vários)

Estes locales devem ser colocados no diretório: “instalaçãodoflex/sdks/versaodosdk/frameworks/locale/”.

Configurando o projeto
Clique com o botão direito do mouse no projeto, vá em “properties” depois em “Flex Compiler”, em “Additional compiler arguments:” coloque o seguinte:
-locale en_US pt_BR -source-path+=../locale/locale


Ficando assim:

Após configurar o locale do seu projeto, você deve criar as pastas “projeto/locale/en_US” e “projeto/locale/pt_BR” e adicionar o arquivo “localization.properties” dentro de cada pasta.

en_US

label_selecione_linguagem=Select your language
label_nome=Name
label_sobrenome=Last Name
send_btn=Send

pt_BR

label_selecione_linguagem=Selecione a linguagem
label_nome=Nome
label_sobrenome=Sobrenome
send_btn=Enviar

Para ler estes arquivos faz assim:



    
        
    

    
        

    
  [ResourceBundle('localization')]
 

    
        
            
        

        
            
        

        
            
        

        
    

sendo a variável LOCALIZATION o nome do arquivo criado (pode ter vários).
para ler cada linha do arquivo utiliza-se:

resourceManager.getString(LOCALIZATION, 'string')

Por hoje é isso!!

Comente!

Jun 10

Variáveis Globais no Flex.

Escrito por SamuelFacchinello em 1, 2.0, 4, 6, Action Script, Adobe Flex, AR, arte, BI, Bindable, blog, Blogs, C#, class, classe, collection, exemplo, Flex, for, function, Google, if, LOB, mg, O, on, RIA, Ria’s Geral, S+S, TAT, Tema, UI, utils @ 06 10th, 2011 | via http://desenvolvendoemflex.blogspot.com/ | 1 comentário
SamuelFacchinello
? X
  • Bookmarks

Blinkbits BlinkLists BlogLines Blogmarks Buddymarks CiteULike Co.mments Del.icio.us Digg Diigo

Fark Feed Me Links Furl Google Linkagogo ma.gnolia Mister Wong Newsvine Propeller Rawsugar

Reddit Rojo Simpy Sphinn Spurl Squidoo StumbleUpon Tailrank Technorati Yahoo

More »

Olá.

Neste post vou mostrar como fazer com que uma (ou várias) variável seja utilizada e compartilhe o mesmo valor em toda a aplicação.

Para isto basta criar uma classe, com o método getInstance() e chamar esta classe em qualquer lugar do sistema através do getInstance(), e pronto você terá a mesma variável com o mesmo valor.

Classe de exemplo:

VariaveisGlobais.as

package com.blogspot.desenvolvendoemflex.utils
 import mx.collections.ArrayCollection;

    [Bindable]
    public class VariaveisGlobais
        private static var instance:VariaveisGlobais;

        public var variavel:ArrayCollection;

        public static function getInstance():VariaveisGlobais
            if (instance==null)
                instance = new VariaveisGlobais();

            return instance;
        }
    }
}

para utiliza-la basta instanciar desta maneira em qualquer parte de seu programa:

            [Bindable]
            public var varGlobal:VariaveisGlobais = VariaveisGlobais.getInstance();

Tenha cuidado ao utilizar desta forma, pois dependendo da quantidade de variáveis e informações, pode ficar pesado o sistema.

Por hoje é isso!

Até a próxima.

Comentem!!

Mai 28

TextArea com atalho para Desfazer e Refazer

Escrito por SamuelFacchinello em 1, 2.0, 4, 6, Adobe, Adobe Flex, AR, as2, BI, Bindable, blog, Blogs, botão, break, C#, case, class, código, código fonte, collection, Componente, control, Controls, Download, event, EventListener, Evento, events, flash, Flex, fonte, for, function, gestão, git, Google, html, IE, if, int, mg, O, on, padrão, RIA, Ria’s Geral, S+S, site, string, super(), Tema, tv, UI, utils @ 05 28th, 2011 | via http://desenvolvendoemflex.blogspot.com/ | Sem comentários
SamuelFacchinello
? X
  • Bookmarks

Blinkbits BlinkLists BlogLines Blogmarks Buddymarks CiteULike Co.mments Del.icio.us Digg Diigo

Fark Feed Me Links Furl Google Linkagogo ma.gnolia Mister Wong Newsvine Propeller Rawsugar

Reddit Rojo Simpy Sphinn Spurl Squidoo StumbleUpon Tailrank Technorati Yahoo

More »

Por padrão o componente TextArea do Flex não possui função de desfazer e refazer, com isso resolvi implementar estas duas funções.

Para testar é só digitar um texto, e pressionar Ctrl+Z para desfazer e Ctrl+Y para refazer.

*download do fonte: botão direito “View Source”

Código Fonte:

/*############################################################*/
/*                                                            */
/*   Powered by: Samuel Facchinello                           */
/*   http://desenvolvendoemflex.blogspot.com/                 */
/*                                                            */
/*############################################################*/
package com.blogspot.desenvolvendoemflex.utils
    import flash.events.Event;
    import flash.events.KeyboardEvent;

    import mx.collections.ArrayCollection;
    import mx.controls.Alert;
    import mx.controls.TextArea;

    /**
     *
     * @author SAMUEL FACCHINELLO
     * @site http://desenvolvendoemflex.blogspot.com/
     */
    public class TextAreaWithUndo extends TextArea 

        /**
         * Variable of control position Undo or Redo
         * */
        [Bindable]
        private var _position:int = -1;

        public function get position():int
            return _position;

        /**
         * Variable that stores all typed letters
         * */
        [Bindable]
        private var _array:ArrayCollection = new ArrayCollection();

        public function get array():ArrayCollection
            return _array;

        /**
         * Constructor
         *
         */
        public function TextAreaWithUndo()
            super();
            //add value default
            addValue("");

            //add Event on KeyDown
            addEventListener(KeyboardEvent.KEY_DOWN, myKeyDown);

        /**
         * Function with KeyDown
         * @param eventObj: KeyboardEvent
         *
         */
        private function myKeyDown(eventObj:KeyboardEvent):void
            // Was Ctrl key pressed?
            if (eventObj.ctrlKey)
                var valueReturn:String = null;

                switch (eventObj.keyCode) 

                    case 90: // Was Ctrl-Z pressed?
                        valueReturn = returnPrevisionValue();
                        break;

                    case 89: // Was Ctrl-Y pressed?
                        valueReturn = returnNextValue();
                        break;

                    default:
                        break;

                //if return exist
                if (valueReturn!=null)
                    //set text with return functions
                    text = valueReturn;

                    //select last _position in TextArea
                    setSelection(text.length, text.length);

            } else
                //only adds to the list if any of these characters.
                //list from here: http://help.adobe.com/en_US/AS2LCR/Flash_10.0/help.html?content=00000520.html
                if ((eventObj.keyCode>=65&&eventObj.keyCode<=90)
            }
        }

        /**
         * Function that adds the letters in the array
         * @param value: propertie "text" of TextArea
         *
         */
        private function addValue(value:String):void
            //it was press Ctrl + Z ever, and was entered some value, clears the values ??of the position in which this forward
            if (_array.length>0&&_array.length-1>_position)
                for (var i:int = _array.length-1; i>_position; i--)
                    _array.removeItemAt(i);

            }

            //if the value is being added is equal to the last added, not added!
            if (_array.length>0)
                if (value==_array.getItemAt(_array.length-1))
                    return;

            }

            _array.addItem(value);
            _position++;
        }

        /**
         * triggered when press Ctrl + Y
         * @return : Returns the next value from the list according to position
         *
         */
        private function returnNextValue():String
            if (_position+1>=0&&_position+1<_array.length)
                _position++;
                return _array.getItemAt(_position) as String;

            return null;
        }

        /**
         * triggered when press Ctrl + Z
         * @return : Returns the Prevision value from the list according to position
         *
         */
        private function returnPrevisionValue():String
            if (_position-1>=0)
                _position--;
                return _array.getItemAt(_position) as String;

            return null;
        }
    }
}

Adicionei este componente ao Google Code, pode ser visto aqui: http://code.google.com/p/textarea-with-undo/

Qualquer elogio, dúvida, sugestão ou melhoria para o componente, deixe um comentário!!

Abraço, até a próxima.

*Tradução para o inglês com o Google Translate. :)

Mai 19

10 coisas que um bom programador flex deve saber

Escrito por Daniel Schmitz em .NET, 1, 2.0, 2009, 3.5, 4, 6, action, Action Script, Actionscript, ActionScript 3, Actionscript 3.0, Actionscript3, Adobe, Air, api, Aplicativos, Apresentação, AR, Arquitetura, arte, Artigo, as3, BI, Bindable, blog, bug, builder 4, C#, Cairngorm, class, classe, classes, código, código fonte, Componente, Componentes, components, control, Controles, css, Curso, Cursos, custom, dados, Data Binding, DataGrid, Debug, demo, desempenho, Desenvolvedor, desenvolvedores, Design, developer, development, dispatch, dispatchEvent, DRE, empresas, err, Estilo, event, EventListener, Evento, Eventos, eventos customizados, events, Excel, explorer, Ferramenta, flash, flash builder, Flash Builder 4, Flash Player, Flex, Flex 3, Flex 4, Flex Examples, fonte, for, framework, Frameworks, Google, Gráfico, handle, html, HTTPService, ide, IE, if, int, interface, Java, layout, lista, live, Livro, lógica, map, Mate, MAX 2009, mvc, MXML, O, on, oop, opensource, Outros, player, polimorfismo, problema, problemas, programação, Projetos, pt, RIA, Ria’s Geral, ruby, S+S, site, skins, Sun, tag, TAT, Tech, Tecnologia, tv, UI, uint, utf8, Ved, Vídeo, vs, web, Webservice, XML, XP @ 05 19th, 2011 | via http://flex.etc.br | Sem comentários
Daniel Schmitz
? X
  • Bookmarks

Blinkbits BlinkLists BlogLines Blogmarks Buddymarks CiteULike Co.mments Del.icio.us Digg Diigo

Fark Feed Me Links Furl Google Linkagogo ma.gnolia Mister Wong Newsvine Propeller Rawsugar

Reddit Rojo Simpy Sphinn Spurl Squidoo StumbleUpon Tailrank Technorati Yahoo

More »

Esta é uma tradução do seguinte artigo: 10 Things A Good Flex Developer Should Know

Para ser um bom programador Flex é preciso mais que simplesmente saber como usar alguns componentes nativos do Flex. É preciso muito mais.

Aqui está minha contribuição sobre o assunto… juntamente com alguns recursos ou algumas palavras-chave que você poderá pesquisar facilmente através do Google.

Por favor, comente no blog se você achar que esqueci algo (o que é inevitável) ou se quiser sugerir alguns recursos interessantes que devo acrescentar.

1- Programação orientada a Objetos (OO)

O Flex se baseia na linguagem ActionScript3, que é totalmente orientada a objetos. Embora não seja um conceito fácil de aprender, programação orientada a objeto é um pré-requisito para aprender Flex. Se já possui experiência com OO (Java, C#, Ruby, etc), então você está pronto. Se não, você precisará pegar um livro sobre OO e começar a aprender o mais rápido possível.

· Head First Java (Java? Sim, Eu sei. Mas confie em mim.)

· Object-oriented programming with ActionScript 3.0

Nota: Alguns de vocês poderão perguntar – “O que são padrões de projetos?”. Vamos dar um passo de cada vez? Preocupe-se em entender classes e objetos, interfaces, herança, composição, polimorfismo, encapsulamento, etc. Só então considere estudar padrões de projetos. De fato, se eu escrever um post intitulado “10 coisas que um GRANDE programador Flex deve saber”, padrões de projeto estará nessa lista.

2- ActionScript/MXML

ActionScript é a linguagem de programação usada juntamente com MXML para criar aplicações Flex. MXML é uma linguagem de marcação baseada em XML. Cada tag MXML é mapeada diretamente para uma classe ActionScript correspondente. MXML é usado pelos desenvolvedores Flex principalmente para apresentar a interface do usuário, enquanto que, o ActionScript é usado para a lógica de negócio. Com exceções, é claro.

O Framework Flex inclui centenas de classes ActionScript e interfaces usadas para desenvolver aplicações Flex. Seu nível de habilidade como um desenvolvedor Flex está diretamente ligado ao seu conhecimento em relação ao ActionScript e MXML.

· Flex in a Week

· Tour De Flex

· Essential ActionScript 3.0

Nota: Fique ? vontade com a API do Flex. Como um desenvolvedor Flex, você vai usá-la diariamente.

3- Debugging

Boa parte do tempo de qualquer programador é gasto no debugging. Obviamente, é necessário debugar para rastrear a causa de bugs. No entanto, também é uma ótima maneira de conhecer o código fonte.

Felizmente, existem muitas ferramentas disponíveis para ajudá-lo com o trabalho de debugging. Invista algum tempo para aprender essas ferramentas. Seu investimento irá proporcionar retorno imediato.

· Flash Builder 4.5 Debugger

· De MonsterDebugger

· Kap Inspect

4- Programação orientada a eventos

Aplicações Flex são orientadas a eventos. Toda ação é o resultado de um evento assíncrono.

Como um desenvolvedor Flex, você deve saber como responder a eventos e como criar e disparar eventos. Para isso, é necessária uma sólida compreensão da arquitetura de eventos do Flex, incluindo familiaridade com os seguintes conceitos:

· Eventos nativos (Flash Player ou Framework de eventos Flex)

· Eventos customizados (Eventos criados pelo desenvolvedor, que estende a classe Event ou uma de suas subclasses)

· Disparar eventos, propagação de eventos (ver classe EventDispatcher e seu método dispatchEvent)

· Event listeners, event handlers (ver classe EventDispatcher e seus métodos addEventListener e removeEventListener)

· Fases do evento (capture, target & bubbling phases; target vs. currentTarget)

· Objetos do evento, tipos de eventos (ver classe Event e subclasses)

· Comportamento do evento default (ver classe Event e subclasses e seu método preventDefault)

5- Data binding

Aparentemente, data binding é um “no brainer”[1]. É só vincular o valor de uma propriedade ao valor de outra propriedade usando chaves. Quando o valor da propriedade de origem for alterado, o valor da propriedade de destino também é alterado.

No entanto, existe uma sobrecarga associada ao uso indiscriminado de data binding, podendo haver implicações no desempenho. Uma sólida compreensão de data binding ajudará a determinar quando é apropriado o seu uso e quando não é.

· Flex Tips – Using Bindable Metadata Events

· Michael Labriola’s presentation entitled Diving in the Data Binding Waters

6- Item renderers

Uma característica de uma aplicação Flex bem projetada é a apresentação dos dados de uma forma visualmente atraente. O Flex oferece uma série de controles baseados em listas (DataGrid, List, TileList, HorizontalList, etc) responsável pela apresentação dos dados. Portanto, pode-se personalizar a exibição dos dados com a ajuda de item renderers.

Você irá consumir muito tempo trabalhando com item renderers. Então é melhor saber bem como ele funciona.

· Flex Examples – Item Renderers in Practice

· A Deep Dive into Flex 4 Lists and Layouts

7- Acesso remoto a dados

Você conhece muitas aplicações que não interagem com os dados? Eu também não. Saiba como recuperar dados através de HTTPServive, WebService e RemoteObject. A arquitetura do framework Flex também poderá ajudá-lo com isso (ver #9).

· Retrieving and handling data with HTTPService

· Retrieving and handling data with WebService

· Retrieving and handling data with RemoteObject

8- Styling / Skinning

Não vamos nos esquecer que o Flex é uma tecnologia de interface e, como tal, certamente há expectativas em relação ao design. Como um desenvolvedor Flex, você deve ser capaz de personalizar a aparência de seus aplicativos usando estilos CSS, gráficos e/ou skins.

Com o Flex 4, não há mais desculpas. Use um pouco do seu tempo para conhecer de uma vez o lado direito do seu cérebro. É uma excelente mudança de paradigma, e vai ajudá-lo a diferenciar-se dos outros desenvolvedores Flex.

· Flex Style Explorer

· ScaleNine

· Introduction to Flex: Part 3 – Styles & Skins

9- Pelo menos um framework de arquitetura Flex

A maioria dos frameworks de arquitetura Flex impõe uma separação de camadas através da implementação do MVC (model-view-controller). Além disso, esses mesmos frameworks especificam como seu código deve ser organizado dentro do projeto Flex.

Embora muitos argumentariam que os frameworks são desnecessários, acredito que os desenvolvedores Flex se beneficiam em muitos aspectos da experiência de usá-los. Basta assistir ? s técnicas (boas ou más) empregadas por um framework para resolver problemas complexos de arquitetura. Isso contribuirá para seu crescimento como um desenvolvedor Flex.

Além disso, é difícil negar o fato de que a experiência com framework aumentará substancialmente o seu valor comercial como um desenvolvedor Flex. Jesse Warden me disse recentemente “Existem poucas empresas que não usam frameworks, mas isso é raro. Queiramos ou não, está na ‘moda’”. Eu concordo com Jesse.

· Cairngorm

· Parsley

· PureMVC

· Mate

· Swiz

· Robotlegs

10- Ciclo de vida de componentes e display list

Eu não estava convencido da necessidade de aprender o ciclo de vida de componentes Flex ou da display list até que escrevi o meu primeiro componente customizado (na verdade foi um componente semi-customizado que se estendia do componente Canvas). Até essa época eu usava componentes nativos do Flex, usando apenas o MXML enquanto que a display list era renderizada para mim. Em nenhuma vez tive que usar os métodos addChild, createChildren ou commitProperties, e usava o evento creatiomComplete para tudo.

Meu primeiro componente customizado usava uma quantidade enorme de eventos assíncronos, e eu não poderia prever a ordem em que cada evento seria disparado. Só depois que eu aprendi os métodos e variáveis do ciclo de vida dos componentes do Flex que eu pude ter um certo controle.

Estes métodos do ciclo de vida estão lá para serem usados. Saiba como funcionam e use-os para o seu benefício. Sua vida será mais fácil e você perderá menos cabelos.

· Colin Moock’s Lost ActionScript Weekend – The Display List

· Creating New Components in Flex 3

· Diving Deep with the Flex Component Lifecycle

· Understanding the Flex 3 Component and Framework Lifecycle


[1] Expressão americana usada para algo que requer pouco esforço mental ou inteligência para realizar ou compreender

Mai 11

Flash Builder DataGrid DragEvent

Escrito por Felipe Borella em 1, 2.0, 2009, 4, 6, Adobe, app, AR, back, bar, BI, Bindable, C#, class, collection, control, Controls, DataGrid, DataProvider, event, events, exemplo, Flex, fonte, fonts, for, function, handle, html, ide, IE, if, int, label, library, Links, MXML, Number, O, on, Pessoal, pt, Ria’s Geral, S+S, spark, string, tag, TAT, web, web 2.0, XML, XP @ 05 11th, 2011 | via http://www.fborella.com.br/blog/ | Sem comentários
Felipe Borella
? X
  • Bookmarks

Blinkbits BlinkLists BlogLines Blogmarks Buddymarks CiteULike Co.mments Del.icio.us Digg Diigo

Fark Feed Me Links Furl Google Linkagogo ma.gnolia Mister Wong Newsvine Propeller Rawsugar

Reddit Rojo Simpy Sphinn Spurl Squidoo StumbleUpon Tailrank Technorati Yahoo

More »

Olá pessoal beleza?

Pois é em ritmo de AudiCup.
Eis que então o pessoal da Audi entrou em contato comigo essa semana para fazer algo em Web 2.0 para cadastrar os times que irão participar da AudiCup.

Segue os links abaixo:
http://www.audi.com/com/brand/en/experience/sponsoring/sportsponsoring/the_audi_cup_2011.html
http://www.audi.com/com/brand/en/experience/sponsoring/sportsponsoring/the_audi_cup_2011/schedule_and_tickets.html

Inter , estaremos contigo ..
Tu és minha paixão !
Não importa o que digam
Sempre levarei comigo
Minha camisa vermelha ..
e a cachaça na mão
O Gigante me espera ..
Para começar a festa !

O exemplo é mais ou menos o que esta abaixo:

Veja o Fonte é simples:

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"
			   creationComplete="application1_creationCompleteHandler(event)">
	<fx:Declarations>

	fx:Declarations>
	<fx:Script>
		[CDATA[
			import mx.collections.ArrayCollection;
			import mx.events.CloseEvent;
			import mx.controls.Alert;
			import mx.events.DragEvent;
			import mx.events.FlexEvent;
			import mx.managers.DragManager;

			[Bindable]
			private var time:Time;

			[Bindable]
			private var times:ArrayCollection;			

			[Bindable]
			private var timesConvocados:ArrayCollection=new ArrayCollection();

			private function onDrop(event:DragEvent):void 
				if(event.dragSource.formats.toString() == "items,itemsByIndex,caretIndex") 
					var dragList:Array = event.dragSource.dataForFormat('items') as Array;
					var draggedTimes:Time = dragList[0] as Time;

					if(draggedTimes.fifa == 'N') 
						Alert.show("Não foi possível adicionar este time!nn"+draggedTimes.nome+" não tem mundial de Clubes FIFA!", "AudiCup");
						event.preventDefault();
						event.target.hideDropFeedback(event);
						DragManager.showFeedback(DragManager.NONE);
					
				}
			}	

			protected function application1_creationCompleteHandler(event:FlexEvent):void
			
				times=new ArrayCollection();
				time=new Time();
				time.id=1;
				time.nome="FC Barcelona";
				time.fifa="S";
				times.addItem(time);

				time=new Time();
				time.id=2;
				time.nome="SC Internacional de Porto Alegre";
				time.fifa="S";
				times.addItem(time);

				time=new Time();
				time.id=3;
				time.nome="FC Bayern";
				time.fifa="S";
				times.addItem(time);

				time=new Time();
				time.id=4;
				time.nome="AC Milan";
				time.fifa="S";
				times.addItem(time);

				time=new Time();
				time.id=5;
				time.nome="Grêmio de Porto Alegre";
				time.fifa="N";
				times.addItem(time);

				time=new Time();
				time.id=6;
				time.nome="SC Juventude de Caxias do Sul";
				time.fifa="N";
				times.addItem(time);
			

		]]>
	fx:Script>
	<s:Label x="10" y="10" fontSize="14" fontWeight="bold" text="Audi Cup 2011 Meet the best"/>

	<mx:DataGrid x="10" y="32" width="250" height="200" dataProvider="times"
				dragEnabled="true" dragMoveEnabled="true" dropEnabled="true">
		<mx:columns>
			<mx:DataGridColumn dataField="nome" headerText="Times Disponíveis"/>
		mx:columns>
	mx:DataGrid>

	<mx:DataGrid x="268" y="32" width="250" height="200" dataProvider="timesConvocados"
				 dragEnabled="true" dragMoveEnabled="true" dropEnabled="true" dragDrop="onDrop(event);">
		<mx:columns>
			<mx:DataGridColumn dataField="nome" headerText="Convoque você mesmo - Arraste"/>
		mx:columns>
	mx:DataGrid>
s:Application>
package

	[Bindable]
	public class Time
	
		public var id:Number;
		public var nome:String;
		public var fifa:String;

		public function Time()
		
		
	}
}

Felipe Borella.

Abr 7

ArrayCollection XML FileReference Flex

Escrito por Felipe Borella em 1, 4, 6, Adobe, app, AR, back, BI, Bindable, carregar, collection, control, Controls, dados, DataGrid, DataProvider, encode, encoder, err, erro, error, eval, event, EventListener, Evento, falha, filter, Flex, fonte, for, function, git, ide, IE, label, layout, lista, MXML, O, on, pt, reference, RIA, Ria’s Geral, RoR, string, tag, TAT, Tema, UI, utils, Ved, XML, XP @ 04 7th, 2011 | via http://www.fborella.com.br/blog/ | Sem comentários
Felipe Borella
? X
  • Bookmarks

Blinkbits BlinkLists BlogLines Blogmarks Buddymarks CiteULike Co.mments Del.icio.us Digg Diigo

Fark Feed Me Links Furl Google Linkagogo ma.gnolia Mister Wong Newsvine Propeller Rawsugar

Reddit Rojo Simpy Sphinn Spurl Squidoo StumbleUpon Tailrank Technorati Yahoo

More »

Opa.

Resolvi criar este post pois ja havia feito isso para trabalho de faculdade, então, compratilhando o conhecimento adquirido.

Segue abaixo aplicação e os fonte com as explicações:
Clique em Listar e depois salvar.

xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
	backgroundColor="white">
?
	<mx:Script>
		[CDATA[
			import mx.rpc.xml.SimpleXMLEncoder;
			import mx.utils.ObjectUtil;
			import mx.controls.Alert;
			import mx.collections.ArrayCollection;
?
			private var fr:FileReference;
			private static const FILE_TYPES:Array=[new FileFilter("Arquivo XML", "*.xml")];
			private static const DEFAULT_FILE_NAME:String="trabalho.xml";
			[Bindable]
			public var arr:ArrayCollection=new ArrayCollection(
					[{id:1, nome:"Felipe Borella", cidade:"Marau"},
					{id:2, nome:"Mario Junior", cidade:"Rio de Janeiro"},
					{id:3, nome:"Bãrdei Futebol Clube", cidade:"Marau"},
					{id:4, nome:"Janderson Futebol Clube", cidade:"Rio de Janeiro"}]);
?
			private function iniciar():void
			{
				var xml:XML=objectToXML(arr.source);
				txt1.text=ObjectUtil.toString(arr.source);
				txt2.text=xml.toXMLString();
			}
?
?
			private function objectToXML(obj:Object):XML
			{
				var qName:QName=new QName("pessoa");
				var xmlDocument:XMLDocument=new XMLDocument();
				var simpleXMLEncoder:SimpleXMLEncoder=new SimpleXMLEncoder(xmlDocument);
				var xmlNode:XMLNode=simpleXMLEncoder.encodeValue(obj, qName, xmlDocument);
				var xml:XML=new XML(xmlDocument.toString());
				trace(xml.toXMLString());
				return xml;
			}
?
			private function onLoadFileClick():void
			{
				//cria a instancia do FileReference
				fr=new FileReference();
				//adiciona o evento para a escuta quando o arquivo for selecionado 
				fr.addEventListener(Event.SELECT, onFileSelect);
				//adiciona o evento para a escuta quando o arquivo for cancelado
				fr.addEventListener(Event.CANCEL, onCancel);
				//abri somente arquivos XML
				fr.browse(FILE_TYPES);
			}
?
			//chamado quando o usuario seleciona o arquivo
			private function onFileSelect(e:Event):void
			{
				//quando o arquivo for carregado dispara a escuta da funcao onLoadComplete
				fr.addEventListener(Event.COMPLETE, onLoadComplete);
				// adiciona a escuta quando acontece erro ao carregar arquivo
				fr.addEventListener(IOErrorEvent.IO_ERROR, onLoadError);
				//carrega o conteudo do arquivo
				fr.load();
			}
?
			//Chamado quando o usuario cancela
			private function onCancel(e:Event):void
			{
				trace("File Browse Canceled");
				fr=null;
			}
?
			//chama completa o arquivo carregado
			private function onLoadComplete(e:Event):void
			{
				//recupera os dados do arquivo como um byte array
				var data:ByteArray=fr.data;
				//le o arquivo como uma string e coloca em um text area
				txt2.text=data.readUTFBytes(data.bytesAvailable);
				//limpa a instancia do arquivo tipo filereference
				fr=null;
			}
?
			//quando ocorrer erros ao carregar
			private function onLoadError(e:IOErrorEvent):void
			{
				trace("Error loading file : " + e.text);
			}
?
			//chamadoquando o usuario digita no textarea
			private function onInputChange():void
			{
				//habilita o botao se ha texto para salvar
				saveButton.enabled=(txt2.text.length > 0);
			}
?
			//chamado quando o usuario clica o botao de carregar
			private function onSaveClick():void
			{
				//criando instancia de File Reference
				fr=new FileReference();
?
				//escuta para falha quando foi salvo
				fr.addEventListener(Event.COMPLETE, onFileSave);
?
				//escuta  para quando cancelar
				fr.addEventListener(Event.CANCEL, onCancel);
?
				//escuta para quando ha erros no salvar
				fr.addEventListener(IOErrorEvent.IO_ERROR, onSaveError);
?
				//abre a caixa para saber onde salvar o XML usando o nome default
				fr.save('n'+txt2.text, DEFAULT_FILE_NAME);
			}
?
			//chamado quando o arquivo for salvo
			private function onFileSave(e:Event):void
			{
				trace("File Saved");
				fr=null;
				Alert.show('Salvo com sucesso');
			}
?
			//chamado se o usuario cancela a caixa de dialogo
			private function onCance2l(e:Event):void
			{
				Alert.show('Arquivo cancelado', 'Sistema');
				fr=null;
			}
?
			//chamado se ocorrer erro enquanto salva o arquivo
			private function onSaveError(e:IOErrorEvent):void
			{
				Alert.show('Erro '+ e.text);
				fr=null;
			}
		]]>
	mx:Script>
?
	<mx:DataGrid x="10" y="10" dataProvider="{arr}" width="299">
		<mx:columns>
			<mx:DataGridColumn headerText="Nome" dataField="nome"/>
			<mx:DataGridColumn headerText="Cidade" dataField="cidade"/>
		mx:columns>
	mx:DataGrid>
	<mx:Button id="saveButton" x="412" y="130" label="Salvar" click="onSaveClick()"/>
	<mx:TextArea id="txt1" x="10" y="175" width="228" height="231" editable="false"/>
	<mx:TextArea id="txt2" x="246" y="175" width="228" height="231" editable="false"/>
	<mx:Button x="346" y="130" label="Listar" click="iniciar()"/>
?
mx:Application>

Valeu ai!

Felipe
Marau-RS

Mar 11

States Flash Builder

Escrito por Felipe Borella em 1, 2009, 4, 6, Adobe, app, AR, BI, Bindable, collection, Componente, DataProvider, event, events, exemplo, flash, flash builder, Flex, Flex 3, for, function, handle, html, ide, IE, if, Iniciando, label, library, mudanças, MXML, O, on, Pessoal, problema, problemas, pt, Ria’s Geral, spark, state, TAT, TextInput, UI, XML @ 03 11th, 2011 | via http://www.fborella.com.br/blog/ | Sem comentários
Felipe Borella
? X
  • Bookmarks

Blinkbits BlinkLists BlogLines Blogmarks Buddymarks CiteULike Co.mments Del.icio.us Digg Diigo

Fark Feed Me Links Furl Google Linkagogo ma.gnolia Mister Wong Newsvine Propeller Rawsugar

Reddit Rojo Simpy Sphinn Spurl Squidoo StumbleUpon Tailrank Technorati Yahoo

More »

Dae pessoal.

Estou iniciando ainda no FX4 ou Flash Builder como queiram, então tenho minhas dificuldades ainda, mas é muito bom o resultado que estou vendo. Esse dias me deparei com alguns problemas com states que no Flex 3 eu fzia algo do tipo:

Fx3

<mx:State name="logonState">
	<mx:SetProperty target="{textInputNome}" name="visible" value="true" />

Bom as mudanças para o FX4 foram muitas onde no próprio componente adicionamos essas propriedades.
Logo no inicio fiquei de cara achava mais dificil sei la, mas achei que é algo que melhorou muito, ou seja,
sim ficou melhor ja me acostumei e achei mais “clean” o negocio.

veja o exemplo que fiz abaixo:
FX4

e o Codigo fica esse

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"
			   currentState="state1" viewSourceURL="srcview/index.html">
	<fx:Declarations>
?
	fx:Declarations>
	<fx:Script>
		[CDATA[
			import mx.collections.ArrayCollection;
?
			import spark.events.IndexChangeEvent;
			[Bindable]
			private var arrayCollection:ArrayCollection=new ArrayCollection([
				{prop:'state1'},{prop:'state2'}]);
?
?
?
?
			protected function comboBox_changeHandler(event:IndexChangeEvent):void
			{
				this.currentState=comboBox.selectedItem.prop;
			}
?
		]]>
	fx:Script>
	<s:states>
		<s:State name="state1"/>
		<s:State name="state2"/>
	s:states>
	<mx:Form>
		<mx:FormItem>
			<s:TextInput id="textInput1" text.state1="FELIPE" text.state2="BORELLA"/>
		mx:FormItem>
		<mx:FormItem>
			<s:TextInput id="textInput2" text.state1="BORELLA" text.state2="FELIPE"/>
		mx:FormItem>
		<mx:FormItem>
			<s:ComboBox id="comboBox" labelField="prop" dataProvider="{arrayCollection}"
						change="comboBox_changeHandler(event)" selectedIndex="0"/>
		mx:FormItem>
	mx:Form>
s:Application>

Felipe!

Fev 27

Two-way Data Binding – Flex 4 – Problema de Conversão de Tipo

Escrito por DClick Team em 1, 4, 6, action, Actionscript, app, AR, BI, Bindable, blog, class, classe, Componente, components, Data Binding, Download, err, erro, exemplo, Flex, Flex Components, function, IE, if, image, isNaN, mg, NaN, Number, O, on, problema, problemas, pt, RIA, Ria’s Geral, RoR, spark, string, TAT, TextInput, Twitter, Two-way Data Binding, UI @ 02 27th, 2011 | via http://blog.dclick.com.br/pt/ | Sem comentários
DClick Team
? X
  • Bookmarks

Blinkbits BlinkLists BlogLines Blogmarks Buddymarks CiteULike Co.mments Del.icio.us Digg Diigo

Fark Feed Me Links Furl Google Linkagogo ma.gnolia Mister Wong Newsvine Propeller Rawsugar

Reddit Rojo Simpy Sphinn Spurl Squidoo StumbleUpon Tailrank Technorati Yahoo

More »

post) em um projeto, deve ter caído em problemas de conversão de tipo, como mostrado pela imagem abaixo:

Esse erro acontece por que estamos tentando fazer 2 operações:

  • 1. Atribuir o valor de user.id (Number) a proriedade text (String)
  • 2. Atribuir o valor de text (String) a proriedade user.id (Number)

A primeira operação funciona muito bem, pois a classe Number tem o método toString() que é chamado toda vez que fazemos esse tipo atribuição. Nosso problema está com o item 2, onde estamos tentando atribuir uma String a uma propriedade Number.

Para resolver essa situação eu criei a classe NumberInput que extende a classe TextInput do spark, e funciona com um wrapper para a propriedade text do TextInput, o source do novo componente é simples e fica assim:

PLAIN TEXT
ACTIONSCRIPT:

  1. package br.com.dclick.components
  2. {
  3. ? ?
  4. ? ? import spark.components.TextInput;
  5. ? ?
  6. ? ? public class NumberInput extends TextInput
  7. ? ? {
  8. ? ? ? ? public function NumberInput()
  9. ? ? ? ? {
  10. ? ? ? ? ? ? super();
  11. ? ? ? ? }
  12. ? ? ? ?
  13. ? ? ? ? [Bindable("change")]
  14. ? ? ? ? [Bindable("textChanged")]
  15. ? ? ? ? public function get textNumber():Number
  16. ? ? ? ? {
  17. ? ? ? ? ? ? return Number(text);
  18. ? ? ? ? }
  19. ? ? ? ?
  20. ? ? ? ? public function set textNumber(value:Number):void
  21. ? ? ? ? {
  22. ? ? ? ? ? ? text = isNaN(value)?“”:value.toString();
  23. ? ? ? ? }
  24. ? ? }
  25. }

Quando aplicamos o novo componente, o erro some do projeto e conseguimos compilar:

Abaixo segue o exemplo funcional:

Para fazer o download da biblioteca que contém o NumberInput, clique aqui.

Fev 16

Flex tip: Creating a self-close Alert

Escrito por Pablo Souza em 1, 2009, Adobe, app, AR, auto, BI, Bindable, control, Controls, demo, event, EventListener, Flex, function, handle, if, label, library, MXML, Number, O, on, pt, Ria’s Geral, spark, Ved, window, XML @ 02 16th, 2011 | via http://rectius.com.br/blog | Sem comentários
Pablo Souza
? X
  • Bookmarks

Blinkbits BlinkLists BlogLines Blogmarks Buddymarks CiteULike Co.mments Del.icio.us Digg Diigo

Fark Feed Me Links Furl Google Linkagogo ma.gnolia Mister Wong Newsvine Propeller Rawsugar

Reddit Rojo Simpy Sphinn Spurl Squidoo StumbleUpon Tailrank Technorati Yahoo

More »

In the last days I’ve received a lot of questions about how to automatically close a popup window after a certain period of time. In order to demonstrate it let’s implementing a Flex alert that will be self-closed after 5 seconds. Check the code after the jump:

<?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">
<fx:Script>
	[CDATA[
	import mx.controls.Alert;
	import mx.managers.PopUpManager;
?
	private var notificatorTimer:Timer;
	private var myAlert:Alert;
?
	[Bindable]
	public var timeDestroy:Number = 5000;
?
?
	private function startTimer(event:MouseEvent):void
	{
		notificatorTimer = new Timer(timeDestroy, 1);
		notificatorTimer.addEventListener(
			TimerEvent.TIMER_COMPLETE,
			remove_handler);
		notificatorTimer.start();
		myAlert = Alert.show(
			"Wait, I'm gonna be closed after 5 sec ...",
			"MyAlert");
	}
?
?
	private function remove_handler(event:TimerEvent):void
	{
		PopUpManager.removePopUp(myAlert);
	}
?
	]]>
fx:Script>
?
<s:Button label="Abrir Alert"
		  click="startTimer(event)" />
?
s:Application>

Hope you enjoy it!

« Entradas anteriores |

ACERCA

O que é o RedeRIA ?

O redeRIA não é nada mais que um agregador de feed's que disponibiliza o conteudo de varios blogs e autores ao redor do mundo RIA, actualmente agregamos mais de 2795 entradas vindas de 53 blogs especializados em ria’s, pelo que só fica a ganhar em assinar o feed ou seguir a comunidade no twitter.

Se acha que o seu blog ou um blog de um amigo é interessante e util para os leitores o redeRIA, faça a sua submissão aqui.

Feed: assine já
Twitter: siga-nos

GOOGLE

Votação


Deveria o RedeRia agregar conteúdo em inglês?
Ver Resultados

AUTORES


Eduardo KrausAlexandre TadashiBindableCognitiva SoluçõesDaniel LopesDaniel SchmitzDanielPedrinhaDClick TeamEbercomEdgard DavidsonElvis FernandesErko BrideeFabiel PrestesFábio Batista da SilvaFabio da SilvaFabriccio BernardesFelipe BorellaFlavia MoreiraGabriel VersalliniGabriela T. PerryIgor MusardoJanderson CardosoJoão AugustoJose Carlos FielKelps SousaLeonardo FrançaLucas MarçalLuis MessiasLuiz TarabalMario JuniorMário SantosMauro MartinsPablo SouzaPedro ClaudioreneRia BrazilriaPTRicardo CerqueiraRobson FernandesRodrigo Pereira FragaSaintBrSamuelFacchinelloSergio SouzaSilva DeveloperStefan HorochovecTech CaffeTecinforThiago BuenoVedVinícius SandimWillian ManoXAML Cast

PUBLICIDADE








Powered by Wordpress & msdevstudio.com