Ricardo Cerqueira

Hello Everbody,

Hoje iremos começar já a desenhar a aplicação no Adobe Flex, então para iniciar-mos, crie um novo projeto no Flex chamado MTBRanking, para quem não tem conhecimento no Flex Builder ainda, basta clicar em File/New/Flex Project, em Project name, digite MTBRanking, escolha a pasta onde sua aplicação irá ser criada (é importante que esteja na pasta pública do Apache, isso poderá mudar dependendo de cada ambiente que você esteja usando, poderá ser htdocs ou apenas www), clique no botão Finish.

Ok agora com a nova aplicação criada, adicione um VDividedBox, defina as propriedades de X e Y como 0 (zero) e Width e Height como 100%.
Agora dentro do VDividedBox, adicione um Panel e um ViewStack, automáticamente o Flex irá colocar um abaixo do outro, agora vamos ‘dar nome aos bois’ só para ficar mais fácil de identificar-mos os objetos na aplicação, neste caso, defina o ID do Panel = ‘panelTime’ e o ID do ViewStack = ‘vsDados’, também defina o width dos dois componentes = ‘100%’, e o Title do panelTime = ‘CRONOMETRAGEM’, o código deverá estar dessa forma:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
	<mx:VDividedBox width="100%" height="100%">
		<mx:Panel id="panelTime" width="100%" height="200" layout="absolute" title="CRONOMETRAGEM">
		</mx:Panel>
		<mx:ViewStack x="22" y="296" id="vsDados" width="100%" height="100">
			<mx:Canvas label="View 1" width="100%" height="100%">
			</mx:Canvas>
		</mx:ViewStack>
	</mx:VDividedBox>
</mx:Application>

Agora, adicione dentro do panelTime um Label, e defina as seguintes propriedades para ele:

ID = labelCronometro
text = ‘00:00:00′
fontSize = ‘100′
horizontalCenter = ‘0′
verticalCenter = ‘0′

Agora arraste para dentro do ViewStack 4 LinkButtons, defina a propriedade fontSize=’20′ para todos os quatro, e na sequencia configure cada um da seguinte forma:

LinkButton1 -> label=”Cadastro de Categorias”, x=”10″, y=”10″
LinkButton2 -> label=”Cadastro de Ciclistas”, x=”10″, y=”53″
LinkButton3 -> label=”Registrar Tempo”, x=”394″, y=”10″
LinkButton4 -> label=”Resultado”, x=”394″, y=”53″

O código final da aplicação tem que estar dessa maneira:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
	<mx:VDividedBox width="100%" height="100%">
		<mx:Panel id="panelTime" width="100%" height="200" layout="absolute" title="CRONOMETRAGEM">
			<mx:Label id="labelCronometro" text="00:00:00" fontSize="100" horizontalCenter="0" verticalCenter="0"/>
		</mx:Panel>
		<mx:ViewStack x="22" y="296" id="vsDados" width="100%" height="100">
			<mx:Canvas label="View 1" width="100%" height="100%">
				<mx:LinkButton x="10" y="10" label="Cadastro de Categorias" fontSize="20"/>
				<mx:LinkButton x="10" y="53" label="Cadastro de Ciclistas" fontSize="20"/>
				<mx:LinkButton x="394" y="10" label="Registrar Tempo" fontSize="20"/>
				<mx:LinkButton x="394" y="53" label="Resultado" fontSize="20"/>
			</mx:Canvas>
		</mx:ViewStack>
	</mx:VDividedBox>
</mx:Application>

Por enquanto é só pessoal, essa próxima semana estarei dando continuidade a aplicação.
Forte abraço

Olá, pessoal, finalmente comecei o tutorial, neste primeiro artigo da série iremos criar a base de dados que irá guardar as informações do sistema, primeiro defini o nome do sistema como MTBRanking, estarei utilizando o banco de dados MySQL 5, então comecem a criar a base conforme imagem abaixo.

Create table ciclista (
	id_ciclista Int NOT NULL AUTO_INCREMENT,
	id_categoria Int NOT NULL,
	nome Varchar(255),
 Primary Key (id_ciclista)) ENGINE = MyISAM;

Create table categoria (
	id_categoria Int NOT NULL AUTO_INCREMENT,
	descricao Varchar(50),
 Primary Key (id_categoria)) ENGINE = MyISAM;

Create table ranking (
	id_ciclista Int NOT NULL,
	tempo Time,
 Primary Key (id_ciclista)) ENGINE = MyISAM;

Alter table ranking add Foreign Key (id_ciclista) references ciclista (id_ciclista) on delete  restrict on update  restrict;
Alter table ciclista add Foreign Key (id_categoria) references categoria (id_categoria) on delete  restrict on update  restrict;

Vou dar uma breve explicação de cada tabela, visto que é um sistema extremamente simples, a tabela categoria será o cadastro das categorias, exemplos:

- Elite
- Feminina
- Sub 30
- Sub 23
- Eco-turismo
- Master

A ciclistas, será gravado os ciclistas participantes do campeonato e a sua categoria, e a tabela ranking será o tempo de cada ciclista, muito simples…

Bem por hoje é só, até o próximo post, pois está na hora do almoço e estou com fome…

Abraços

Quer saber como está o seu conhecimento no Flex 3? quer tentar fazer o exame de certificação da Adobe ? então baixe esse programinha em AIR e faça o simulado (em inglês).

Boa sorte!

Fala aê terráqueos, eu reconheço que deixei o blog de lado essas últimas semanas, é que estou bastante ocupado com 3 sistemas, mais vou tentar ficar postando algo aqui pra eu não esquecer que este blog existe hehe, bem em um desses sistemas, senti a necessidade de pegar uma data e acrescentar uma certa quantidade de meses nesta data, procurei na net algo sobre o assunto e não achei nada, então decidi desenvolver uma pequena função que me quebrou o galho.

Abaixo a função em ActionScript:

public function somaMes(data:String,quant:int):Date {
	var separa:Array = data.split("/");
	var dia:int = parseInt(separa[0]);
	var mes:int = parseInt(separa[1])-1;
	var ano:int = parseInt(separa[2]);
	var novaData:Date = new Date(ano,mes+quant,dia,0,0,0,0);
 
	return novaData;
}

Abaixo fiz um pequeno exemplo do funcionamento da função, enjoy!

Baixe aqui o código-fonte

Olá programmers, dando continuidade a propriedade restrict, irei demonstrar como restringir apenas caracteres númericos no TextInput.

Para isso basta definirmos a propriedade restrict = “0-9;”, aqui estamos informando que aceite do caractere 0 ao 9, veja o resultado abaixo.

Código:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
	<mx:Label x="10" y="10" text="Somente números:"/>
	<mx:TextInput x="125" y="8" width="132" restrict="0-9;"/>
</mx:Application>

Live-demo:

Olá amigos, como nunca mais tive tempo de escrever nada, resolvi escrever pequenos artigos rápidos que vão surgindo no dia-a-dia, bem pra começar vou exemplificar como fazer para transformar os caracteres digitados em um componentes de entrada de dados como TextInput ou TextArea em maiúsculas.

Para isso, basta utilizar uma propriedade ‘restrict‘ contidas nestes componentes, com esta propriedade você poderá ir muito além, em breve irei postar mais alguns exemplos.

Código:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
	<mx:Label x="10" y="10" text="Seu nome:"/>
	<mx:TextInput x="85" y="8" width="196" restrict="^a-z;"/>
	<mx:Label x="10" y="36" text="Endereço:"/>
	<mx:TextArea x="85" y="35" height="59" width="196" restrict="^a-z;"/>
 
</mx:Application>

Live-demo:

Abraços

Galera, da uma olhada na minha próxima aquisição, show!!

g-speak overview 1828121108 from john underkoffler on Vimeo.

Já confirmei minha presença no iSeminar 2008 (http://www.iseminar.com.br/v2008/), para quem não conhece o iSeminar é o melhor evento web do nordeste, patrocinado pela Adobe, este ano contará com a presença do Fábio Terracini, que pra mim é um dos melhores Flex Man que temos no nosso cenário hoje, o evento irá acontecer em Recife-PE no dia 08/11 às 8:30hs.

Para quem puder ir nos encontraremos por lá.

Abraços

Fui acessar o orkut hj e olha a mensagem que o google bota pra mim, realmente não perdem tempo!

Olá galera, pra quem não conhece o Campus Party Brasil (http://www.campus-party.com.br/), é um encontro de tecnologia, onde os participantes levam suas mochilas, barracas e pcs, acampam por 5 dias no local do evento, conhece novas pessoas, trocam conhecimentos, se divertem e ainda usam uma conexão de 5 GB (putz!).

Então apoiando a idéia do Fábio Vedovelli, decidimos criar uma Aldeia de desenvolvedores Flex lá no evento, onde poderíamos nos conhecer pessoalmente e tocar um rock n’ roll e se divertir bastante!

Você que acompanha o meu blog, deixem sua opinião.

Abraços