Buscando solução para chamadas complexas ou encadeadas onde é necessário retornar um conteúdo para o chamador de uma rotina com o resultado.

Se temos 2 ou mais chamadas encadeadas para um processo e queremos que o resultado retorne para o primeiro – temos para isto a possibilidade de propagar eventos em objetos ou passar parâmetros como um objeto no todo – creio que é mais comum entre os developers.

Penso para estes caso o uso de “anonimous” pode ser uma solução de fácil implementação não exigindo criar um estrutura complexa de eventos ou objetos cabendo perfeitamente como solução.

Uma das características de anônimos é sua passagem como parâmetro em um procedimento/função e poder esperar um retorno ou um chamada de volta, ou seja, um “callback” de retorno (é um ponteiro que passamos para a chamada e ele é chamado de volta pelo procedimento chamado – callback).

Neste caso precisamos de um procedimento que esteja esperando um tipo de paramento, no caso um “anonimous” ex:

     /// criando um procedimento que aceita um callback 
     TUmObjeto.executar( aCallBack:TProc<String> );
          begin
            // faz alguma coisa
            // chama o callback
            aCallBack( 'ok' );
          end;

na chamada do procedimento podemos então fazer:

/// chamando o procedimento e passando como parâmentro um procedimento "anonimous"
  umObjeto.executar(
     procedure (aDado:String)
        begin
           //.... faz alguma coisa
        end);

O Delphi faz diferenciação de assinaturas entre “procecures” e “functions”, onde as functions retornam algum valor enquanto as procedures não retorna nada (algo equivalente a “void” em outras linguagens);

Sim, é possível usar uma “function” como anônimo, veja:

    /// para procedure:     TProc, ou TProc<tipo>
    /// para function:       TFunc<boolean> ou  TFunc<tipo,boolean>

</tipo,boolean></boolean></tipo>

No caso de TFunc o último parâmetro é sempre o tipo a ser retornado pela “function”;

Codificando no Browser

Um pouco antes de sair de férias peguei uma dica de um youtuber que falava sobre possibilidade de desenvolver  diretamente no browser utilizando uma estrutura de docker. Para quem vem do desktop, aquilo parecia muito estranho e me chamou a atenção.

Por outro lado, tenho alguns projetos em typescript e nodejs que seria perfeitamente aplicável esta ideia. Fui lá conferir o material e fiquei impressionado com facilidade ao utilizar a ferramenta.
De partida queria tentar usar “Flutter” lá na ferramenta, depois de muitas buscas no google cheguei a algumas soluções para configurar o docker a carregar as ferramentas necessária para o desafio que vou descrever aqui em passos a serem seguidos.

GitPod como ferramenta

1 – Ter uma conta no GitHub;
2 – instalar no chrome a extenção https://www.gitpod.io/docs/20_browser_extension/
3 – entrar na conta no GitHub, agora irá ver um novo botão ao lado dos seus projetos “GitPod”; executando o GitPod irá criar uma instância do docker para editar o código do seu projeto;

VSCode – no Docker

Ao criar o GitPod já irá iniciar um VSCode para você editar o código e já vem instalado com algumas extensões para sair usando. Vale a pena ler a documentação do GitPod para ver como que ele funciona, quando irá descobrir que eles não tiveram autorização para baixar as extensões automaticamente para o VSC. Não chega a ser um complicador, basta baixa a extensão desejada para a máquina local (download) e arrastá-la para sobre a pasta de extensões do VSC no browser e ele irá subir a extensão e fazer a instalação lá no docker.

Se estiver trabalhado com Typescript, javascript e outros, talvez já esteja pronto – já para flutter é preciso baixar o SDK e aquelas coisas que já estamos acostumados. Pensando em docker, é possível configurar para fazer o trabalho ao iniciar, ao que passarei a discorrer.

Se ainda não tem um projeto Flutter lá no GitHub, crie uma pasta nova vazia para ele. Se já tem, pode reaproveitá-la para criar o conteúdo necessário a configuração. Neste ponto você já entrou pelo botão do GitPod que aparece no GitHub e já está na máquina do docker, então vamos criar dois arquivos. Vai no terminal (prompt) do VSC e digite “gp init”, isto fará com que o GitPod crie dois novos arquivos na pasta.
Arquivo: .gitpod.yml

image:
  file: .gitpod.Dockerfile

tasks:
  - before: |
      export PATH=$FLUTTER_HOME/bin:$ANDROID_HOME/bin:$ANDROID_HOME/platform-tools:$PATH
      mkdir -p /home/gitpod/.android
      touch /home/gitpod/.android/repositories.cfg
    init: |
      echo "Installing Flutter SDK..."
      cd /workspace &amp;&amp; wget -qO flutter_sdk.tar.xz https://storage.googleapis.com/flutter_infra/releases/stable/linux/flutter_linux_v1.9.1+hotfix.4-stable.tar.xz &amp;&amp; tar -xf flutter_sdk.tar.xz &amp;&amp; rm -f flutter_sdk.tar.xz
      echo "Installing Android SDK..."
      mkdir -p /workspace/android-sdk &amp;&amp; cd /workspace/android-sdk &amp;&amp; wget https://dl.google.com/android/repository/sdk-tools-linux-4333796.zip &amp;&amp; unzip -qq sdk-tools-linux-4333796.zip &amp;&amp; rm -f sdk-tools-linux-4333796.zip
      echo y | /workspace/android-sdk/tools/bin/sdkmanager "platform-tools" "platforms;android-28" "build-tools;28.0.3"
      echo "Init Flutter..."
      flutter channel master
      flutter upgrade
      yes | flutter doctor --android-licenses
      cd /workspace/gitpod-flutter
      flutter pub get
      flutter config --enable-web
      flutter doctor
    command: |
      echo "Ready to go!"
  - command: |
      export PATH=$FLUTTER_HOME/bin:$ANDROID_HOME/bin:$ANDROID_HOME/platform-tools:$PATH
      flutter upgrade
      flutter pub get
      flutter config --enable-web
      flutter doctor
      echo "Ready to start!"
vscode:
  extensions:
    - Dart-Code.dart-code@3.5.0-beta.1:Wg2nTABftVR/Dry4tqeY1w==
    - Dart-Code.flutter@3.5.0:/kOacEWdiDRLyN/idUiM4A==
    - Nash.awesome-flutter-snippets@2.0.3:6jLJSOqEGV5k8R0xYG7Oqg==
A parte da extensions, pode ocorrer que seja necessário instalar elas em separado, fica de exemplo como que eu estou usando.
Arquivo:.gitpod.Dockerfile
FROM gitpod/workspace-full-vnc

ENV ANDROID_HOME=/workspace/android-sdk \
    FLUTTER_ROOT=/workspace/flutter \
    FLUTTER_HOME=/workspace/flutter

USER root

RUN apt-get update &amp;&amp; \
    apt-get -y install build-essential libkrb5-dev gcc make gradle openjdk-8-jdk &amp;&amp; \
    apt-get clean &amp;&amp; \
    apt-get -y autoremove

Agora que já tem os arquivos de configuração do docker é necessário parar a área de trabalho “stop workspace” que fica lá nas opções de usuário (no menu do avatar) e depois iniciar novamente o workspace quando será instalado o SDK e deixar tudo configurado para iniciar o trabalho.

Se for mais confortável, pode fazer um fork de https://github.com/amarildolacerda/flutter_dart e pegar as configurações diretamente no projeto – ainda de brinde vai alguns exemplos que tenho usado no aprendizado.

Se gostou, deixa os seus comentários para que eu me reoriente as novas publicações.

Gratidão e bom uso.

Um movimento rápido e crescente vem acontecendo com o Framework Flutter desde o seu lançamento em Novembro/2018 pela equipe do google.

É inegável a curiosidade inicial se tornar um forte interesse em conhecer seu funcionamento.
Em geral um material para abordar um nova linguagem deveria iniciar fazendo sua introdução. Como já é possível encontrar material suficiente na internet para iniciar o trabalho – creio ser desperdício de tempo dedicar tempo para isto quando já tem muitas pessoas falando ou escrevendo a respeito.

Não tenho dúvida que o principal diferencial de Flutter, além da sua beleza em produzir material de qualidade é a velocidade que se pode escrever um novo projeto utilizando o framework. Trabalhando com o Flutter passei a entender ser a produtividade seu principal ponto forte.

Flutter x Dart

O Dart como linguagem de suporte ao framework do Flutter é uma derivação inicial do javascript o que deixa todo iniciante bem a vontade se teve algum contato com javacript em sua trajetória anterior. Depois de seu descolamento do javascript passou a ter novas funcionalidades, mesmo que ainda possa gerar um código puro javascript quando utiliza o dart2js para fazer um transpiler entre as linguagens.

Transpiler

Transpiler parece mesmo ser a nova tendência que as novas linguagens vem usando como sinônimo para escrever códigos em uma linguagem e distribuir para outra linguagem ou plataforma.
Como tal Dart com flutter é capaz de gerar código para iOS, Android, WebBrowser e soluções para Desktop em gestação.
Amantes do NodeJs encontrarão no Dart suporte para gerar soluções de aplicações servidoras tão poderosas quanto ao NodeJs o que torna o Dart uma solução imbatível se levar em consideração o potencial de troca de bibliotecas entre as várias opções que suporta.

Packages para Flutter

Instalar Flutter é bem simples, basta seguir as instruções da página principal em Instalar Flutter .
Concluído a instalação já é possível sair criando aquele projeto “ALO MUNDO” tradicional sem muita dificuldade. Quer saber mais Exemplo.
A comunidade se movimentou muito rápido em torno do Flutter e vem disponibilizando um crescente número de pacotes adicionando novas funcionalidades, widgets e recursos visuais, então não deixa de dar uma passadinha no Repositório de Pacotes onde irá encontrar exemplos e modelos de como inserir os pacotes no seu aplicativo.

Widgets

Não entender Widget é próximo do impossível trabalhar com Flutter, então não perca tempo, vai logo tomando contato com uma infinidade de Widget Flutter que estão disponíveis. Para entrar em contato com uma documentação mais completa é possível ver diretamente nos fontes do próprio flutter, basta seguir os códigos fontes de origem, ou ainda fazer acesso na página de documentação do flutter. Mesmo depois de um bom tempo, ainda tenho alguma dificuldade em entender aquela documentação que apresenta exemplos em poucas páginas o que vem sendo construído ao longo do tempo. Se este for o seu caso o melhor caminho é ir direto no Youtube e procurar por Flutter e encontrará farto material para estudar e iniciar sua trajetória.

DartPad – Experimentando Dart

Que dar uma palhinha para medir o potencial do Dart.
É possível fazer simulações diretamente no seu browser usando o DartPad digitando o código Dart diretamente no editor de texto e RUN para obter o resultado.

Um exemplo para testar:

void main() {
  var cores = ['azul', 'amarelo', 'vermelho', 'preto'];

  var resultado = [
    'pink',
    for (cor in cores) cor,
    'verde'
   ];

  print('Result1');
  print(resultado);

  print('Result2');
  print([...resultado,...cores]);
}

resultados:

Result1
[pink, azul, amarelo, vermelho, preto, verde]

Result2
[pink, azul, amarelo, vermelho, preto, verde, azul, amarelo, vermelho, preto]

Por onde passo encontro os amigos a perguntar o que eu vi de interessante na China.

Em uma viagem de 20 dias visitando empresas de tecnologia e tendências na China, por si é uma grande experiência. Mas a diferença mesmo esta em como a cultura chinesa assimilou a tecnologia.

A Harmonia

Na China encontramos o trem rápido de maior extensão que já soube, é lá também que temos as maiores contradições convivendo no mesmo espaço. Ao mesmo tempo que você pode comprar um robô na rua – aqueles que fazem limpeza, ou outros que podem estabelecer um diálogo e responder sobre algum tema – no mesmo espaço podemos encontrar alguém com um instrumento rudimentar de limpeza daqueles que só encontramos lá nas “coisas da roça“.

Trem rápido na China

Trem rápido

O Planejamento

Ver como o planejamento é fundamental para tudo é muito gratificante. Quando digo planejamento, não me refiro a ter um papel que marca um determinado plano, falo sim da crença (a certeza) que as pessoas tem que um determinado plano de ação será inciado e acabado em acordo com aquilo que esta no papel. A certeza que se há um plano de passar uma rodovia em um determinado local em uma data e que estará pronto – parte determinante da crença – até intrigante ver como empresas e pessoas se organizam em torno do plano de uma avenida se antecipando com a construção de negócios onde nem foi levado a cabo a construção do avenida em si – A certeza que surfar a melhor onda precisa estar no mar, com prancha pronta e espírito confiante. A certeza que chegar tarde é pegar uma fila gigantesca e rezar para alguém desistir do intento.

Tecnologia, Tecnologia… Tecnologia

Bem a tecnologia, sim ela mesma é um dos fatores mais desafiadores. Não há um individuo no metro que não esteja ocupando o seu tempo para fazer uso do celular. Celular é algo que faz parte da vestimenta das pessoas muito mais que aqueles que conhecemos pelas nossas bandas.
Focando em como o celular é base para tudo é fácil entender sua importância, basta associar ao fato que os PCs (computadores) foram praticamente banidos da transição do manual para o digital – é o celular o responsável por um salto na forma de vida das pessoas.
A chegada do digital é outro ponto que marca muito. Cartão de crédito é um artigo desconhecido da maioria das pessoas – houve um salto do papel moeda para o pagamento digital sem passa pelo plástico – isto faz toda a diferença.

QR-CODE como moeda digital

Pode-se até encontrar um mercadinho de vila que ainda recebe um papel moeda – mas o QR-CODE é representação mais comum em todos os cantos que andamos. De outro lado, ir a um mercado desses mais estruturados pode representar um grande desafio para um estrangeiro que não possui conta em um banco Chinês – tão não digitalizado que pode não encontrar um caixa para efetuar o pagamento de suas compras.
Não esqueçamos da estrutura de aplicativos e como são organizado nos celulares das pessoas. Fiquei observando como utilizam o WeChat enquanto estava no metro – dei aquela olhadinha ao lado para ver o que as pessoas fazem – muito interessante como eles se concentram naquelas loja de artigos de moda e essas coisas vem tornando-os consumistas indomáveis como os nossos do ocidente.

Uma nova PlayStore !

Nossos aplicativos são centrados em um plataforma “Store” que o sistema operacional distribui, mas na China é um pouco diferente. Você ainda consegue baixar um aplicativo na “Play Store”, se ele for permitido na China, no entanto a forma de distribuição é diferente. É mais comum o WeChat diretamente distribuir seus próprio mini-aplicativos na plataforma – e lá no WeChat – se faz de tudo. Você pode comprar produtos no mercado, pagar contas (essas pessoais) – mas pode também no mesmo ambiente marcar uma consulta no médico ou recebeu o receituário prescrito.

Os Mini-aplicativos

Neste ponto a forma de distribuição de aplicativo se torna bem curioso. Celular “first” é a ordem do dia. Um mini-aplicativo é um tipo APP que roda no servidor e é apresentado no APP do WeChat de tal forma que você não precisa de um celular potente, cheio de memórias e essas coisas que corremos atrás. Feito desta forma o usuário pode ter centenas de mini-apps para consumir sem ocupar nenhum espaço significante do seu próprio celular.
Fazendo um paralelo com as soluções de Web-Browser é como processar uma atividade no servidor e fazer a apresentação no celular – com a diferença que lá você esta rodando em um equipamento que pode ser de baixo poder computacional – o que simplifica muito as coisas.
É uma pena que não aprendemos nada sobre a China na escola – fomos excluídos da riqueza que a China representa culturalmente e ensinamentos milenares que devemos assimilar rapidamente.

Mude conceitos e descubra uma China gigante

Se tiver oportunidade vá a China – não use a dificuldade de idioma como desculpa – irá aprender rapidamente que na China se usa esses aplicativos de tradução simultânea e nem notará que outrora tenha sido tão penoso se entender. Vá com a mente aberta para aprender e não leve consigo os conceitos ocidentais enraizados e terá muitas surpresas agradáveis.

Sou Amarildo Lacerda
Para conhecer nossos produtos: Wba Gestão

IoT definitivamente veio para fazer parte das nossas vidas. Como grande surpresa que descobri o IFTTT.org, uma ferramenta que permite automatizar coisas. Se você pensa que é difícil dá uma olhadinha lá.

Para melhor entender o que o IFTTT permite fazer é possível dizer que basta você eleger um dos serviços que já existe, em geral algo que gere um evento e em seguida indicar o que ele deve fazer na ocorrência deste evento.

Instalando o aplicativo do IFTTT da “play store”, irá permitir criar os eventos na plataforma e enviar para a aplicativo no celular recebendo por PUSH a mensagem de ocorrência do evento.

Está disponível uma lista de coisas que são possíveis automatizar, desde coisas mais simples como lembrar de “tomar água”, até atividades mais complexas como monitorar os emails e avisar quando chega um novo em sua caixa postal – um dos inúmeros recursos disponíveis.

Até aqui, tudo de graça – não paga nada – mesmo.

A idéia é bem simples:

a) escolhe a origem do evento – o IF That;
b) indica o que fazer quando o evento ocorre – o TT “Then This”;

Uma das funcionalidade que tenho utilizado é desligar a irrigação do jardim quando há previsão de chuva, ou seja, integra a leitura do tempo com a automação da irrigação utilizando um MQTT para receber as mensagens de desativar a irrigação gerenciada pelo Raspberry – Economia de água e energia elétrica.

Vai lá, e vai se surpreender com a quantidade de eventos disponíveis.

Aproveite e torne seu tempo um aliado.

Em dezembro de 2017 separei um notebook que não estava mais usando e tomei o caminho de instalar um linux para avaliar o quando seria possível viver sem Windows e sem uma máquina virtual (rsrs).
Como todos sabem, a principal ferramenta de trabalho que utilizo é o Delphi – então o desafio ficou imenso – já que sem uma máquina virtual e sem o windows é impossível utilizar o Delphi. Usando outro framework para substituir o Delphi não iria proporcionar emoção – então descartado frameworks na mesma linha.
Primeiro ponto, o que usar para desenvolver aplicativos ? Como bom delpheiro JAVA não estava nos meus planos, queria algo mais novo.

Primeira parada – se atualizar
Desktop, WEB, Mobile – são opções de plataforma de trabalho. Estacionei no item WEB, vamos procurar o que temos para explorar aí.
Já havia utilizado o Angular-JS a alguns anos para implementar algumas coisas, então vamos nos atualizar no que há de mais novo de Angular – Angular 5 (logo no início do ano veio o 6), tudo novo – esquece o Angular-JS – agora é Typescript.
Typescript é uma implementação feito utilizando como base o javascript – você escreve Typescript e o compilador gera código javascript para ser utilizada no Browser – nem tudo precisa iniciar do zero – legal.

No AngularIO, novas ferramentas de geração e compilação vieram no pacote:

  • o NG (a ferramento do AngularIO) agora gera compilações para serem publicadas no servidor do SITE
  • compila para teste local na máquina com um mecanismo de “Hot Load” muito eficiente – ficou muito bom
  • é muito produtivo para criação de páginas dinâmicas
  • com uso de NodeJS é possível escrever servidores para publicar serviços (ex: busca em banco de dados)

Ferramentas
Para trabalhar com AngularIO, não é preciso ter um windows rodando – Assim como no windows, no linux temos disponível o VS – Virtual Code Studio da MS que faz o trabalho com perfeição, primeira etapa concluída – já é possível seguir o trabalho diário sem Windows.

Preparação de Infra-estrutura
Primeiro passo a resolver é fazer a integração do código Typescript para consumir os serviços de REST em produção escritos em DELPHI. Para isto utilizei o ODataBr (parte do pacote MVCBr – vários artigos aqui no blog – MVCBr).

  • Criado uma camada base de comunicação com o servidor – a parte de http, autenticação, tradução de protocolo, tratamento de “Future” ou respostas assíncronas
  • Criado camada de comandos com classe que tenham regrar de tratamento do protocolo OData
  • Criado camada de classes de acesso aos serviços do servidor utilizados pela aplicação

Produtos com AngularIO

  • Criado um Dashboard para os aplicativos Delphi que estavam em fase de produção para lançamento em 2018
  • Treinamento de equipe para desenvolvimento em AngularIO
  • Implementação da plataforma NcConstruir – com portal de interação do logista com a plataforma – ver: Nc Construir
  • Implementado uma experiência de venda de produto por Mobile rodando em WebView;

Segunda parada – Google Firebase
…. próximo

Para visualizar efeito de Zebra em uma lista de dados com “Directive” no Angular5 para mostrar cores alternadas.

Exemplo:
[code]
Zebra Demo
<div matZebra index="0">
Text value 1
</div>

<div matZebra index="1">
Text value 2
</div>

<div *ngFor="let item of rows; let idx = index">
<div matZebra [index]="idx" oddColor="lightcyan" evenColor="lightgray">
{{item.t}}
</div>
</div>

[/code]

Código: ZebraDirective

Até a versão Tokyo do Delphi, o navegador padrão embutido é o TWebBrowser – uma implementação para chamada do Navegador padrão do Windows. Se as páginas a serem chamadas são páginas mais antigas – ele até vai bem. No entanto quando o desejo for carregar o que há de mais novo em estrutura do HTML5 com frameworks como Angular5 e outros, vários problemas de incompatibilidade surgirão á inviabilizar o uso do TWebBrowser.

TChromium como Navegador
A alternativa que se mostra mais adequada para uso dos novos frameworks é a utilizado o TChromium com a implementação CEF4Delphi créditos para Salvador Díaz Fau como consta.

Leia os exemplos
É imperativo a leitura dos exemplos que são baixados do GIT. Ele requer chamada e configuração inicial antes do uso da biblioteca, assim como é necessário aguardar a inicialização da mesma antes de sair carregando a página. Então não deixe de olhar os exemplos.

Na inicialização – antes de abrir uma página
[code lang=”pascal”]

// preparando as configurações
var FStarted:boolean;
function CEFApplication: TCefApplication;
var sPath:String;
begin
sPath := extractFilePath(ParamStr(0)); /// ou outro que for adequado ao seu aplicativo – com o local de instalação das DLLs do pacote
if not assigned(GlobalCEFApp) then
begin
GlobalCEFApp := TCefApplication.Create;
GlobalCEFApp.FlashEnabled := False;
GlobalCEFApp.FastUnload := true;

GlobalCEFApp.FrameworkDirPath := sPath+’cef’;
GlobalCEFApp.ResourcesDirPath := sPath+’cef’;
GlobalCEFApp.LocalesDirPath := sPath+’cef\locales’;
GlobalCEFApp.cache := sPath+’cef\cache’;
GlobalCEFApp.cookies := sPath+’cef\cookies’;
GlobalCEFApp.UserDataPath := sPath+’cef\User Data’;
GlobalCEFApp.EnableGPU := false;
end;
if not FStarted then
FStarted := GlobalCEFApp.StartMainProcess;

result := GlobalCEFApp;
end;

// na inicialização do projeto – chamar os dados de configuração da biblioteca –
CEFApplication;

[/code]

Antes de abrir uma página
Olhando para os exemplos, ele requer que a criação da área de apresentação (o Browser) exige que a estrutura de carga da biblioteca já esteja carregada.
Para fazer isto é preciso ficar monitorando a conclusão da inicialização para somente após criar a camada de apresentação (a VIEW);
Aqui nós usamos um timer para ficar monitorando quando que a estrutura foi inicializada.

algo que represente um loop:

[code]
while not (Chromium1.CreateBrowser(CEFWindowParent1, ”)) and
(Chromium1.Initialized) do
begin
delay(100);
application.processMessage(); // avaliar se a aplicação requer despachar outras mesnagens.
end;
[/code]

Somente após a resposta que tudo foi carregado com sucesso que a página é chamada. Neste ponto uma dica é usar o evento “AfterCreated” do componente, ou seja, o “AfterCreated” é chamado após o componente ter concluído a criação da área de apresentação.

Carregando uma página

Depois de tudo inicializado “AfterCreated” é o momento de carrega a nossa página:

Chromium1.LoadURL(url);