domingo, 10 de setembro de 2017 

tarefa 2 - aula 3

"Discutir o emprego da ferramenta debug no processo de criação de uma aplicação que apresenta, numa janela de 320 px de largura, imagens de 60 x 80 px de acordo com base em duas variáveis globais: h para a quantidade de imagens horizontais e v para a quantidade de imagens verticais."
Primeiramente, debug, segundo o site do processing, é uma ferramenta de depuração, usada para diagnosticar problemas no sketch (esboço?). Após habilitado, o debugger pausa o sketch durante a execução e avança através do código uma linha por vez. Ou seja, debug é o processo de encontrar e corrigir erros de codificação de software.

Segundamente, vamos ao que foi pedido na tarefa: criação de uma janela de 320px de largura (não tem indicação de altura), contendo imagens (não definidas previamente, logo, eu digo quantas são), com duas variáveis globais, h e v. Visto que a questão teve várias interpretações, fiz a atividade de forma que independente da quantidade de retângulos que fosse posto nas variáveis, o canvas se ajustaria.

Tamanho significa o tamanho da tela de acordo com o número de espaços e o número de imagens. Constatei que o Processing 3 não permite utilizar uma variável dentro do size do setup (ao contrário do Processing 2), então pesquisei nas referências sobre o settings (It's only useful when it's absolutely necessary to define the parameters to size() with a variable). O cont_vert é contador utilizado pra auxiliar no cálculo do espaçamento pras imagens na vertical (em pé). Em seguida delimito a criação das imagens na horizontal (deitadas) primeiro, crio uma variavel 'x' para controlar a posição inicial de cada imagem (deitada) e depois que são criadas as imagens na horizontal (deitadas), o resto que sobra é vertical.


Sobre o debug: pelo posicionamento dos breakpoints adicionados, é possível perceber as etapas de construção das formas:
  • breakpoint: entrada do laço;
  • breakpoint: entrada na condicional de criação de quadrados horizontais. Equação para definir posição.
  • breakpoint: retângulo horizontal com posição criada em x.
  • breakpoint: após rodar todas as possibilidades de retângulos horizontais, o programa inicia o cálculo da posição do x para os retângulos verticais.
  • breakpoint: retângulo vertical com posição criada em x.
  • breakpoint: Contador dos retângulos verticais.


O debug auxiliou bastante a construção do programa, principalmente quando estava perdida no posicionamento e quantidade de elementos na tela. Clique aqui para baixar o código comentado. :)

"Explicar o uso da ferramenta debug e exemplificar como ela pode facilitar o desenvolvimento de uma aplicação que posiciona, contiguamente da direita para a esquerda, n quadrados de 50 pixels de lado - sendo n uma variável global definida no início do código"
Como houveram dois slides diferentes para as duas turmas, decidi estudar um tiquinho mais e fazer esse exercício também. Clique aqui para baixar o código. :)