AS 2.0/ Flash

Flash com Windows Mobile 2005

Hoje pela manhã passei testando como usar Flex em Pocket PC, porém devido a grande volume de classe e a nova arquetetura do Flash Player ser AVM 1,2 o formato em si do SWF não consegue ser executado.

O aplicativo que eu usei para criar os .cab para o Windows Mobile 2005 foi o Multidmedia Zinc Pocket Edition v2.

De acordo com o site do Fabricante os únicos formatos aceitos são 4,5,6 e 7. Então com Flex 2.0 não vai rolar, mas com Flex 1.5 com certeza vai funcionar. Quem tiver o Flex 1.5 e compilar e jogar dentro do Zinc Pocket vai conseguir funcionar. Outra alternativa é Posso usar o SWF formato 7 para passar parametros para o meu Flex 2.0? Sim eu consegui fazer funcionar com localconnection.

Segue o screenshot para uso do Pocket com o Flash 8 com formato SWF 7.

Flex

Fotos do Webday + Flex = sucesso!

A palestra no encontro de hoje na Imprensa Oficial, foi muito bom Álvaro complementou sobre o uso das ferramentas Adobe para o mercado e geração de novos negócios com breve introdução ao Adobe Flex 2.0 e eu apresentei como fazer grandes ferramentas RIA usando o Flex 2.0 em poucos minutos.
Como tinhamos que também dá prioridade para os outros palestrantes o tempo foi bem curso, na ocasião apresentei como fazer um Editor para CMS em poucos minutos.
O pessoal ficou muito empolgado com o Flex 2.0 e me senti como dever cumprido ao representar tão bem o Adobe Flex 2.0 para a comunidade das repartições do estado.

Bom para quem quer conferir as fotos, aqui vai um link, Como sabem Adoro o Google Picasa, fantástico. Clique aqui para ver as fotos.

Notícias

Webday hoje a tarde

Hoje a tarde estarei no encontro de quem faz acontecer a internet para o governo do estado de São Paulo. Estarei junto com Álvaro para palestrar sobre o uso do Flex para novos negócios e também seu uso em Intranet e Extranet.

Várias outras empresas estarão presentes, estarei postando detalhes do evento durante o dia.

Mais informações sobre o Webday, pode clicar aqui

AS 3.0/ Flex

TabNavigator com Botão de fechar, drag e drop habilitados

hahaha

Sajid é realmente um animal, ele é um dos engenheiros do Flex Team na India e em seu blog ele posta várias possibilidades de extender os componentes. Darron fez até um porém não liberou o código fonte, ele enquanto eu descia as escadas para tomar café ele fez esse exemplo e publicou em seu site.

Check this out. Sajid you are insane man.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
package sjd.controls{
 
  import flash.events.MouseEvent;
  import flash.display.DisplayObject;
 
  import mx.core.DragSource;
  import mx.core.IUIComponent;
  import mx.containers.TabNavigator;
  import mx.controls.tabBarClasses.Tab;
  import mx.controls.Button;
  import mx.controls.TabBar;
  import mx.events.FlexEvent;
  import mx.events.DragEvent;
  import mx.managers.DragManager;
 
  /**
   * @class AdvanceTabNavigator
   * @brief A New TabNavigator with Drag/Drop Enabled and Close Button
   * @author Jove
   * @version 1.0
   */
   public class AdvanceTabNavigator extends TabNavigator  {
 
    [Embed(source="assets/WindowCloseButton.gif")]
    private var windowCloseButtonImg:Class;
    [Embed(source="assets/WindowCloseButton2.gif")]
    private var windowCloseButtonImg2:Class;
 
    protected var tabCloseButton:Button = new Button();
    protected var currentTab:Tab;
 
    private var _tabDragEnable:Boolean = false;
    private var _tabCloseEnable:Boolean = false;
 
    public function set tabDragEnable(enable:Boolean):void{
      this._tabDragEnable = enable;
      enableTabDrag(enable);
    }
 
    public function get tabDragEnable():Boolean{
       return this._tabDragEnable;
    }
 
    public function set tabCloseEnable(enable:Boolean):void{
      this._tabCloseEnable = enable;
      enableButton(enable);
    }
 
    public function get tabCloseEnable():Boolean{
       return this._tabCloseEnable;
    }
 
    public function AdvanceTabNavigator(){
      super();
      this.addEventListener(FlexEvent.CREATION_COMPLETE, buildButton);
    }
 
    protected function buildButton(enable:Boolean):void{
      tabCloseButton.width=10;
      tabCloseButton.height=10;
      tabCloseButton.focusEnabled=false;
      tabCloseButton.setStyle("upSkin", windowCloseButtonImg);
      tabCloseButton.setStyle("overSkin", windowCloseButtonImg2);
      tabCloseButton.setStyle("downSkin", windowCloseButtonImg2);
      tabCloseButton.visible = false;
      rawChildren.addChild(tabCloseButton);
    }
 
    protected function enableButton(enable:Boolean):void{
      if(enable){
        this.addEventListener(MouseEvent.MOUSE_OVER, addCloseButton);
        tabCloseButton.addEventListener(MouseEvent.CLICK, tabCloseButton_clickHandler);
      }else{
        this.removeEventListener(MouseEvent.MOUSE_OVER, addCloseButton);
        tabCloseButton.removeEventListener(MouseEvent.CLICK, tabCloseButton_clickHandler);
      }
    }
 
    protected function enableTabDrag(enable:Boolean):void{
      if(enable){
        this.addEventListener(MouseEvent.MOUSE_MOVE, moveTab);
        tabBar.addEventListener(DragEvent.DRAG_ENTER, doDragEnter);
        tabBar.addEventListener(DragEvent.DRAG_DROP, doDragDrop);
        tabBar.addEventListener(DragEvent.DRAG_OVER, doDragOver);
        tabBar.addEventListener(DragEvent.DRAG_EXIT, doDragExit);
      }else{
        this.removeEventListener(MouseEvent.MOUSE_MOVE, moveTab);
        tabBar.removeEventListener(DragEvent.DRAG_ENTER, doDragEnter);
        tabBar.removeEventListener(DragEvent.DRAG_DROP, doDragDrop);
        tabBar.removeEventListener(DragEvent.DRAG_OVER, doDragOver);
        tabBar.removeEventListener(DragEvent.DRAG_EXIT, doDragExit);
      }
    }
 
    protected function addCloseButton(event:MouseEvent):void{
      if(event.target != currentTab && event.target != tabCloseButton ){
        tabCloseButton.visible = false;
      }
      if(event.target is Tab && !DragManager.isDragging){
        currentTab= Tab(event.target);
        tabCloseButton.x = currentTab.x + currentTab.width - 14;
        tabCloseButton.y = currentTab.y + ( currentTab.height - 10 ) / 2;
        tabCloseButton.visible = true;
      }
    }
 
    protected function tabCloseButton_clickHandler(event:MouseEvent):void{
      removeChildAt(tabBar.getChildIndex(currentTab));
      tabCloseButton.visible = false;
     }
 
     protected function moveTab(event:MouseEvent):void{
      if(event.target is Tab){
        var dragInitiator:Tab=Tab(event.target);
        var ds:DragSource = new DragSource();
        var tabProxy:Tab = new Tab();
        tabProxy.label = dragInitiator.label;
        DragManager.doDrag(dragInitiator, ds, event, tabProxy);
      }
     }
 
     protected function doDragEnter(event:DragEvent):void {
   if(tabBar.getChildIndex(DisplayObject(event.dragInitiator)) >= 0){
     var dropTarget:IUIComponent=IUIComponent(event.currentTarget);
     DragManager.acceptDragDrop(dropTarget);
   }
 }
 
 protected function doDragOver(event:DragEvent):void {
   if(tabBar.getChildIndex(DisplayObject(event.dragInitiator)) >= 0){
     tabCloseButton.visible = false;
     var dragX:Number = tabBar.mouseX;
     var targetTabIndex:Number = -1;
     for(var i:Number = 0; i < tabBar.getChildren().length; i++){
       if(dragX < tabBar.getChildAt(i).x){
         targetTabIndex = i;
         tabBar.graphics.clear();
            tabBar.graphics.beginFill(0x000000);
            tabBar.graphics.lineStyle(0, 0x000000);
            tabBar.graphics.drawRect(
                      tabBar.getChildAt(targetTabIndex).x - 2,
                      2,
                      1,
                      tabBar.getChildAt(targetTabIndex).height - 3);
            tabBar.graphics.endFill();
         break;
       }
     }
     if(targetTabIndex < 0
       && dragX > tabBar.getChildAt(tabBar.getChildren().length - 1).x
       && dragX < tabBar.getChildAt(tabBar.getChildren().length - 1).x + tabBar.getChildAt(tabBar.getChildren().length - 1).width){
       targetTabIndex = tabBar.getChildren().length;
       tabBar.graphics.clear();
          tabBar.graphics.beginFill(0x000000);
          tabBar.graphics.lineStyle(0, 0x000000);
          tabBar.graphics.drawRect(
                    tabBar.getChildAt(targetTabIndex - 1).x + tabBar.getChildAt(targetTabIndex - 1).width - 3,
                    2,
                    1,
                    tabBar.getChildAt(targetTabIndex - 1).height - 3);
          tabBar.graphics.endFill();
     }
     if(targetTabIndex >= 0){
       event.dragSource.addData(targetTabIndex, "targetTabIndex");
     }
   }
 }
 
 protected function doDragDrop(event:DragEvent):void {
      if(tabBar.getChildIndex(DisplayObject(event.dragInitiator)) >= 0 && event.dragSource.hasFormat("targetTabIndex")){
     tabBar.graphics.clear();
        var sourceTabIndex:Number = tabBar.getChildIndex(DisplayObject(event.dragInitiator));
        var targetTabIndex:Number = Number(event.dragSource.dataForFormat("targetTabIndex"));
 
        if(sourceTabIndex < targetTabIndex || targetTabIndex == tabBar.getChildren().length){
          targetTabIndex--;
        }
        if(sourceTabIndex == targetTabIndex){
          return;
        }
 
        var sourceTab:DisplayObject = this.getChildAt(sourceTabIndex);
        this.removeChildAt(sourceTabIndex);
        this.addChildAt(sourceTab, targetTabIndex);
        this.selectedIndex = targetTabIndex;
 
      }
 }
 
 protected function doDragExit(event:DragEvent):void {
   if(tabBar.getChildIndex(DisplayObject(event.dragInitiator)) >= 0){
        tabBar.graphics.clear();
   }
 }
}
}

Um exemplo funcionando.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns="sjd.controls.*" layout="vertical">
 
  <advanceTabNavigator id="tab1" width="600" height="300">
 
    <mx:Canvas label="0000">
      <mx:Text text="0" />
 
    </mx:Canvas>
 
    <mx:Canvas label="1111">
      <mx:Text text="1" />
    </mx:Canvas>
 
    <mx:Canvas label="2222">
      <mx:Text text="2" />
    </mx:Canvas>
 
    <mx:Canvas label="3333">
      <mx:Text text="3" />
    </mx:Canvas>
 
    <mx:Canvas label="4444">
      <mx:Text text="4" />
    </mx:Canvas>
 
    <mx:Canvas label="5555">
      <mx:Text text="5" />
    </mx:Canvas>
 
  </advanceTabNavigator>
 
  <mx:Button id="b1" label="close" click="tab1.tabCloseEnable = (!tab1.tabCloseEnable); b1.label='close: ' + tab1.tabCloseEnable" />
 
  <mx:Button id="b2" label="drag" click="tab1.tabDragEnable = (!tab1.tabDragEnable); b2.label='drag: ' + tab1.tabDragEnable" />
 
</mx:Application>

Testem e se divirtam, enquanto isso chequem o post original que ele fez em seu Site

AS 3.0/ Flex

Qual o formato que o RichTextEditor gera?

Você quando está programando e usando aquile editor que o já vem nativo no Flex 2.0. Você teve aquila máxima curiosidade em saber o que realmente ele gera quando eu começo a escrever com ele para que possa guardar em meu banco de dados.

Eis aqui a formatação, pegue esse exemplo copie e teste em sua máquena. Isso é proveito por que ontem na aula de Flex um dos meus alunos teve essa brilhante idéia de me pedir para fazer algo, só que fiz de um textArea para outro TextArea, então ele usou o RichTextEditor, Brigado Felipe.

Bom eis o código:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
	<mx:Script>
 
			import mx.controls.Alert;
			public function mostrarFormatacao():void
			{
				formato.text = editor.htmlText;
			}
 
	</mx:Script>
	<mx:HBox x="50" y="20">
		<mx:RichTextEditor id="editor">
 
		</mx:RichTextEditor>
		<mx:TextArea id="formato" width="200" height="300">
 
		</mx:TextArea>
	</mx:HBox>
	<mx:Button click="mostrarFormatacao();" label="Mostrar Formatação" x="218" y="330"/>
</mx:Application>

Posso manipular isso? Sim você pode alterar o formato gerado pelo RichTextEditor usando apenas CSS.

Flex

Adobe Flex 2.0 – BUG – Unknown issue 02

Mais um para a coleção, espero que o pessoal do Flex Team possa consertar isso o mais rápido possível. Afinal precisamos sempre em projetos de Media Center, ferramentas de colaboração ou Conferência.

BUG: Flex 2.0 não consegue pegar mais que 1 câmera por vez. Se eu queser por exemplo criar um array delas e tentar usar ele não funciona.

Exemplo:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
<?xml version="1.0" encoding="utf-8"?>
<mx:Application creationComplete="pegaWebcam();" xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
	<mx:Script>
 
 
			import mx.controls.Alert;
			import flash.media.*;
			import flash.display.*;
 
			public function pegaWebcam():void
			{
				// declaração das variáveis
				var camera_1:Camera = Camera.getCamera();
				if(camera_1 != null)
				{
				video.attachCamera(camera_1);
				} else{
					Alert.show("Camera não disponível");
				}
			}
			public function maisWebcam():void
			{
				var camera_2:Camera = Camera.getCamera();
				if(camera_2 != null)
				{
					video2.attachCamera(camera_2);
				} else {
					Alert.show("Camera dois não suporta no Flex 2, use Flash mesmo");
				}
			}
 
	</mx:Script>
	<mx:HBox>
	<mx:VideoDisplay id="video" width="200" height="200"/>
	<mx:VideoDisplay id="video2" width="200" height="200"/>
	<mx:Button click="maisWebcam();" label="Ligar Camera 2"/>
	</mx:HBox>
</mx:Application>

O legal é saber que para isso vou ter que usar localConnection do Flex para puxar isso de um SWF vindo do Flash. Tomara e espero que isso possa ser consertado o quanto antes.

Flex

Adobe Flex 2.0 – BUG – Unknown issue 01

Adobe Flex 2.0 é realmente muito bom, embora a Adobe liste uma série de bugs que ela sabe que existe porém ainda está em consertos e ver se realmente consegue lançar um pacote de correções o mais breve possível. Vou postar mais uma que descobrir hoje quando estava ministrando um curso hoje, acabei descobrindo.

Bom eis que uso apenas um CSS para setar um ícone a todos os botões que usarei em uma suposta aplicação.

[css] Button {
icon:Embed(source=’icone.png’);
}
[/css]

Okay, agora adicione qualquer botão dentro de seu Application.

1
2
<br />
<mx:Button label="Teste com icone"/><br />

Lembrando que o arquevo no CSS “icone.png”, é apenas um exemplo, para realmente funcionar coloque um arquevo de ícone que você tenha.

Agora, adicione qualquer outro componente que o Flex usa como por exemplo um DateChooser, um Rich TextEditor ou um Panel.

Ao fazer isso o MXML editor do Flex vai atribuir o ícone criado não só no que você pediu mas em todos os componentes que usarem o componente Button.

Acontece isso. Olhei no site da Adobe e não vi como “Known issues”, então tou postando aqui e lá também.

Solução

Para resolver o problema, basta adicionar um StyleName para cada Tag ou melhor componente que você for usar, ao invés de usar um atributo diretamente ao Tag Button.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
</p>
<p><!-- Maneira correta -- ><br />
<mx:Style><br />
     .meuEstilo {<br />
            icon:Embed(source='icone.png');<br />
      }<br />
     .meuEstilo2 {<br />
            fontSize:14;<br />
            icon:Embed(source='icone.png');<br />
      }<br />
</mx:Style><br />
<mx:Button styleName="meuEstilo" label="Teste 1"/><br />
<mx:Button styleName="meuEstilo2" label="Teste 2"/></p>
<p>

Pode ser que seja pela hora, porém realmente reforçei a pesquesa mas não achei como Known issues. Alguém me ajude se tiver errado.

Para ver uma lista completa de erros no Release Notes do Flex 2. Tecnology OverView basta clicar aqui.

Notícias

Qual candidato usou melhor o Flash?

Eu sinceramente como alguns amigos e parentes sabem, votei 2 eleições no PT e 1 no PSDB/PFL, dessa vez eu vou votar no Cistrovam PDT.

Bom primeiramente antes de tudo lógico fui ver todos os sites de todos os candidatos a presidência da república, e posso confessar, no do cristovam Não vi nenhum igual, o uso do Flash foi maciço. Prova que realmente como dizem “candidato de uma nota só”. Não é isso pessoal.

O site foi muito bem feito, usou e explorou todos os recursos que um site político poderia ter e os recursos que o Flash pôde dá. Tá de parabéns a equepe que fez o site. Muito bem elaborado.

Bom, meu voto vai para ele por isso, só por que usou Flash ao invés de um emaranhado de códigos.

Não só por isso, mas lógico como todo eleitor tirei essa madrugada de 2:41 da manha da quarta para ler o que realmente os candidatos tem em comum e o que realmente o que é ou não consistente ao que oferecem na campanha eleitoral nos horários do meio dia e a noite.

Cristovam me surpreendeu por que realmente o plano de governo dele é bem elaborado, não que vai prometer dá uma nave espacial para cada brasileiro, mas pela forma como ele trata os problemas reais. Que queira ou não estão ligados a fatores educacionais e culturais de nosso país.

Se você realmente é um bom Flasheiro ou adora educação e povo educado, deveria dá um voto de confiança para ele. Não sou cabo eleitoral e nem tampouco partidário. Como falei na primeira linha desse post, votei no PT, PSDB/PFL e nada. Vamos ver se o Cristovam vai firmar.

Pouco do que parece, mas voltando mais para o lado do cenário político atual de nosso país, nunca vi outros candidatos serem tão bem marketados como nessa outra eleição, sempre tinhamos só PSDB/PFL, PMBD ou PT. Dessa vez o pessoal que é de outras chapas investiram também pesado no marketing, por exemplo 4 fortes candidatos ( Alckimn, Lula, Eloisa, Cristovam) ao meu ver são os candidatos com forte marketing na TV.

Meu voto vai para o Cristovam 12, pelo uso do Flash e pela sua proposta na educação Brasileira. Mesmo sabendo que
sua possibilidade de ganhar é pouca devido as pesquesas de boca de urna e voxpopulis, acredito que vale ainda mesmo
assim meu voto.

Site Cristovam12.com.br

Flex

Primeiro encontro da Flex-Brasil – em São Paulo SP

Nosso primeiro encontro está marcado, será no dia 28 desse mês nas instalações da ENG DTP.

É realmente muito bom, estarei palestrando para todos os membros do grupo como também para os convidados. O legal é que nesse nosso primeiro encontro, tópicos de como anda o mercado de Flex no Brasil e lógico muito assunto técnico sobre Flex.

Agradeço a ENG por estar nos dando apoio.

Para saber como chegar na ENG para o nosso primeiro encontro Clique aqui.