Você está sendo redirecionado para a nova página do Brasil High Tech

Arquivo do blog »

31 outubro, 2009 | Comente

Sistema de login e senha no flash



Olá pessoal, hj iremos ver cmo montar um sistema de login e senha no flash, sem uso de banco de dados...

Então vamos la....

Abrindo um novo documento no flash, iremos criar duas layers.... assim:



A layer layout terá apenas uma frame com o visual do nosso sisteminha de login e senha...
e na layer textos terá 3 frames... na primeira frame terá o seguinte código:

stop();
login = "";
senha = "";
status = "";
login.tabIndex =1
senha.tabIndex = 2
btn.tabEnabled = false
status.tabEnabled = false


Esse código fará com que ao sair do seu usuário ele estará cm os campos de entrada de textos e o campo dinâmico q retornará a mensagem de erro caso o usuario e a senha não batam estejam limpos... e com que ao usar a tecla TAB ele apenas navegue pelos campos de entra usuario e senha, e não passe pelo botão entrar ou pelo campo status.
Agora na primeira frame da layer layout faremos a parte visual com dois textos estáticos mesmo e criaremos o botão entrar, e instanciaremos esse botão entrar de btn... e na layer textos, colocaremos dois imput text, e daremos os nomes das variáveis de cada um cmo login e o outro de senha, no campo senha, va la na barra de propriedades e do lado de onde vc bota a variável tem um campo que deverá estar seleciona a opção single line, troque para PASSWORD e tbm colocaremos um dinamic text e daremos o nome da variavel cmo status... assim



Agora vamos as actions do nosso botão entrar... fica assim:

on(release) {
if (login == "flash" and senha == "123456"){
gotoAndStop("flash");
} if (login == "jgcweb" and senha == "jgc123") {
gotoAndStop("jgc");
} else {
status = "Dados incorretos";
}
}


Explicando as actions.... Bom ele fará uma verificação ao clicar e soltar, se o campo login for igual a flash e o campo senha for igual a 123456 ele va e pare na frame flash, e se o campo login for igual a jgcweb e a senha for jgc123 ele va e pare na frame jgc, ou se os campos não combinarem, no caso o usuário e senha não bater conforme o panejado ele retorne a mensagem: Dados incorretos no campo dinâmico instanciado cmo status..

Simples não!? Ele faz uma pequena verificação dos campos e retorna a vc...

Feito isso, criaremos mais duas layers em branco e colocaremos o conteúdo no meu caso apenas uma mensagem... e pra cada frame nos instanciaremos elas tbm... uma cmo "flash" e outra cmo "jgc" sem aspas... ahhh tbm instanciaremos a 1ª frame q no caso é onde esta os dois campos de entrada de texto, deem o nome de usuarios. (vai servir pra o botão sair)
e para fazer isso vcs selecionam a frame e nas propriedades tem o campo Frame e embaixo tem Label type... no label type deixaremos name e no frame colocaremos o nome da nossa frame.. assim:



E pronto, depois de dar os nomes as frames é só criar um botão sair e botar em cada frame instanciada... dae nas actions do botão sair vcs colocam:

on(release) {
gotoAndStop("usuarios");
}

Usuario: flash
Senha: 123456
ou
Usuario: jgcweb
Senha: jgc123

Abraço a todos e até o próximo tuto...

Continue Lendo...

Mais |

| Comente

JavaScript - Variaveis e Valores



Hoje vamos aprender um pouco sobre as variáveis e valores, vou falar bem detalhadamente para que mais pra frente, quando começar a criar os scripts não haja duvidas.



As variáveis são objetos que servem para aguardar informação. Ela permitem da nomes a cada um dos fragmentos de informação com que temos que lidar. Se esses nomes forem bem escolhidos fica fácil saber onde é que se deve guardar um determinado pedaço de informação e onde é que se pode ir buscar a informação que se guardou antes. Para evitar erros e aumentar a produtividade é importante escolher nomes que descrevem aquilo que cada variável guarda. Assim, se escrevermos um programa que divide dois números é recomendado chamar dividendo, divisor e quociente os números envolvidos na operação. Escolha por exemplo n1, n2 e n3, apesar de funcionarem, provocam confusão e dão origem a erros difíceis de detectar porque tornam o código mais difícil de ler.



Essas são as regras para escolher o nome para a variável.



Todos os nomes têm que começar com uma letra ou com o caractere _ .



Os restantes caracteres que compõem o nome podem igualmente conter números. É importante lembrar que em JavaScript, as letras maiúsculas e letras minúsculas são coisas diferentes.




Declaração de Variáveis



Ao ato de criar uma variável se dá o nome de declaração. As variáveis que são declaradas fora de qualquer função são designadas por variáveis globais. Global quer dizer que a variável em questão pode ser utilizada em qualquer parte do script. Quando uma variável é declarada dentro de uma função ela será uma variável local porque só pode ser utilizada dentro dessa função, então fica a regrinha - Global pode ir pra qualquer parte do script e Local só pode ser utilizada dentro da função.



Se tentarmos acessar uma variável local fora da função em que ela foi declarada será gerado um erro porque a variável só existe no universo da função em foi declarada, ela não faz parte do mundo exterior a essa função e como tal, não pode ser utilizada.



Exemplo de declaração de variável



dividendo = 12;

divisor = 3;

sabor = "Doce";

pi = 3.14159;



Neste exemplo, todas as variáveis declaradas serão variáveis globais. Se quisermos declarar variáveis cuja existência se limite a uma pequena sessão do código teremos de usar a declaração var, assim: var dividendo = 12;



Se usarmos esta declaração fora de qualquer função então, porque a variável é declarada na base da estrutura de código, ela será global.



Temos assim que a declaração var serve para limitar o contexto em que a variável existe e que:



As variáveis declaradas sem a declaração var são variáveis globais;

As variáveis declaradas usando a declaração var existem apenas no contexto em que foram definidas



Antes de começar a escrever código em JavaScript é muito importante planejar o modo como esse será organizado. Deve-se começar a identificar os dados que vão ser utilizados. A seguir escolhem-se os nomes das variáveis que vão guardar esses dados e só depois é que se começa a escrever o código propriamente dito.



Os Valores das Variáveis



A linguagem JavaScript é capaz de reconhecer três tipos de dados:



Números, como por exemplo 12 ou 3.14159

Texto, como por exemplo "Seja bem Vindo ao BHT!"

Valores lógicos (true ou false)

null, que é uma palavra especial que significa que a variável em questão não guarda qualquer valor, está vazia.




Convenções de Valores



A linguagem JavaScript exige pouco trabalho ao programador para definir o tipo de dados que uma variável deve guardar. É o próprio interpretador de JavaScript que em função dos dados que recebe decide se estes representam um numero, texto ou um valor lógico, ou nada (null).



var resposta = 42;



O interpretador decidirá guardar internamente a variável resposta como um número inteiro, mas se escrevermos:



var resposta = 42;

resposta = "Seja bem Vindo ao BHT!";



Ao chegar a segunda linha de código, o interpretador mudará de ideia e a variável resposta deixará de ser guardada internamente como numero inteiro para passar a ser guardada como texto (Ou String). Esta conversão no tipo da variável acontece de forma automática e o programador não precisa fazer nada para que ele aconteça.



No próximo tutorial vamos começar a trabalhar uns códigos para podermos executar muitas ações úteis nas nossa paginas ok, essas introduções podem parecer chatas, mas é extremamente necessárias para que não tenhamos duvidas quando começarmos a colocar a mão na massa de verdade.
Continue Lendo...

Mais |

| Comente

Chuva com ActionScript



Nesse artigo mostrarei como é fácil criar uma chuva no flash usando somente actionscript. Tudo nesse artigo será feito em actionscript se você quiser simplesmente copiar o código e colar no seu flash ele já vai estar funcionando.

Vejam como é simples:



function chuva(qtd_pingo, vel_chuva){
_root.duplicador = qtd_pingo

for(i=0; i<=_root.duplicador;i++){
_root.createEmptyMovieClip("pingo" + i , i)
_root["pingo"+ i].moveTo(20,20)
_root["pingo"+ i].lineStyle(1,"0xcccccc", random(100))
_root["pingo"+ i].lineTo(20,3)
_root["pingo"+ i]._x = random(Stage.width)
_root["pingo"+ i]._y = random(Stage.height)
_root["pingo"+ i]._rotation = 135
}

onEnterFrame = function(){
for(i=0; i<=_root.duplicador;i++){

if(_root["pingo"+ i]._y>Stage.height){
_root["pingo"+ i]._x = random(Stage.width)
_root["pingo"+ i]._y = random(Stage.height)

}
else{
_root["pingo"+ i]._y += vel_chuva
_root["pingo"+ i]._x += vel_chuva
}

}


}
}
chuva(200,20)



Trabalhamos praticamente em função do modo createEmptyMovieClip Ele vai criar o objeto até o numero de pingos determinado. Abaixo eu gero o movimento dele e consequentemente sua velocidade, atribuida a função. O mais interessante é, quando o pingo sai da tela eu faço voltar para o stage mantendo um loop infinito dessas ações (if(_root["pingo"+ i]._y>Stage.height){). Gostaram? QQ dúvida estamos aeh! :)

Fonte: Plug Masters
Continue Lendo...

Mais |

30 outubro, 2009 | Comente

Criando dente de vampiro



01. Pressione Ctrl+O e abra uma foto qualquer, no caso deste tutorial usaremos a foto abaixo.



tutoriaisphotoshop.net



03. Pressione Ctrl+J para duplicar a layer, pressione a letra L do teclado para selecionar a Polygonal Lasso Tool, crie cuidadosamente uma seleção da ponta do dente canino como na foto abaixo.



tutoriaisphotoshop.net



04. Pressione Ctrl+T para abrir a caixa de Free Transform, estique o dente como na foto abaixo, pressione Enter para finalizar a transformação.



tutoriaisphotoshop.net



05. Repita o processo no outro dente.



tutoriaisphotoshop.net



06. Pressione Ctrl+D para desabilitar a seleção, sua imagem deverá ficar como a da foto abaixo.



tutoriaisphotoshop.net



07. Pressione a letra O do teclado para selecionar a Sponge Tool e defina os valores abaixo na barra de opções da ferramenta.



tutoriaisphotoshop.net



08. Passe em todo o corpo da modelo com excessão da área ao redor dos olhos, sua imagem deverá ficar como a da foto abaixo.



tutoriaisphotoshop.net



09. Agora pressione Shift+O para selecionar a Burn Tool, defina os valores abaixo.



tutoriaisphotoshop.net



10. Passe a ferramenta nas áreas ao redor dos olhos e lábios, no final sua imagem estará como a da foto abaixo.



Continue Lendo...

Mais |

| Comente

Recrutamento de postadores






Salve pessoal, estamos recrutando novos postadores para o BHT!, se vc estiver interessado em participar da nossa equipe primeiro terá que estar dentro das nossas normas:

1°-Ter interesse em participar;
2°-Postar sempre que possivel (no minimo 4 (quatro) vezes por semana);
3°- Não ter vergonha de suas postagens;
4°- Publicar matérias interessantes, nada de balela;
5°- Não postar downloads ilegais;
6°- Não utilizar muito as girias;




Ok!!!, estou dentro e quero continuar...

Então Add ao msn Contatobht@hotmail.com ou preencha o furmulario abaixo.


Continue Lendo...

Mais |

29 outubro, 2009 | Comente

Olhos Multicoloridos.



01. Pressione Ctrl+O e abra uma foto qualquer, pressione Ctrl+J para duplicar a layer.



tutoriaisphotoshop.net



02. Pressione a letra M do teclado para selecionar a Elliptical Marquee Tool, com a tecla Shift pressionada clique e arraste para criar um círculo ao redor da íris como na foto abaixo.



tutoriaisphotoshop.net



03. Vá em Image> Adjustments> Desaturate ou pressione Ctrl+Shift+U para retirar a saturação da área selecionada, pressione Ctrl+Shift+Alt+N para criar uma nova layer, pressione a letra G do teclado para selecionar a Gradient Tool, na barra de opções da ferramenta defina os valores abaixo.



tutoriaisphotoshop.net



04. Aplique o gradiente dentro da seleção como na foto abaixo.



tutoriaisphotoshop.net



05. Pressione Ctrl+D para desabilitar a seleção e mude o modo de blend da layer para Overlay, caso a cor fique muito saturada você pode diminuir a opacidade da layer ou ir em Filter> Blur> Gaussian Blur e aplicar um valor baixo de Gaussian Blur para amenizar o efeito, no final seu olho estará como o da foto abaixo.



tutoriaisphotoshop.net

Continue Lendo...

Mais |

28 outubro, 2009 | Comente

JavaScript - Organizando seus Códigos usando Comentários



Hoje vamos aprender a função dos comentários nos códigos JavaScript, estes códigos também são usados em algumas situações como no CSS ou mesmo para definir um determinado trecho de códigos HTML. Como nos casos anteriores, os comentários nos permite descrever o código JavaScript que produzimos tornando-o mais legível e mais fácil de manter. Se comentar adequadamente o código que produz, quando mais tarde precisar de o melhorar ou alterar alguma coisa, será mais fácil e rápido perceber o que fez antes. Se você desenvolver um código para partilhar com outras pessoas, então os comentários são ainda mais importantes para que os outros percebam aquilo que você escreveu.

Em JavaScript, podemos usar comentários com uma única linha e comentários com varias linhas. Os comentários com uma única linha começam com os caracteres //. Isto dá ao interpretador de JavaScript a indicação de que o resto da linha é um comentário, deste modo este ignora o resto da linha, continuando a interpretar o código na linha seguinte.

Um comentário que se estende por varias linhas começa com a sequência de caracteres /* e continua até ser encontrada a sequência de caracteres */, que marcam o fim do comentário. O trecho que estiver dentro destes caracteres são ignorados pelo navegador, que só começa ler os códigos depois que encontra o fim do comentário, no caso o */.

Ex: // Comentário de uma única linha

/* comentário de uma única linha, mas que poderia ocupar mais */

/* Comentário ocupando varias linhas. tudo que
estiver aqui dentro será ignorado pelo
interpretador de javascript */

Esta é uma maneira de deixar seus codigos bem organizados para que, fique facil de encontrar quando precisar mudar alguma coisa.
Continue Lendo...

Mais |

| Comente

Como transformar uma foto em uma figura entalhada na pedra.



01. Pressione Ctrl+O e abra uma foto qualquer, no caso deste tutorial usaremos a foto abaixo.



tutoriaisphotoshop.net



02. Usando uma ferramenta de seleção qualquer (Lasso Tool, Pen Tool, Quick Mask etc) selecione a pessoa na foto, com a seleção criada pressione Ctrl+J para duplicar apenas a área selecionada para uma nova layer, clique na layer Background (com a foto original) e vá em Layer> Hide Layers para retirar a visibilidade da layer, clique na layer copiada e pressione Ctrl+Shift+U ou vá em Image> Adjustments> Desaturate para retirar a saturação da imagem.



tutoriaisphotoshop.net



03. Sua imagem deverá ficar como a da foto abaixo.



tutoriaisphotoshop.net



04. Agora pressione Ctrl+Shift+Alt+N para criar uma nova layer, escolha a cor #757575, pressione Alt+Backspace (a tecla acima do Enter) ou pressione a letra G do teclado para selecionar a Paint Bucket Tool e clique no documento para preencher a layer com a cor escolhida, vá em Filter> Texture> Texturizer e defina os valores abaixo, deixe esta layer abaixo da layer com a modelo.



tutoriaisphotoshop.net



05. Pressione a letra D do teclado para resetar as cores de Foreground e Background para preto e branco, pressione a letra X do teclado para alternar as cores de Foreground e Background, sua cor de Foreground deve ser a branca.



tutoriaisphotoshop.net



06. Clique na layer da modelo e vá em Filter> Brush Strokes> Ink Outlines, defina os valores abaixo e pressione Ok.



tutoriaisphotoshop.net



07. Vá em Layer> Layer Style> Inner Glow e defina os valores abaixo.



tutoriaisphotoshop.net



08. Vá em Layer> Layer Style> Outer Glow e defina os valores abaixo.



tutoriaisphotoshop.net



10. Sua imagem deverá ficar como a da foto abaixo.



tutoriaisphotoshop.net



11. Pressione a Ctrl+Shift+Alt+N para criar uma nova layer, escolha a cor #f8951e, pressione a letra B do teclado para selecionar a Brush Tool, escolha um brush de pontas suaves e tamanho médio, passe nas áreas indicadas.



tutoriaisphotoshop.net



12. Agora vá em Filter> Blur> Gaussian Blur e defina os valores abaixo.



tutoriaisphotoshop.net



13. Agora pressione Ctrl+Shift+Alt+N para criar uma nova layer, pressione a letra G do teclado para selecionar a Gradient Tool, defina o gradiente como radial, escolha a cores abaixo e aplique na layer.



tutoriaisphotoshop.net



14. Mude o modo de blend da layer para Hard Light e defina a opacidade em 65%, no final sua imagem estará como a da foto abaixo.



tutoriaisphotoshop.net

Continue Lendo...

Mais |

27 outubro, 2009 | Comente

Senai procura parceiros para lançar gabinete de papelão



Com o objetivo de promover a redução do consumo de materiais não recicláveis, os professores Jorge Roberto Nogueira e Daniel Ferreira Alves estão trabalhando em um projeto de incentivo a reciclagem, é um gabinete feito de papelão, semelhante a um que já foi apresentado nos EUA. O projeto se encontra na unidade Maracanã do Senai.



O gabinete é feito com um papelão tratado e reforçado, o papelão ganhou resistência a água, fogo e cupins, e pode ser personalizado com a cor ou desenho ao gosto do cliente. O projeto ganhou o nome de RECO (Reciclável e Ecológico), o Senai está a procura de parceiros para lançar o gabinete comercialmente. Veja o gabinete sendo montado no vídeo.





Continue Lendo...

Mais |

| Comente

Como criar bordas personalizadas para suas fotos usando brushes.



01. Pressione Ctrl+O e abra uma foto qualquer, no caso deste tutorial usaremos a foto abaixo.



tutoriaisphotoshop.net



02. Sua paleta de layers deverá ficar como a da foto abaixo.



tutoriaisphotoshop.net



03. Pressione Ctrl+J ou vá em Layer> New> Layer via Copy para criar uma cópia da layer.



tutoriaisphotoshop.net



04. Sua paleta de layers deverá ficar como a da foto abaixo.



tutoriaisphotoshop.net



05. Agora vá em Image> Canvas Size.



tutoriaisphotoshop.net



06. Defina os valores abaixo e pressione OK.



tutoriaisphotoshop.net



07. Sua imagem deverá ficar como a da foto abaixo.



tutoriaisphotoshop.net



08. Agora clique no ícone de Create a New Layer no rodapé da paleta de layers para criar uma nova layer.



tutoriaisphotoshop.net



09. Sua paleta de layers deverá ficar como a da foto abaixo.



tutoriaisphotoshop.net



10. Com a tecla Ctrl pressionada clique sobre a miniatura da layer que contém a cópia da imagem, como na foto abaixo.



tutoriaisphotoshop.net



11. Isto irá ativar a seleção ao redor da imagem como na imagem abaixo.



tutoriaisphotoshop.net



12. Agora vá em Window> Paths.



tutoriaisphotoshop.net



13. Clique no ícone de Make Work Path from Selection no rodapé da paleta de Paths para criar um Path a partir da seleção que está ativa no documento.



tutoriaisphotoshop.net



14. Sua paleta de Paths deverá ficar como a da foto abaixo.



tutoriaisphotoshop.net



15. Sua imagem deverá ficar como a da foto abaixo, a seleção deverá se transformar em Path.



tutoriaisphotoshop.net



16. Pressione a letra B do teclado para selecionar a Brush Tool.



tutoriaisphotoshop.net



17. Pressione a letra D do teclado para resetar as cores de Foreground e Background para preto e branco, pressione a letra X do teclado para alternar as cores de Foreground e Background, sua cor de Foreground deve ser a branca, esta será a cor da sua borda.



tutoriaisphotoshop.net



18. Agora vá em Window> Brushes ou clique no ícone de Toggle the Brushes Pallete.



tutoriaisphotoshop.net



19. Em Brush Preset escolha o brush indicado e marque as opções como na foto abaixo



tutoriaisphotoshop.net



20. Agora clique no ícone de Stroke Path With Brush no rodapé da paleta de Paths.



tutoriaisphotoshop.net



21. O brush escolhido será aplicando no Path e sua imagem deverá ficar como a da foto abaixo.



tutoriaisphotoshop.net



22. Caso não tenha gostado da borda que acabamos de criar pressione Ctrl+Z para desfazer a ação, vá em Window> Brushes novamente, escolha o brush indicado na imagem abaixo.



tutoriaisphotoshop.net



23. Vá em Window> Paths para abrir a paleta de Paths e clique no ícone de Stroke Path With Brush, isto irá preencher o Path com o novo brush criando a nova borda, como na foto abaixo.



tutoriaisphotoshop.net



24. Como vocês já puderam perceber é possível criar bordas usando qualquer tipo de brush, para modificar o tamanho do brush usado pressione as teclas [ ou ], depois clique no ícone de Stroke Path With Brush para modificar a largura da borda, caso a segunda borda ainda não tenha ficado muito boa pressione Ctrl+Z para desfazer a última ação, vá em Window> Brushes novamente, clique no pequeno ícone que existe no canto superior direito da caixa de Brushes, como indicado na foto abaixo.



tutoriaisphotoshop.net



25. Escolha a opção Dry Media Brushes para ter acesso a um novo set de brushes.



tutoriaisphotoshop.net



26. Clique na opção Append para adicionar o novo set de brushes aos brushes já exibidos na caixa Brushes.



tutoriaisphotoshop.net



27. Sua caixa de brushes deverá ficar como a da foto abaixo, escolha o brush indicado e defina os mesmos valores usados na imagem abaixo.



tutoriaisphotoshop.net



28. Agora clique no ícone de Stroke Path With Brush na paleta de Paths e sua imagem ficará como a da foto abaixo.



tutoriaisphotoshop.net



29. Pressione a letra E do teclado para selecionar a Eraser Tool.



tutoriaisphotoshop.net



30. Vá em Window> Brushes, escolha o brush indicado na foto abaixo e defina os valores mostrados.



tutoriaisphotoshop.net



31. Clique no ícone de Stroke Path With Brush no rodapé da paleta de Paths e sua borda ficará como a da foto abaixo.



tutoriaisphotoshop.net



32. Agora vá em Window> Layers para voltar para a paleta de layers, clique na layer que contém a cópia da imagem, clique no ícone de Add Layer Style e escolha a opção Color Overlay.



tutoriaisphotoshop.net



33. Na caixa que irá abrir clique sobre a amostra de cor.



tutoriaisphotoshop.net



34. A caixa abaixo ir abrir.



tutoriaisphotoshop.net



35. Clique no documento e escolha uma cor qualquer, no caso deste tutorial a cor da madeira foi escolhida.



tutoriaisphotoshop.net



35. Clique em Ok para aplicar a layer style, sua imagem ficará como a da foto abaixo, como vimos neste tutorial é possível combinar e usar diferentes brushes combinados para criar bordas personalizadas.



tutoriaisphotoshop.net

Continue Lendo...

Mais |
 

KeepGeek

2D || Dicas e Downloads

Castro Info Net

Copyright © 2009-2010 - Todos os Direitos Reservados | Brasil High Tech | Powered by Blogger.com | Google Analytics Alternative