Aplicação da biblioteca Allegro no jogo Batalha Naval

BIBLIOTECA ALLEGRO

O QUE É?

A Allegro é uma biblioteca criada para o desenvolvimento de jogos e aplicações multimídia. É uma plataforma transversal e trabalha com muitos compiladores diferentes. É gratuita, não há limitação de uso e é fácil de usar. Com ela pode ser inserido varias funções como: imagens, temporizador, entradas de dados: mouse, teclado e joystick, saída de vídeo: gráficos e texto.

Foi criada por Shawn Hargreaves que hoje trabalha na Microsoft. Sua intenção era de fazer uma biblioteca de código simples para que o iniciante na área de programação de jogos não precisasse ler uma grande quantidade de livros.

COMO INSTALAR ALLEGRO NO AMBIENTE LINUX?

Há duas maneiras de instalar a biblioteca.

-Primeira :

No Desktop siga os seguintes passos:

SYSTEM – ADMINISTRATION – SYNAPTIC PACKAGE MANAGER

Faz uma busca pelo nome allegro. Dos pacotes disponíveis, instala o pacote liballegro4.2-dev. Após baixá-lo a biblioteca estará instalada.

Figura1: Baixando o pacote pelo Synaptic Package Manager.

-Segunda:

Abra o terminal e digite: sudo apt-get install liballegro4.2-dev. Logo após, o programa pedirá o password, então digite-o. Com isso, a biblioteca será instalada.

Figura 2: Baixando o pacote pelo terminal.

EXEMPLO DE APLICAÇAO DA ALLEGRO:

Jogo Batalha Naval

O jogo Batalha Naval foi desenvolvido com aplicações da biblioteca Allegro em código fonte C. Nele precisamos incluir alguns comandos da Allegro que formam o laço principal do jogo e que sem eles não conseguiríamos utilizar nenhuma função da mesma.

São eles:

#include < allegro.h> // inclui a biblioteca

allegro_init(); //inicia a biblioteca allegro

set_color_depth(); // configuração de cores

set_gfx_mode(); // configuração de vídeo

Sendo os três últimos comandos dentro da função principal.

Para se usar as imagens necessárias, inicialmente criamos um ponteiro que aponta para todas as imagens da memória utilizadas no jogo. Esse ponteiro aponta para o tipo BITMAP, que é um formato de arquivo gráfico.

BITMAP *imagem[5];

Onde:

Imagem[0] é um buffer;

Imagem[1] é o desenho do fundo;

Imagem[2] é o desenho da água;

Imagem[3] é o desenho do barco;

Imagem[4] é o desenho da tábua;

Com o comando create_bitmap(); definimos o tamanho da imagem que queremos carregar na memória. Onde passamos como argumentos, a largura e a altura da imagem, respectivamente.

imagem[1] = create_bitmap (800, 600);

Com o comando load_bitmap(); carregamos a imagem na memória. Onde passamos como argumentos, o caminho da imagem e a paleta de cores, respectivamente.

imagem[1] = load_bitmap ("tiles/back0.bmp", NULL);

Executando estes dois comandos em cada imagem usada no jogo.

Porém, os comandos acima não são suficientes para exibição na tela, pois apenas servem para declarar, definir e carregar a imagem.

Então usamos uma das três funções que são responsáveis por desenhar a imagem na tela: a função blit();.

Esta função é responsável por “copiar” uma imagem ‘origem’ em uma imagem ‘destino’, especificando as posições de ambas, e em seguida o tamanho final.

blit( imagem[1], imagem[0], 0, 0, 0, 0, 800, 600); // “copiando” a imagem[1] e “colando” no buffer...

blit(imagem[0], screen, 0, 0, 0, 0, 800, 600); // “copiando” a imagem final e “colando” na tela.

Essa função recebe como argumentos:

1. Imagem de origem: imagem[0]

2. Imagem de destino: screen

3. Posição x da imagem de origem: 0

4. Posição y da imagem de origem: 0

5. Posição x da imagem de destino: 0

6. Posição y da imagem de destino: 0

7. Largura final da imagem copiada: 800

8. Altura final da imagem copiada: 600

Com isso, podemos ver o fundo do jogo.

Figura 3: Imagem fundo na tela.

Para desenhar os tabuleiros, temos q repetir a mesma operação, sempre respeitando as posições das imagens.

Com uma função de repetição formamos uma matriz 10 x 10 de imagens tábua. Jogando as mesmas no buffer.

blit( imagem[3], imagem[0], 0, 0, x, y, 30, 30); onde x e y variam de acordo com a posição de cada imagem de tábua na tela.

Figura 4: Imagens tábua formando um tabuleiro no buffer.

E novamente com o comando blit();, ‘copiamos’ a imagem do tabuleiro no buffer e jogamos na tela.

Figura 5: Exibição do primeiro tabuleiro na tela.

blit(imagem[0], screen, 0, 0, 50, 150, 300, 300); // comando do primeiro tabuleiro.

Figura 6: Exibição dos tabuleiros.

blit( imagem[0], screen, 0, 0, 450, 150, 300, 300); // comando do segundo tabuleiro.

Com tudo, precisamos fazer com que as figuras da água e do barco apareçam com o decorrer do jogo.

Basta usar o mesmo comando blit();, jogar a imagem da água ou barco no buffer e depois na tela, fazendo com que esta substitua a posição da imagem tábua numa determinada posição de acordo com o decorrer do jogo.

Figura 7: Exibição do barco e da água nos tabuleiros.

Mas, além das figuras, o jogador precisa ter informação referente ao jogo. Para isso é necessário colocar texto.

Então usamos a função textprintf_ex(); Para exibir textos na tela.

Figura 8: Exibição de textos na tela.

textprintf_ex(screen,font,170,460,makecol(255,255,255),-1,”PARABÉNS VOCÊ VENCEU!!!");

textprintf_ex(screen,font,170,480,makecol(255,255,255),-1,"Deseja Jogar Novamente? 1- SIM, 2- NÃO");

Essa função recebe como argumentos:

- Destino do texto: screen

- Tipo da fonte: font //sempre usamos esse tipo de fonte, pois é a fonte padrão da Allegro.

- Posição x e posição y da fonte na tela: 170, 480.

- Cor do texto: makecol(225,225, 255) - (Branca)

- Cor de fundo do texto: -1 - (Transparente)

- Texto: “Deseja jogar novamente? 1- SIM, 2 - NÃO”

Essa função makecol(); é responsável por indicar cores. Ela é composta de 3 trios de valores separados por uma vírgula.

O primeiro trio é a “quantidade” de vermelho, o segundo é a quantidade de “verde”, e o terceiro é a quantidade de “azul”. Sendo este tipo de ‘colorido’ chamado de RGB.Com seus valores variando de 000 – 225. E para um fundo transparente ao invés de usar a função makecol(); utiliza- se o valor -1 no argumento.

E para finalizar, usamos a função allegro_exit();.

COMO COMPILAR

gcc < nomedoarquivo>.c -o < nomedojogo>`allegro-config --libs`

Figura 9: Compilar usando allegro.

CONCLUSÃO:

A biblioteca Allegro é de grande ajuda para quem quer utilizar interface gráfica, mas não tem muito domínio em programação. E sendo ela voltada principalmente para o desenvolvimento de jogos, torna-a uma boa alternativa comercial, já que o mercado de jogos cresce bastante. Como os comandos da biblioteca são bem práticos e de simples aplicação, facilita o desenvolvimento do código, tornando-se uma boa ferramenta para programadores iniciantes em aplicações gráficas.

AGRADECIMENTOS:

Bruno Rafael

Emanuel Franco

BIBLIOGRAFIA:

http://www.bdjogos.com/linguagens.php?id=3

http://www.lcg.ufrj.br/Cursos/mab604/allegro/view

http://www.tuliofaria.net/arquivos/Artigo_Allegro.pdf

TUTORIAL FEITO POR:

CECÍLIA MAYARA G. DA SILVA

FLAVIANY RODRIGUES PINHEIRO

LARISSE VITAL DA SILVA

Tutorial SQL

TUTORIAL SQL

SUMARIO

1. INTRODUÇÃO

2. SINTAXE
3. DDL E DML
4. DDL E RESTRIÇÕES DO CREATE
5. DML
5.1 SELECT
5.2 SELECT DISTINCT
5.3 CLAUSULA WHERE
5.4 OPERADORES AND E OR
5.5 ORDER BY
5.6 INSERT
5.7 UPDATE
5.8 DELETE
6. FUNÇÕES
6.1 AVG
6.2 COUNT
6.3 FIRST
6.4 LAST
6.5 MAX
6.6 MIN
6.7 SUM
7. BIBLIOGRAFIA

SQL

SQL é uma linguagem padrão para acessar e manipular bancos de dados.

O que é SQL?

Structured Query Language, ou Linguagem de Consulta Estruturada ou SQL, é uma linguagem de pesquisa declarativa para banco de dados relacional (base de dados relacional. Muitas das características originais do SQL foram inspiradas na álgebra relacional.
SQL é um padrão ANSI (American National Standards Institute)

O que pode fazer o SQL?

Com SQL podemos recuperar dados, inserir, atualizar e excluir registros, além de criar novas bases de dados e também criar novas tabelas, novos procedimentos e novas visões de um banco de dados. SQL pode também definir permissões em tabelas, procedimentos e visões.

Sintaxe SQL

Tabelas de banco de dados

Um banco de dados na maioria das vezes contém uma ou mais tabelas. Cada tabela é identificada por um nome. As tabelas contêm registros (Tuplas) com dados.
Abaixo está um exemplo de uma tabela chamada "Pessoas":

A tabela acima contém três Tuplas, com cinco colunas (Id, Apelido, Nome, Endereço e Cidade).

Instruções SQL

A maioria das ações que você precisa para executar em um banco de dados é feito com instruções SQL. A seguinte instrução SQL selecionará todos os registros na tabela Pessoas:

• SELECT * FROM Pessoas

Sintaxe
SELECT * FROM

DDL e DML

SQL pode ser dividida em duas partes: A Data Definition Language (DDL) e a Data Manipulation Language (DML).

DDL (Linguagem de Definição de Dados)

Uma DDL permite ao utilizador definir tabelas novas e elementos associados.

Os comandos básicos da DDL são três (CREATE, ALTER, DROP):

• CREATE DATABASE - Cria um novo banco de dados
• ALTER DATABASE - Altera um banco de dados
• CREATE TABLE - Cria uma nova tabela
• ALTER TABLE - Altera uma tabela
• DROP TABLE - Apaga uma tabela
• CREATE INDEX – Cria um Índice (chave de busca)
• DROP INDEX - Exclui um índice

DML (Linguagem de Manipulação de Dados)

São utilizados para realizar inclusões, consultas, exclusões e alterações de dados presentes em registros.

• SELECT - Extrai dados de um banco de dados.
• UPDATE - Atualiza dados em um banco de dados.
• DELETE - Apaga dados de um banco de dados.
• INSERT INTO - Insere novos dados em um banco de dados.

OBS: Não confunda Alter com Update e Drop com Delete! Alter e Drop são para manipular a estrutura das tabelas e Update e Delete para manipulação de tuplas)!!!

DDL (Linguagem de Definição de Dados)

Para exemplificarmos os comandos de DDL comentados acima, faremos abaixo um schema para criação de um BD de uma loja chamada loja1 e criaremos uma tabela chamada Pessoas. Com esses comandos seremos capazes de criar e apagar qualquer BD e tabelas.

• create database Loja1
• create schema Loja1

Os Comandos acima são para criação de um schema ou database do nosso BD(Ambos comandos realizam a mesma função).

• CREATE TABLE `loja1`.`Pessoas` (
`ID` INTEGER UNSIGNED NOT NULL AUTO_INCREMENT,
`Apelido` VARCHAR(45) NOT NULL,
`Nome` VARCHAR(45) NOT NULL,
`Endereço` VARCHAR(45),
`Cidade` VARCHAR(45),
PRIMARY KEY (`ID`)
)

Para apagarmos a tabela é só usar DROP TABLE PESSOAS. Lembre-se que se apagar a tabela tudo que ela a conter será apagada também!
Para apagarmos a database é só usar DROP DATABASE LOJA1.

O comando acima criará uma tabela Pessoas na databarse loja1 com os atributos id, apelido, nome, endereço, cidade com seus tipos (integer e varchar) e suas restrições (not null e auto_increment).

Restrições de Integridade na Clausula Create

• not null: indica que ao atributo não pode ser atribuído o valor null(nulo).
• primary key ( A1,..., An): Indica os atributos que formam a chave primária.
• check(P): verifica que em todo momento o predicado P se satisfaça na relação.
• unique: indica que o atributo deve ter um valor único em cada tupla, i,e, chave secundaria.
• foreign key A1 references R(B1): indica que o atributo A1 é chave estrangeira e referencia o atributo B1 de uma tupla da relação R.

DML (Linguagem de Manipulação de Dados)

SELECT

A instrução SELECT é usada para selecionar dados de um banco de dados. O resultado é armazenado em uma tabela e é mostrada na tela.

Sintaxe
SELECT FROM WHERE

Veja que o comando abaixo selecionou o Id, o Apelido e o Nome de todos da tabela Pessoas e o resultado foi armazenado em uma nova tabela e retornado na tela. O comando WHERE só precisa ser usado se quisermos colocar alguma condição, veremos mais abaixo.

SELECT id, apelido, nome FROM pessoas

Note que o * no comando abaixo faz selecionar todas as tuplas e atributos da tabela Pessoas

SELECT * FROM Pessoas

SELECT DISTINCT

Em uma tabela, algumas das colunas podem conter valores duplicados. Este não é um problema, no entanto, às vezes você vai querer listar apenas os distintos (diferentes) valores em uma tabela.
A palavra-chave DISTINCT pode ser utilizada para retornar apenas distintos (diferentes) valores.

Sintaxe
SELECT DISTINC FROM

Agora queremos selecionar apenas os valores distintos na coluna chamada "Cidade" da tabela Pessoas mostrada acima.

• SELECT DISTINC cidade FROM Pessoas

Note que não aprece a duplicação da Cidade Arapiraca

Cláusula WHERE

A cláusula WHERE é usada para extrair apenas os registros que satisfazem o critério especificado.

Sintaxe
SELECT FROM WHERE

Agora vamos selecionar o id e o nome da pessoa com id = 2.

SELECT Id, nome FROM pessoas WHERE id=2

Note que o Where só retorna as tuplas que satisfaz a condição dada acima.

Com a cláusula WHERE, os seguintes operadores podem ser usados:

OPERADORES AND E OR

Os operadores AND e OR são usados para filtrar registros com base em mais de uma condição. O operador AND exibe um registro se a primeira e segunda condição for verdadeira. O operador OR exibe um registro se a primeira ou a segunda condição for verdadeira.

Sintaxe

SELECT FROM WHERE

Agora Vamos selecionar apenas as pessoas com o nome igual a "João" e o apelido igual a "Cabeção":

SELECT * FROM Pessoas WHERE nome= 'João' AND Cidade= 'Arapiraca'

ORDER BY

A palavra-chave ORDER BY classificar os registros em ordem crescente por padrão. Se você quiser classificar os registros em ordem decrescente, você pode usar a palavra chave DESC.

Sintaxe
SELECT FROM ORDER BY

Agora queremos selecionar todas as pessoas da tabela acima, no entanto, queremos ordenar as pessoas por seu nome.

SELECT * FROM Pessoas ORDER BY Nome

Observe que a tabela ficou ordenada pelo atributo nome.

Agora queremos selecionar todas as pessoas da tabela acima, no entanto, queremos ordenar as pessoas por seu ID em ordem decrescente.

SELECT * FROM Pessoas ORDER BY ID DESC

Observe que a tabela ficou ordenada pelo atributo ID.

INSERT INTO

A instrução INSERT INTO é utilizada para inserir uma nova linha em uma tabela. É possível escrever a instrução INSERT INTO em duas formas (sintaxes).
A primeira forma não especifica o nome da coluna onde os dados serão inseridos, apenas os seus valores:

Sintaxe 1
INSERT INTO Nome_Tabela VALUES (valor1, valor2, valor3,...)

Sintaxe 2
INSERT INTO Nome_Tabela(coluna1,coluna2, coluna3,...)
VALUES (valor1, valor2, valor3,...)

Agora Vamos inserir uma nova linha na tabela Pessoas com cada sintaxe.

INSERT INTO Pessoas
VALUES (4,’Hulk’, 'Marcelo', 'Rua M 24', 'Maceió')

INSERT INTO Pessoas (Id, Apelido, Nome,)
VALUES (5, 'Chorão', 'Junior')

Note que com a sintaxe 2 podemos deixar algum atributo sem valor, só temos que observar as restrições da tabela! Quando criamos essa tabela na pagina 6 note que não colocamos restrição nenhuma nesses 2 atributos.

UPDATE

A instrução UPDATE é usada para atualizar registros em uma tabela.

Sintaxe
UPDATE nome_tabela
SET atributo1 = valor1, atributo2 = valor2,...
WHERE

Observe a cláusula WHERE no UPDATE. A cláusula WHERE especifica o registro ou registros que devem ser atualizadas. Se você omitir a cláusula WHERE, todos os registros serão atualizados!

Agora queremos atualizar os dados do "Junior" da tabela Pessoas.

UPDATE Pessoas
SET (Endereço = 'Rua J 100', Cidade = 'Lagoa da Canoa')
WHERE Id = 5 AND nome='Junior'

Tenha cuidado ao atualizar registros, pois, você pode cometer erros como o mostrado abaixo.

UPDATE Pessoas SET Cidade='Maceió'

Com o código acima atualizamos erroneamente a cidade de todas as pessoas, pois não colocamos a condição de qual tupla seria atualizada.

DELETE

A instrução DELETE é usado para excluir registros em uma tabela.

Sintaxe
DELETE FROM nome_tabela
WHERE

Agora vamos eliminar a pessoa João da tabela Pessoas.

DELETE FROM Pessoas
WHERE nome=’João’

Podemos apagar também todos os atributos da Tabela sem afetar sua estrutura.

DELETE FROM Pessoas

Veja que todas as pessoas foram excluídas, mas a estrutura da tabela não foi alterada!

Funções

Funções agregadas SQL retornar um único valor, calculado a partir dos valores em uma coluna.

• AVG - Retorna o valor médio
• COUNT - Retorna o número de linhas
• FIRST - Retorna o primeiro valor
• LAST - Retorna o último valor
• MAX - Retorna o maior valor
• MIN - Retorna o menor valor
• SUM - Retorna a soma

AVG

O AVG retorna o valor médio de uma coluna numérica.

Sintaxe
SELECT AVG (nome_coluna) FROM nome_tabela

Para mostrar o funcionamento vamos aplicar o AVG na coluna salário da tabela abaixo

(SELECT AVG (Salário) FROM Emp_salario

Após ser feita a consulta acima na tabela Emp_salario o resultado será 800.

COUNT

A função count retorna o número de linhas que corresponde a um critério especificado.

Sintaxe
SELECT COUNT (nome_coluna) FROM nome_tabela

Vamos contar quantas pessoas ganham acima de 600,00 da tabela Emp_salario.

SELECT COUNT (Salário) FROM Emp_salario WHERE (salário>600)

Após ser feita a consulta acima o resultado será 3.

FIRST

O FIRST retorna o primeiro valor da coluna selecionada.

Sintaxe
SELECT FIRST (column_name) FROM table_name

Vamos recuperar qual o primeiro valor da coluna salário.

SELECT FIRST (salário) FROM Emp_salario

Após ser feita a consulta acima o resultado será 1000.

LAST

A função last retorna o último valor da coluna selecionada.

Sintaxe
SELECT LAST (nome_coluna) FROM nome_tabela

Vamos recuperar o ultimo valor da coluna salário. Para isso usaremos a consulta abaixo.

SELECT LAST (salário) FROM Emp_salario

Após ser feita a consulta acima o resultado será 600.

MAX

A função max retorna o maior valor da coluna selecionada.

Sintaxe
SELECT MAX (nome_coluna) FROM nome_tabela

Vamos recuperar qual o maior salário da tabela abaixo. Para isso usaremos a consulta abaixo.

SELECT MAX (salário) FROM Emp_salario

Após ser feita a consulta acima o resultado será 1200.

MIN

O MIN retorna o menor valor da coluna selecionada.

Sintaxe
SELECT MIN (nome_coluna) FROM nome_tabela

Vamos recuperar qual o menor salário da tabela acima. Para isso usaremos a consulta abaixo.

SELECT MIN (salário) FROM Emp_salario

Após ser feita a consulta acima o resultado será 500, representando o menor salário existente dos empregados da tabela acima.

SUM

A função SUM retorna a soma total de uma coluna numérica.

Sintaxe
SELECT SUM (nome_coluna) FROM nome_tabela

Vamos recuperar a soma dos salários da tabela abaixo. Para isso usaremos a consulta abaixo.

SELECT SUM (salário) FROM Emp_salario

Após ser feita a consulta acima o resultado será 4000, representado pela soma de todos os salários da tabela acima.

Bibliografia

Elmasri & Navathe
Sistemas de Banco de dados, 4a ed., 2005.
Capítulo 1: Banco de dados e usuários de banco de dados
Capítulo 2: Conceitos e arquitetura do SGBD

C. A. Heuser
Engenharia de Software, 4a ed., 1998.
Capítulo 2 - Introdução

Site de programação em varias linguagens
http://www.w3schools.com/default.asp

Uma Abordagem Simples sobre Adobe Flex!

Tutorial sobre FLEX

1. Breve Histórico

Adobe Flex, antes chamado de Macromedia Flex e depois rebatizado como Adobe Flex pela Adobe é uma tecnologia lançada em março de 2004 pela Macromedia e suporta o desenvolvimento de aplicações ricas para a Internet (RIAs). Baseada na plataforma do Macromedia Flash, no início era composta por um SDK, um IDE e integração com o J2EE também conhecido como Flex Data Services que é um servidor que fornece uma série de serviços que podem elevar as funcionalidades de uma aplicação FLEX, como:

- serviços de mensageria;

- integração nativa com Hibernate e Enterprise JavaBeans;

- push de dados, sincronia e lock de dados;

Em 2005 a Adobe adquiri a Macromedia e passa a requerer uma licença para o Flex Data Services que, por sua vez, passa a se chamar LiveCycle Data Services;

A mais nova versão do FLEX surgiu em 22 de março de 2010, o FLEX 4.0, que inova na integração da linguagem com o design.

2. O que é?

"É um framework multi-plataforma para desenvolvimento de aplicações RIA, levando um modelo de programação padrão e conhecido por profissionais e desenvolvedores.

Nele usamos uma linguagem de marcação (MXML) que é baseada no XML para definir a interface da aplicação e o Actionscript 3.0 para a parte lógica. As aplicações Flex levam a extensão .mxml e podem ser criadas em qualquer editor de texto comum, como por exemplo o Bloco de Notas."

Fonte: E-genial

O MXML é uma linguagem de marcação baseada em XML introduzido pela primeira vez pela Macromedia em março de 2004. Ele é usado em combinação com ActionScript, que faz a parte lógica da aplicação, para desenvolver aplicativos ricos para internet, além de poder trabalhar com várias linguagens servidor, entre elas pode se destacar o PHP, Java, ColdFusion, ASP.NET.

3. Instalação:

Para começar a programar em FLEX o desenvolvedor possui basicamente dois caminhos a seguir.

Para aqueles que tenham aquele espírito aventureiro, existe a alternativa de baixar gratuitamente a SDK e usar um editor qualquer, que a principio só precisa ser compatível com os padrões do XML, juntos (editor+sdk) é possível desenvolver as famosas aplicações RIA.

Umas das opções de editor encontrado na net seria o “MXML EDITOR” também conhecido por TOMI(The Open Source MXML IDE) que possui entre outras coisas, os destaques das palavras reservadas que tanto nos auxiliam no desenvolvimento.

Entretanto, se o desenvolvedor for do tipo prático e que precisa de facilidade e velocidade, a melhor opção é a ferramenta Flex Builder. Ela foi simplesmente feita para o Flex. Nela encontram-se a sdk e editor prontamente instalados e integrados. Além de possuir a interface amigável do eclipse (o flex builder foi feito com base no eclipse galileo) e todas as facilidades encontradas nas IDEs mais modernas, tais como eclipse e netbeans, e como uma das partes fundamentais do FLEX é o desenvolvimento de interfaces o Flex Builder tambem possui um completo recurso de “Drag And Drop”, no qual facilmente e rapidamente o desenvolvedor pode dispor os elementos que julgar necessário em sua aplicação.

Bem... uma vez que optemos pelo uso do Flex Builder, a instalação é a mais trivial possível, trata-se do clássico “next->next->next... ->finish”.

E o uso da ferramenta é muito semelhante ao do Eclipse, a disposição dos ícones é basicamente a mesma (veja as imagens).

Exemplos:

Como já foi dito, o Flex faz uso de duas linguagens. O MXML para interfaces das aplicações e o ActionScript para a logica que a aplicação necessita ter.

Num mesmo arquivo podemos escrever a interface em MXMLe o programa (entenda por programa a parte do ActionScript) ou ainda deixar em arquivos separados, ou seja, o arquivo MXML precisaria importar os Scripts para que a aplicação funcione corretamente.

Abaixo temos um exemplo trivial de “Hello World!”.

Uma aplicação em MXML, pode ser vista como uma disposição de camadas, chamadas de layers, essas camadas organizam e dão logica para a interface, definindo assim “o que está sobre o que”.

Normalmente temos como camada base de uma interface o “Panel” e sobre o Panel dispomos outras camadas, botões, campos etc.

Explicando o código acima, podemos destacar 3 partes básicas:

1 - Identificação: as duas primiras linhas, que identificam a aplicação e versão da linguagem usada;

2 - Interface: entre as tags encontra-se descrita a interface, que no caso apenas carrega um button;

3 - Script: entre as tags encontra-se o script do programa, que neste caso, apenas implementa uma função que “joga” a palavra “Mundo” na tela, usando uma caixa de alerta, função esta chamada através de um evento de clique no button acima descrito.

O resultado da aplicação descrita resulta na imagem abaixo.

4. Aprofundamento

Para quem se interessar de verdade e quiser conhecer um pouco mais sobre a tecnologia FLEX da Adobe, segue os links:

http://flex.org/

http://www.adobe.com/br/products/flex/

http://www.adobe.com/devnet/flex.html

http://labs.adobe.com/technologies/flex/

5. Conclusão

O Flex possui plataforma com suporte para Windows, Mac e Linux, mostrando-se muito portável. Tem na linguagem MXML grande importância na definição da interface auxiliando no desenvolvimento do código. É de se ressaltar, também, que a integração com vídeo é um ponto forte juntamente com todas as outras ferramentas da Adobe. São disponibilizados Vários plugins gratuitos para a plataforma e a tecnologia possui suporte direto com JAVA e AJAX.

Com tudo isso, por ser uma tecnologia criada pela Adobe, há um forte sentimento em fazer com que ela evolua e se solidifique.

6. Referências

http://blog.mxml.com.br/submetendo-um-formulario-no-flex-usando-o-metodo-get-com-php

http://www.adobe.com/br/products/coldfusion/

http://imasters.uol.com.br/artigo/4551/flex/usando_mxml/

http://www.adobe.com/br/products/flashcatalyst/

http://imasters.uol.com.br/artigo/15510/flex/adobe_flex_4_adobe_flash_builder/

http://imasters.uol.com.br/artigo/14342/flex/novo_flex_4_gumbo/

http://imasters.uol.com.br/artigo/16314/flex/adobe_flex_4_duvidas_que_voce_tem_mas_nao_teve_coragem_de_perguntar/

http://www.igorcosta.com/blog/?p=31

http://www.vedovelli.com.br/?p=62

Tutorial feito por:

Antonio Carlos Pereira Pacheco

Guilherme Oliveira Amorim

Allen Deyjan

Tutorial Flash Lite

Para começar a desenvolver aplicativos Flash Lite primeiramente você precisa do software Adobe Flash Professional, aqui está o link para fazer o download da versão trial: https://www.adobe.com/cfusion/tdrc/index.cfm?product=flash . Na hora da instalação instale tudo, porque no pacote de instalação inclui um software que tem o objetivo de servir como emulador para dispositivos móveis, o Adobe Device Central.

Para desenvolver aplicativos Flash Lite, é necessário um conhecimento no desenvolvimento de desenhos vetoriais no Adobe Flash Professional para a parte de interface gráfica, e para a parte lógica o conhecimento da linguagem de programação para o Flash, o ActionScript. Neste Tutorial focaremos na linguagem ActionScript. Pode-se encontrar tutoriais ensinando a mexer com o Adobe Flash na literatura e na internet. Neste link você pode encontrar toda a documentação do Flash, tutoriais, AcitonScript e o Flash Lite: http://help.adobe.com/pt_BR/Flash/10.0_Welcome/WS0440A5AD-E290-4bd6-A402-B09F727E9A05.html


Primeiros Passos


Primeiramente execute o software Adobe Device Central. No campo New Document você escolhe a versão do player e a versão do ActionScript:



No Player Version selecione Flash Lite 3.1:



Automaticamente ele seleciona a versão do ActionScript a ser usado. No canto da tela você pode escolher o tipo de aparelho que você queira emular:



No próprio Adobe Device já vem instalado a pasta Flash Lite. Se você deseja usar outros emuladores, no próprio Adobe Device tem uma aba chamada Browse clique nele e irá abrir uma lista de dispositivos:



No campo 2, da pesquisa você digita a marca do aparelho que você deseja desenvolver:



Na lista irá aparecer todos os aparelhos que suportam Flash. Para salvar um desses devices, você criar uma pasta no campo Test Devices. Para criar uma nova pasta é só clicar com o botão direito do mouse no campo e escolher a opção Add New Group:



Irá aparecer uma nova pasta renomeie:



Agora você tem sua própria pasta, para colocar um dos devices na lista que você procurou, clicar no dispositivo escolhido e arrastar para sua pasta:



Escolhi o aparelho Nokia 5200, que suporta a versão Flash Lite 2.0, podendo usar as versões do ActionScript 2.0 e 1.0:



Na aba onde se encontra a opção Browse você clica na aba Create:



Selecione a sua pasta, o device escolhido e clique em Create, abaixo da sua tela. O Próprio Adobe Device irá abrir o Adobe Flash com as especificações do aparelho, como tamanho da tela, versão do Flash Lite e do ActionScript.

Hello World

O Adobe Flash será aberto com as configurações do emulador. Nosso primeiro Hello World será somente código sem necessidade de mexer em desenho vetorial no Adobe Flash.

Na timeline você clica na primeiro frame e vá na aba Window e clique em Action (ou simplesmente tecle F9) para abrir uma janela de edição onde você irá colocar o código ActionScript:



1->Aba Window

2->Abre a janela Action

3->Primeiro Frame

Ao fazer isso abrirá uma janela de edição:



Agora vamos para a parte de codificação:

Primeiro vamos criar um campo de texto, em ActionScript 2.0 usaremos o createTextField. Digite esse código:



Esses atributos do createTextField significam:

1. "textbox_txt" -> nome da instância do novo campo de texto;


2. this.getNextHighestDepth() -> especifica a profundidade do campo de texto novo;


3. 10 -> Um inteiro que especifica a coordenada x do novo campo de texto;


4. 10 -> Um inteiro que especifica a coordenada y do novo campo de texto;


5. 100 -> Um inteiro positivo que especifica a largura do campo de texto novo;


6. 22 -> Um inteiro positivo que especifica a altura do campo de texto novo.

Feito isso iremos dizer que tipo de textField nós iremos querer. Digite o seguinte código:



Isso significa que a caixa de texto pode ser editada, existem três tipos:

1. INPUT -> Esta é uma caixa de texto você pode editar o texto. Você pode usar isso para que os usuários insiram números, nomes, ou outro texto. Este texto é selecionável;


2. DYNAMIC ->Esta é uma caixa de texto que só pode ser editadas pelo código. Você pode usá-lo para mostrar a pontuação de um usuário, ou outras informações que podem mudar. Este texto é selecionável;


3. STATIC ->Este é um tipo de texto que você não pode criar com o código. Você deve usar as ferramentas gráficas para criar texto estático. Este tipo de texto não é selecionável.

Depois de feito isso você agora vai dizer o máximo de caracteres que irá suportar seu TextField (no máximo 16 caracteres) e finalmente o que irá aparecer na tela:

Nosso código irá ficar assim:



Pronto temos tudo pronto para executar nosso primeiro aplicativo Flash Lite, salve seu projeto em uma pasta. Para executar seu aplicativo você vá na aba Control->Text Movie->in Device Central:



Ou no atalho do teclado Ctrl+ENTER. Feito isso vai abrir o Device Central com emulador:



Pronto temos nosso primeiro Hello World feito em ActionScript 2.0:

Agora faremos um Hello World mais fácil, usando as ferramentas do Adobe Flash.

Repita os mesmos passos para criação do projeto feito isso. Na Tela de edição, colocaremos um campo de texto, clicamos na ferramenta Text Tool e colocamos um campo de texto na nossa tela:






Na tela de propriedades você pode editar a fonte do texto, tamanho, cor etc. No campo Variable você digita o nome da variável que iremos usar para mostrar no campo nosso texto. Coloquei o nome de mainText.

Feito na TimeLine clique no primeiro frame (como nos passos anteriores para colocar um código actionscript) e tecle F9, que é o atalho para abrir a janela Action e na tela você digita esse código simples:



E pronto. Tecle Ctrl+Enter e o resultado é o seguinte:




Isso é tudo pessoal, para mais informações vai a seguir links da própria Adobe que ajudam no desenvolvimento:

http://www.adobe.com/support/flash/

Aqui você encontra dicas sobre o Adobe Flash, ActionScript, instalação etc.