Mostrando postagens com marcador app. Mostrar todas as postagens
Mostrando postagens com marcador app. Mostrar todas as postagens

27 de nov. de 2016

Um pequeno temporizador (ou cronômetro)

Nessa rápida postagem iremos compartilhar com vocês um pequeno temporizador feito em JavaFX.

A ideia é bem simples, um temporizador configurável que pode ser usado como auxílio aos que gostam da técnica pomodoro. Já quem quer aprender JavaFX, esse é só um código de exemplo de uso da classe Animation.

A ideia é bem simples: você escolhe um tempo e o temporizador começa a diminuir aquele tempo tocando um "tick" até chegar a 0 e então um som de bomba explodindo é tocado.


O código não é complexo, veja abaixo e sem seguida uma pequena explicação:

  • A aplicação funciona dependendo da classe Animation que é controlada pelo único botão da aplicação. Criamos uma animação sem fim(sem tempo para parar), mas que a sua execução é controlada pelo botão;
  • Para que seja executado código a cada um segundo, adicionamos um KeyFrame na animação que é executado a cada 1 segundo e tem por ação o método atualizaValores;
  • Quando o botão é clicado, verificamos o estado atual dele (se ele está com texto PARAR ou Começar) e de acordo com esse valor paramos ou iniciamos a animação e também pegamos o atual valor selecionado no slider;
  • No método atualizaValores é onde tudo acontece. Nele atualizamos o valor do label, atualizamos o tempo restante e também tocamos o áudio;
  • O método atualizaLabelTempo é responsável por pegar o valor em segundos e transformar no formato mm:ss, para que seja mostrado no label;
Essa é a ideia básica dessa app feita em menos de 1 hora. Você pode pegar o código no github e melhorar para adicionar mais funcionalidades! Veja abaixo o código final:






20 de ago. de 2016

App de Sorteio usando JavaFX

Nessa postagem rápida, vamos mostrar uma aplicação útil, feita em JavaFX, que usamos nos eventos dos nossos JUG.

O código original foi feito em algumas horas, depois foi melhorado para ser integrado a um Web Service REST de outra aplicação, mas o uso básico é possível para sortear números sem sequer acessar o WS.

Veja o sorteio de números:



Após alguns sorteios você pode ver o que falta sortear e o que já foi sorteado:



Bem, era isso, uma postagem rápida mesmo! Espero que a aplicação seja util a alguém. O código está no github do JUG Vale.

18 de ago. de 2014

[Especial] Eleições 2014: Uma aplicação em JavaFX e apresentando uma API Java

Novamente esse teremos teremos eleições no nosso Brasil. Essas eleições serão especiais não só pelo fato do Brasil ser mais consciente, mas por que nunca estivemos tão conectados.
Nesse clima eu criei essa aplicação média com JavaFX que faz uso de umaAPI de transparência para mostrar dados das eleições.
Embora eu tenha achado a aplicação muito interessante, devo deixar claro que essa aplicação não tem como objetivo substituir o ótimo DivulgaCand, do TSE, mas sim divulgar o projeto do pessoal do transparencia.org e também demonstrar um pouco do que aprendemos aqui nesse blog através de uma "aplicação do mundo real".

Uma API para busca de dados das eleições

Conforme relatei em meu blog pessoal, eu já tive a honra de criar uma API REST para expor os dados das eleições. Esse ano o pessoal do transparencia.org fez uma API muito e mais abrangente do a que eu tinha feito.  O mais legal é que haverá um hackthon esse fim de semana com a API e há muitos exemplos de código e "wrappers" para facilitar o uso da mesma! Nessa postagem iremos usar um só método do Wrapper Java criado pelo Josué Eduardo

Instalando e usando o "wrapper"

A nossa aplicação utiliza Maven e Java 8. Clone o wrapper usando git e então entre no diretório da aplicação e use o comando mvn install para que ela fique disponível para outras apĺicações maven. Assim, podems adicionar o seguinte à nossa aplicação com o objetivo de acessar as classes da API java do transparência:

Agora você tem tudo para começar a codificar Java e usar os dados da eleição, mas precisa de uma chave da API. A chave pode ser adquirida seguindo as instruções no site do dev.transparencia.org.br.

Veja um exemplo de uso do wrapper para listar todos candidatos ao governo de SP:

TransparenciaClient cli = new TransparenciaClient("{Sua chave}");
cli.getCandidatos("SP", "3", null, null).forEach(c -> {
    System.out.printf("%s do partido %s para o cargo %s.\n",
                    c.getApelido(), c.getPartido(), c.getCargo());



Simples, não? Notem que no meu código eu deixei a minha chave, mas, por gentileza, não abusem ;) Conto com vocês! Deixei para facilitar para quem quer só executar a aplicação para testar.

A aplicação JavaFX

A nossa aplicação JavaFX é um projeto maven também. Você pode clonar o código e importar no netbeans. Cuidado com o repositório maven configurado no Netbeans!
Ao abrir a aplicação no netbeans e esperar ele importar as coisas certinhas, e executar a mesma com F6, você deverá ver:




Agora, vamos explicar algumas partes da aplicação e colocar links para aprofundamento do tópico envolvido:

Estrutura da aplicação

A App usa FXML e os campos do FXML são injetados no controller. É lá no controller que pegamos os dados


Os estados

Os estados sob a imagem do Brasil são Label que estão em um grupo. Na inicialização da aplicação temos um for nesses labels para registrar um listener que irá modificar o estado selecionado. Ao clicar no estado também carregamos uma imagem e o nome dele.

Os cargos

Os cargos são botões do tipo ToggleButton. Quando um novo botão do grupo é selecionado, mudamos o cargo selecionado. Cada cargo tem um código e o código é "armazenado" no botão usando o UserData.

Binding no cargo e estado selecionado

O cargo e o estado atualmente selecionados são armanezados em suas respectivas propriedades e quando há a mudança dos valores dos mesmos, iremos atualizar os dados da tabela.

A tabela e a busca de dados

Quando há a mudança do estado ou do cargo, disparamos a busca com os novos valores. Quando está acontecendo a busca, temos uma propriedade que indica que os dados estão carregando, assim disabilitamos a tabela, a seleção de cargos e mostramos um ProgressIndicator usando binding.



Paginação de dados

A API de transparência não nos deixa saber quantos candidatos temos, assim a paginação dos dados fica dificil, mas de qualquer forma, fizemos uma paginação com infinitas páginas, se não houver dados naquela página, não há erro, mas é uma requisição perdida ao servidor... Ao mudar a paginação também pedimos dados para o servidor.

Estilo

Embora a aplicação não tenha sido muito modificada, temos um pequeno CSS para o estilo de algumas coisas. Aceitamos PR se você manjar da parte visual :D

--

Enfim, a paginação e a parte de rodar uma "task" no fundo não foram tratadas nesse blog, mas serão em breve. Veja o código completo para entender melhor:


Próxima parte

Vamos voltar nesse blog com a segunda parte que é abrir uma telinha com detalhes de um candidato selecionado na tabela. Aceitaremos pull request!

Conclusão


Apresentamos uma aplicação com a qual você pode aprender JavaFX e ainda exercer sua cidadania! Mais uma vez eu peço por gentileza para não abusarem da minha chave da API :/
O código inteiro está no github  e gostaria de salientar que a aplicação inteira foi feita em algumas horas, digamos 5 horas corridas, mas isso por que a mesma teve uma mudança de planos e foi reescrita... Um agradecimento especial a minha namorada Luana que ficou programando e desenvolvendo a aplicação comigo em pleno fim de semana! :*

11 de fev. de 2014

A classe Node e seus principais atributos: Aplicação de exemplo

Olá Pessoal,

Na última postagem nós falamos da classe Node do JavaFX. Ela é a classe chave de toda a arquitetura do JavaFX 2 e aprendendo ela de forma efetiva, você vai ficar apto a desenvolver aplicações mais rapidamente!
A nossa aplicação de exemplo usa um nó como algo e o nó pode sofrer diversas modificações. Veja abaixo um screenshot.



O ponto maior dessa aplicação é demonstrar que existem propriedades comuns que são aplicáveis a qualquer classe que está em uma aplicação JavaFX. Logo, no painel à esquerda, notem diversos controles. Eles irão modificar os mais famosos atributos do nó.

A mágica está em trocar o controle para mudar os seus atributos sem mexer em nenhuma outra parte do código. Em termos práticos, você troca de um texto para um botão e os controles do lado esquerdo continuam funcionando e são aplicados sem qualquer outra modificação no código. Em seguida, podemos trocar o botão por qualquer outro controle: figuras, um vídeo, controles, etc... Veja como isso é feito nas linhas de código que selecionei abaixo:

// aqui criamos o nó
Node alvo = criaNo();

// usamos ele em diversos pontos
// aqui vamos "amarrar" as propriedades dos controles da tela com as
// propriedades do nó
sldEscalaX.valueProperty().bindBidirectional(alvo.scaleXProperty());
sldEscalaY.valueProperty().bindBidirectional(alvo.scaleYProperty());
sldRotacao.valueProperty().bindBidirectional(alvo.rotateProperty());

// um listener para os botões que movimentam o nó
EventHandler cliqueBotoesMovimento = new EventHandler() {

 @Override
 public void handle(ActionEvent evt) {
  // de acordo com o botão clicado vamos manipular nosso nó
  Object botaoClicado = evt.getSource();
  if (botaoClicado == btnDecrementaX) {
   alvo.setTranslateX(alvo.getTranslateX() - 1);
  } else if (botaoClicado == btnIncrementaX) {
   alvo.setTranslateX(alvo.getTranslateX() + 1);
  } else if (botaoClicado == btnDecrementaY) {
   alvo.setTranslateY(alvo.getTranslateY() - 1);
  } else if (botaoClicado == btnIncrementaY) {
   alvo.setTranslateY(alvo.getTranslateY() + 1);
  }
 }
};
// muda o efeito
cbEfeitos.getSelectionModel().selectedItemProperty()
 .addListener(new ChangeListener() {
  @Override
  public void changed(
    ObservableValue valor,
    String antigo, String novo) {
   switch (valor.getValue().toString()) {
   case BORRAR:
    alvo.setEffect(efeitoBorrar);
    break;
   case SOMBRA:
    alvo.setEffect(efeitoSombra);
    break;
   case REFLEXAO:
    alvo.setEffect(efeitoReflexao);
    break;
   case NENHUM:
    alvo.setEffect(null);
    break;
   default:
    break;
   }
  }
 });

Se você quiser fazer isso, pegue o código no github importe no Eclipe e localize o seguinte método:

private Node criaNo() {
 // Modifique esse método para criar o nó que você quiser e retornar! O
 // programa vai funcionar independente do nó que você cira
 Text texto = new Text("\\o/ exemplo \\o/  ");
 texto.setFont(new Font(40));

 Rectangle rect = new Rectangle(200, 150);
 rect.setFill(Color.RED);

 HBox caixinha = new HBox(20);
 caixinha.getChildren().addAll(new Rectangle(80, 60), new Circle(30),
   new Button("Um botão de teste"), new Text("um texto"));
 caixinha.setAlignment(Pos.CENTER);

 // crie seus próprios nós e retorne aqui!
 return texto;
}

Veja que há outros possíveis nós que estão no código acima. Use um deles e rode o programa novamente, aí pode brincar com os controles do lado esquerdo e verá que eles se aplicam da mesma forma que o texto anterior se aplicava!

Um ponto interessante desse programa é que eu criei um "handler" genérico para todos os eventos do mouse! Mais detalhes sobre isso pode ser encontrado nesse artigo(em inglês) e mais sobre tratatamento de eventos vocês podem ver nesse artigo aqui no nosso blog.
Outro ponto, e que vamos explicar futuramente, é o uso de Binding. É uma técnica para evitarmos muito código fazer com que duas propriedades tem o mesmo valor e sejam atualizados quando elas mudam o valor. No nosso caso alguns campos do nó alvo têm o seu valor alterado quando mexemos nos controles, veja:

sldEscalaX.valueProperty().bindBidirectional(alvo.scaleXProperty());
sldEscalaY.valueProperty().bindBidirectional(alvo.scaleYProperty());
sldRotacao.valueProperty().bindBidirectional(alvo.rotateProperty());

Há também o uso dos efeitos Reflection, DropShadow e BoxBlur, que vamos abordar futuramente!
Por final, fiz um vídeo usando esse programa para ilustrar melhor o que estou falando.


Divirta-se e avise se tiver qualquer dúvida!