Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina...

Universidade do Vale do ParaíbaColégio Técnico Antônio Teixeira Fernandes

Disciplina Programação Orientada a objetos II.

Material III-Bimestre

Caixa de Combinação,Caixa de Lista, Botão de Rádio, Botão de verificação,Painel de rolagem

Barra de Rolagem, Manipulando dados dos objetos de interface, Controlando as propriedades

de um filme.Criando Funções e procedimentos.

e-mail : http://www1.univap.br/~wagner

Prof. ResponsáveisWagner Santos C. de Jesus

2

Objetos de controle

Objeto

Caixa de Lista

Caixa de Combinação

Barra de Rolagem

Botão de Rádio

Botão de Verificação

Métodos e propriedades de controleEvento

3

Icones que representam os objetos

*

Os objetos acima mencionados permitem que o usuário possua maior facilidade no contato com uma interface desenhada em uma aplicação.

4

Caixa de lista

Propriedades Valor

Labels Determina títulos da caixa

Data Determina dados da caixa

Select Multiple Informação booleana que determina o tipo de seleção da caixa de texto.

Change Handler Função a ser executada mediante a seleção da caixa.

5

Adicionando dados em uma lista

Método : addItem() – em tempo de execução.

Exemplo :

_root.lista.addItem("Banana");_root.lista.addItem("Laranja");_root.lista.addItem("Abacaxi");

6

Capturando informações de uma lista

Método : getvalue() – Selecionadas pelo usuário.

Exemplo :

str1 = _root.lista.getValue();

7

Capturando os elementos por intermédio de índices.(Lista)

Método : getItemAt(<ExpN>) – com a propriedade Label ou Data.

Exemplo :

items = _root.lista.getItemAt(0).Label;

8

Contando o número de elementos em uma lista.

Método : getLength()

Exemplo :

tam = _root.lista.getLength() ;

9

Retornando o número do índice selecionado.

Método : getSelectedIndex()

Exemplo :

x = _root.lista.getSelectedIndex();

str1 = _root.lista.getItemAt(x).Label;

10

Removendo elementos de uma caixa de lista.

Método :removeItemAt(<ExpN>);

removeAll(); remove todos os itens.

Exemplo :

_root.lista.removeItemAt(1);_root.lista.removeAll(); // Todos Elementos

11

Caixa de Combinação

Propriedades Valor

Editable Determina se poderá haver ou não edição da caixa.(boolean)

Labels Determina títulos da caixa

Data Determina dados da caixa

Row Count O número de linhas exibidas na caixa de combinação

Change Handler Função a ser executada mediante a seleção da caixa.

12

Observação : Todos os métodos válidos para a caixa de lista também são equivalentes para a caixa de combinação.

13

Caixa de Verificação

Propriedades Valor

Label Mensagem frontal da caixa

Initial Value Determina se a caixa irá aparecer marcada ou não (boolean)

Label Placement Determina se o marcador irá aparecer a esquerda ou direita da caixa.

Change Handler Função a ser executada mediante a seleção da caixa.

14

Capturando informações da caixa de verificação.

Método : getValue() – retorna true caso a caixa seja selecionada ou falso caso contrário.

Exemplo :

if(_root.chk.getValue()) trace(“Ok”);

else trace(“Não Selecionado !!”);

15

colocando informação na caixa de verificação.

Método : setValue(<ExpL>) – Marca a caixa ou desmarca usando um valor booleano.

Exemplo :

_root.chk.setValue(true);

16

Propriedades Valor

Label Mensagem frontal dos botões

Initial State Determina o estado do botão (boolean)

Group Name Nome do grupo de botões.

Data Determina dados da lista dos botões.

Label Placement Determina se o marcador irá aparecer a esquerda ou direita da caixa.

Usando botões de rádio

17

Capturando seleção de botões de rádio.

Método : getValue() – retornar o índice correspondente a opção selecionada no botão.

Exemplo :

indice = _root.radioGroup.getValue();

18

Habilitando um botão de rádio em tempo de execução.

Método : setState(<ExpL>);

Exemplo :

_root.r1.setState(true);

Onde r1; nome da instância individual do objeto.

19

Polimorfismo

Grande parte dos métodos do ActionScript podem ser aplicados a vários objetos, esse conceito e denominado polimorfismo ou seja (herança de um método).

Objeto]Caixa de Texto

Botão de comando

Caixa de Lista

Caixa combinação

Botão de rádio

Caixa de verificação

setEnabled(boolean)

20

Exemplo para desabilitar uma caixa de lista

Método : setEnabled(<ExpL>);

Exemplo :

_root.lista.setEnabled(false);

21

Usando barra de rolagem

setSize() : Envia um valor que determina o tamanho da barra de rolagem.

Exemplo :

_root.scroll.setSize(100);

setHorizontal() : Booleano que determina se a barra irá ficar na horizontal ou vertical; (true/false).

Exemplo :

_root.scroll.setHorizontal (true);

22

Determinando limite da barra de rolagem.

Método : setScrollProperties(<Expn1>,<ExpN2>,<ExpN3>);

<ExpN1> : Tamanho do indicador da barra.

<ExpN2> : Limite inferior do deslocamento da barra.

<ExpN3> : Limite superior do deslocamento da barra.

Exemplo :

_root.scroll.setScrollProperties (3, 0, 100);

23

Capturando informação da barra de rolagem

Método : getScrollPosition() – retorna um número correspondente a posição da barra de rolagem.

Exemplo :

_root.texto =_root.scroll.getScrollPosition();

24

Funções e Procedimento

Uma função nada mais é do que um pequeno fragmento de código que retorna um valor; o procedimento funciona exatamente da mesma forma mas não retorna nenhum tipo de valor.

25

Funcionamento das Funções e Procedimentos

Chamada (função)

Ou Procedimento

Camada

Implementação

Função

Resultado

Função

Procedimento

26

Comando functionPermite criar uma função ou um procedimento.

Sintaxe:

function <nome>(<lista de parametros>) {

<Instruções>

[return <valor>]

}

function <nome>(<lista de parametros>) {

<Instruções>

}

27

Exemplo : function

function somatoria(valores) {

soma = 0;

for(i=0;i<=valores.length-1;i++){

soma+=Number(valores[i]);

}

return soma;

}

28

Exemplo da chamada da function

on (press) {

num = new Array(1,2,3);

trace(_root.somatoria(num));

}

29

Associando um evento na alteração de um objeto em tempo de execução

Objeto setChangeHandler()

Função (FDU)

Estimulo(Usuário Final)

30

Exemplo: setChangeHandler()

lista.setChangeHandler("funcao");

function funcao() {

trace(“Execução da função “);

}

31

Camadas

No ambiente do Flash, muitas vezes se faz necessário associar em layers(camadas) para que se possa desenvolver programas com maior flexibilidade de manutenção e dividir as rotinas escritas em uma aplicação.

32

Para criar uma nova camada basta seguir as informações abaixo.

Clique da direita com o mouse na opção Camada 1

Selecionar Inserir Camada

33

Aplicando rotinas em uma camada

Selecione a camada a ser usada.

Implementação do código

34

Quadros

Para se criar em uma aplicação onde temos várias telas para serem chamadas durante a execução da aplicação é necessário criarmos os quadros (pictures).

Inserir um quadro é necessário para se criar animações e novas telas; usando a linha de tempo.

35

Criando um novo Quadro

Linha de tempo

Quadro Chave

36

Criando um quadro chave

Selecione a opção do menu.

Clique da direita do mouse.

37

Realizando troca de quadros

Método: gotoAndStop(<expN>|<expS>);

<ExpN> : Determina o número do quadro a ser apresentado na cena.

<ExpS>: Poderá ser usado como opção o nome do quadro.

38

Aplicação do método : gotoAndStop()

on (press) {

_root.gotoAndStop (2);

}

on (press) {

_root.gotoAndStop (1);

}

39

Movimento de quadros

Quadro-1

Quadro-2

Quadro-n

Temporizador 12 qps

40

Parando a movimentação dos quadros.

Método : stop() – interrompe a transição de um quadro para outro. (deve ser colocado no palco).

Exemplo :

stop();

41

Carregando URL

Aplicação ActionScript

Navegador de Internet (Browser)

42

Carregando uma página em ActionScript

Método : getURL() – Carrega uma página direto de um programa AS.

Exemplo :

_root.getURL (<url>[,janela],[metodo]);

url – Caminho da páginajanela – Qual janela do browser será exibida.Método – Post ou Get para envio de dados para uma

página.

43

Exemplo : getURL()

on (press) {

_root.getURL ("http://www1.univap.br/~wagner");

}

44

Trabalho com cores

Criando uma instância da classe Color() :

- Instância vem a ser a criação de um objeto.

Exemplo :

cor = new Color(Objeto);

45

Tabela de cores

R(Red) G(Green) B(Blue) Cor

0 0 0 Preto

ff 0 0 Vermelho

0 ff 0 Verde

0 0 ff Azul

ff ff ff Branco

46

Colocando a cor em objeto.

Método : setRGB() – colocar cor em um objeto usando parâmetro hexadecimal.

Exemplo :

cor = new Color(filme);

cor.setRGB(0xff0000);

47

Observação

Durante a execução do programa não existe a possibilidade de instanciar novamente a classe Color(); para que isso seja possível é necessário criar um conceito denominado de Transformação.

48

Aplicando Transformação de cores

Método : setTransform() : definição da cor usando valor decimal.

Exemplo :

cor.setTransform(objetocor);

49

Parâmetros de transformação

Propriedade Funcionalidade

ra Porcentagem do componente vermelho(-100 a 100)

rb Deslocamento do componente vermelho (-255 a 255)

ga Porcentagem de componente verde (-100 a 100)

gb Deslocamento do componente verde(-255 a 255)

ba Porcentagem de componente azul (-100 a 100)

bb Deslocamento do componente azul (-255 a 255)

aa Porcentagem do canal alpha (-100 a 100)

ab Deslocamento do canal alpha (-255 a 255)

50

Aplicando : setTransform()

filme

Objeto (Cor)Objeto

(Transformação)

Definir parâmetros

TransformaçãoTransforma a cor

setTransform()

51

Exemploon (release) {

// cria um objeto de corcor = new Color (_root.filme);

// cria um objeto de transformaçãonovaCor = new Object();

// define os parâmetros de transformaçãonovaCor.ra = 100;novaCor.rb = 255; //RnovaCor.ga = 100;novaCor.gb = 0; //GnovaCor.ba = 100;novaCor.bb = 0; //B

// transforma a cor do clipecor.setTransform(novaCor);

}

52

Modificando propriedade de um objeto em tempo de execução

setStyleProperty

Objeto

setStyleProperty

Modificando propriedades

Efeito

53

Propriedades

Propriedade Valor

selection Cor (Hexadecimal)

textFont Tipo da fonte

54

Exemplos

Muda a cor da barra de rolagem de uma caixa de lista.

Exemplo :

listBox.setStyleProperty("selection",0xff0000);

Muda o tipo da fonte dos botões de radio.

Exemplo:radioGroup.setStyleProperty("textFont", “Arial Black”);

55

Painel de Rolagem

Propriedades Valor

Scroll Content Símbolo da biblioteca a ser exibido.

Horizontal Scroll Ativa a barra de rolagem Horizontal (auto/true/false)

Vertical Scroll Ativa a barra de rolagem vertical (auto/true/false)

Drag Content Permite movimentar a imagem arrastando o mouse(true/false).

56

Colocando um símbolo na biblioteca

Selecione a opção do menu

Selecione a opção Importar

57

Selecione o arquivo (jpg) da caixa de dialogo abaixo

Selecione o arquivo a ser importado

58

Click da direita do mouse na figura.

Selecione a opção converte símbolo

59

Selecione as opções marcadas

Escreva o nome do símbolo a ser criado.

Selecione a opção para vincular o símbolo ao programa.

60

Observação

Feitos os passos anteriores a figura do palco deve ser apagada.

61

Vinculando símbolos ao ScrollPane

ScrollPane

setScrollContent()

Biblioteca(símbolos)

62

Aplicando Símbolos da bibilioteca

Método : setScrollContent(<ExpS>) : Insere uma figura a um objeto ScrollPane.

Exemplo :

_root.scrollPane.setScrollContent("sala")

63

Programa Exemplo

on (press) {

_root.scrollPane.setScrollContent("sala")

}