Os diagramas permitem ter uma visão global e detalhada de um projeto ou programa em micro:bit. Os arquitetos usam planos e desenhos para saber o que querem construir. O mesmo vale para diagramas na programação de microcontroladores. Neste artigo vamos conhecer os símbolos e diagramas usados para programar projetos feitos com micro:bit. Diagramas são desenhos que indicam aos programadores e usuários como o projeto é construído.
O placa micro:bit é um pequeno sistema de computador que pode controlar sistemas e circuitos eletrônicos.
Utilizamos o editor gráfico Makecode para programar esta placa.
Além disso, é necessário saber como um projeto é montado, ou seja, ter um diagrama do que se quer montar na placa microbit. Para saber isso, é necessário saber construir diagramas e quais são utilizados em projetos micro:bit. A seguir está uma lista de diagramas usados em projetos micro:bit:
- Diagramas de Casos de Uso.
- Diagramas de atividades.
- Diagrama de Dados.
- Diagramas de estado.
Alguns destes diagramas são utilizados para grandes computadores e como o placa microbit é um pequeno computador e o ambiente de desenvolvimento: "Makecode" é gráfico, eles foram modificados para adequá-los a estas características.
DIAGRAMAS DE CASOS DE USO.
Os diagramas de: "Casos de Uso" são usados para indicar ou informar de forma bem global o que o projeto deve fazer. Em um diagrama de caso de uso, existem 3 elementos utilizados para sua elaboração:
- Autor.
- Caso de uso.
- Sistema.
O “Ator” pode ser entendido como a pessoa que utilizará o projeto. Em alguns livros ou textos eles o chamam de: “Usuário”. O autor é representado nos diagramas de casos de uso, com uma figura como a seguinte:
O Caso de Uso pode ser entendido como os processos que o autor executará e se representa nos diagramas de casos de uso com uma figura como a seguinte, onde Xxxxx representa algum texto dscrevendo o processo que será realizado no projeto.
O “Sistema” pode ser entendido como processos realizados pelo placa microbit e é representado nos diagramas de casos de uso, com uma figura como a seguinte:
Um exemplo de diagrama de caso de uso pode ser muito semelhante ao mostrado na figura a seguir:
Vamos realizar um projeto para entender na prática como desenvolver um diagrama de casos de uso. Suponha um projeto de uma “lanterna” onde o usuário liga e desliga. Além disso, quando a lanterna está desligada, a temperatura é exibida. Assim, temos 3 processos a executar:
1- Ligue a lanterna.
2- Desligue a lanterna.
3- Mostrar a temperatura.
O diagrama de caso de uso pode ser mostrado na figura a seguir:
Depois de fazer o diagrama de casos de uso, podemos fazer o diagrama de atividades, onde são mostradas as ações que o projeto deve executar, do ponto de vista do programador.
DIAGRAMAS DE ATIVIDADES.
O "Diagrama de Atividades" mostra as ações que o projeto deve executar. Os elementos básicos usados em um diagrama são:
- Começo.
- Atividade
- Conector.
- Junção
- Decisão.
- Condição
- Conclusão.
O "início" representa o início do projeto e seu símbolo de representação é:
A "Atividade" representa resumidamente um processo e seu símbolo de representação é:
O “conector” é uma seta que indica quando uma atividade começa ou termina. Seu símbolo de representação é:
A “junção” são setas e barras que podem indicar atividades paralelas. Seu símbolo de representação é:
A “decisão” é usada para representar 2 caminhos a seguir. As decisões geralmente dependem de uma condição, ou seja, o processo será executado se a condição for atendida. Seu símbolo de representação é:
A “condição” é uma regra lógica ou aritmética que deve ser cumprida, para que a atividade ou processo seja realizado. Seu símbolo de representação é:
A “Conclusão” é utilizada para representar o fim das atividades e seu símbolo de representação é:
Como dito anteriormente, o diagrama de atividades mostra os processos que o projeto deve executar. É necessário relacionar alguns elementos do diagrama de atividades com os blocos disponíveis no ambiente de desenvolvimento "Makecode".
Fluxos ou sequências.
Para entender por que o diagrama de atividades utiliza fluxos ou sequências, é necessário entender um pouco como o placa microbit executa os blocos de programação. A ordem é sempre de cima para baixo. Além disso, é muito importante entender o símbolo de: “decisão”.
Na sequência acima, o programa faz uma avaliação, se o resultado for falso, o bloco é executado, se for verdadeiro, pula o bloco e continua a sequência abaixo. Além disso, uma avaliação pode ser feita, como a seguinte:
Vejamos um exemplo prático. Suponha que temos uma variável booleana chamada: "LanternOn" e quando ela tiver um valor de: "false", mostre a temperatura. A sequência será a seguinte:
Ou seja: quando a lanterna está acesa, não é necessário mostrar a temperatura. Os blocos para fazer isso seriam assim:
Lembre-se que os blocos para decisões (condicionais) encontram-se no menu: "Lógica", conforme a imagem a seguir:
É muito importante saber como criar variáveis ??booleanas. Para isso acesse o menu: “Variáveis” e crie uma variável conforme a imagem a seguir:
Em seguida, selecione o bloco: “definir LaternarLigada para” e arraste-o até que caiba no bloco: “at startup” conforme a imagem a seguir:
Agora, vá ao menu: “Logica” e selecione um bloco que retorne um valor booleano, arraste-o até o bloco: “definir LaternaLigada para”, conforme a imagem a seguir:
Outro bloco utilizado para a tomada de decisão é: “se então”, conforme a imagem a seguir:
Este fluxo mostra como algum processo será executado, tanto na verificação falsa quanto na verdadeira.
A forma como é desenhado depende do estilo adotado por cada programador, mais as 2 sequências ou fluxos são válidos. O bloco para fazer esse tipo de verificação está no menu: "Lógica" e é mostrado na imagem a seguir:
Para usar esse bloco na prática, suponha que queremos atrasar uma determinada ação por um tempo. Podemos criar uma variável do tipo inteiro e enquanto ela for maior que zero (0) diminuí-la. Quando a variável chegar a zero, ela pulará para a outra atividade. A figura a seguir ilustra isso:
Os blocos usados para fazer este diagrama seriam semelhantes ao mostrado na figura a seguir:
Observe que quando a variável: "timer" valer 1, será a última vez que passará por essa verificação, pois ainda é maior que zero. Na próxima passagem por esse processo, a variável é zero e a outra condição é atendida.
Outro tipo de sequência utilizada em microbits é realizada quando múltiplas verificações devem ser feitas conforme a figura a seguir:
Como exemplo prático podemos pensar em uma variável do tipo inteiro chamada: "contador" a qual queremos realizar alguma atividade quando vale: 2, 7, 8 e 12. O diagrama pode ser semelhante ao mostrado na figura a seguir :
Para fazer isso com os blocos Makecode, acesse o menu: “Logica” selecione o bloco: “se então, se não”, conforme a imagem a seguir:
Em seguida, clique no símbolo: "+" até ficar semelhante ao mostrado na imagem a seguir:
Agora vá para os blocos de comparação e arraste-os conforme mostrado na imagem a seguir:
Agora faça o mesmo para os outros blocos conforme a imagem a seguir:
Crie uma variável chamada: “counter” e arraste até o bloco: “if not, if then” e edite os valores para comparar conforme a imagem a seguir:
Agora você está pronto para colocar os processos ou blocos a serem executados quando a condição for verdadeira. Outra forma de fazer o fluxograma pode ser como a mostrada na imagem a seguir:
Entende-se que os conectores possuem uma condição para que sejam executados. Se desejar, também pode ser resumido ou reduzido ao diagrama mostrado na imagem a seguir.
Tomando como exemplo o projeto “Lanterna”, visto no diagrama de casos de uso, desenvolveremos a partir deste projeto, o diagrama de atividades. O diagrama a seguir mostra as atividades que o projeto "Lanterna" deve processar:
Como podemos ver, há uma atividade para o início. A seguir, entramos em um join onde existem 3 atividades que podem ser executadas em paralelo. Uma atividade para exibir a temperatura, outra atividade para ligar a lanterna e outra atividade para desligar a lanterna. Em seguida, entramos em outro entroncamento e a partir daí chegamos ao entroncamento superior e repetimos o loop. Podemos ver que as atividades são muito semelhantes aos casos de uso. Pode-se dizer que um diagrama de caso de uso pode ser entendido por qualquer pessoa. O diagrama de atividades é compreendido pelos programadores.
Vamos adicionar uma funcionalidade ao projeto “Lanterna”: que, ao desligar a lanterna, o placa microbit demora 10 segundos para exibir a temperatura. Para isso vamos criar uma variável booleana chamada: “FlashlightOn” e uma variável inteira chamada: “timer”. Assim, você pode verificar quando a lanterna está desligada e fazer um atraso de 10 segundos para exibir a temperatura. A atividade: “Mostrar temperatura” pode ser desenvolvida de forma mais aprofundada e ser algo como o esquema a seguir:
Os diagramas de atividades são muito flexíveis na hora de serem desenvolvidos. Por exemplo, o diagrama a seguir é semelhante ao visto acima.
O programa para o projeto: "Lanterna" seria semelhante a este:
A seguir estão as telas que veremos no projeto: “Lanterna”.
DIAGRAMAS DE DADOS.
Diagramas de dados mostram as variáveis ??usadas no projeto. Por exemplo, para o projeto: “lanterna”, utilizamos 2 variáveis, uma do tipo booleana chamada: “LinternaPrendida” e outra do tipo inteiro chamada: “timer”. O diagrama de dados pode ser como o seguinte:
Se o projeto for muito grande, você pode agrupar as variáveis ??dentro de caixas ou retângulos para classificá-las. Então, podemos nomear o quadrado ou retângulo para generalizar que essas variáveis ??pertencem a uma determinada classe, conforme exemplo a seguir de um sensor de temperatura com alarmes de nível baixo e alto:
DIAGRAMAS DE ESTADO.
Diagramas de estado são usados ??para descrever o comportamento de um projeto. Esse diagrama pode dar ao projeto alguma inteligência ao ser capaz de programar da maneira que queremos que o projeto se comporte. O diagrama a seguir mostra um estilo de desenho para diagramas de estado:
Este é outro estilo usado em textos de programação:
Por ser importante conhecer bem os diagramas de estado, eles serão estudados em um próximo capítulo. Como conclusão, podemos nos familiarizar com os diferentes diagramas vistos e usá-los para o desenvolvimento de projetos. Você também pode usar a criatividade para adaptar esses diagramas ao seu jeito ou estilo de programação. Bons projetos!
