Existem inúmeros artigos mostrando que é possível usar Qt5 na BeagleBone, Raspberry Pi e outros SBC’s. O diferencial deste artigo é mostrar uma das melhorias que chamou a atenção de desenvolvedores de sistemas embarcados, que é a possibilidade de executar duas aplicações simultâneas em diferentes telas. Antes da versão 5.3.0 era possível executar uma aplicação em Qt em uma tela e fazer, por exemplo, streaming de vídeo em uma segunda tela. Já a partir da versão 5.3.0, já é possível trabalhar com duas aplicações Qt, uma em cada tela. Essa nova utilidade do Qt5, entre outras, estará disponível para desenvolvedores que querem colocar melhorias em suas aplicações.
Você pode estar se perguntando onde aplicar essa nova funcionalidade. Existem alguns exemplos que podem ilustrar muito bem isso:
- Equipamentos médicos com um display touchscreen para configuração do equipamento feita pelo médico e uma segunda tela HDMI para mostrar informações do paciente;
- Balanças de mercado onde um display touch screen é usado para colocar o código do produto pesado e uma segunda tela para mostrar uma tabela de preços atualizada;
- Kiosk de check-in em aeroportos, onde o display touchscreen é manipulado pelo usuário e a segunda tela mostra tabela de horários e voos.
Neste artigo estaremos usando o computador em módulo (COM) Colibri da Toradex, baseado no processador iMX6 da NXP. O módulo tem duas variantes sendo Colibri iMX6S single core com 256MB de RAM e Colibri iMX6DL dual core com 512MB de RAM, ambos com 4GB de memória eMMC.
Compilando uma imagem com Qt5 para Colibri iMX6 da Toradex
Preparando ambiente do OpenEmbedded
OpenEmbedded é um framework para geração de imagens, kernel, toolchains ou root filesystem, possibilitando aos desenvolvedores criarem distribuições de linux completas para sistemas embarcados.
Os Melhores Treinamentos sobre Sistemas embarcados e IoT
Cursos com professores qualificados para acelerar sua carreira e projetos
Antes de começar a geração de imagens, é necessária a instalação de alguns pacotes na máquina host de desenvolvimento. Todo esse processo de geração de imagem usando OpenEmbedded pode ser encontrado no site de desenvolvedores da Toradex.
A lista abaixo se encontra no Quick Start guide do OpenEmbedded.
Ubuntu/Debian
sudo apt-get install gawk wget git-core diffstat unzip texinfo gcc-multilib \
build-essential chrpath libsdl1.2-dev xterm
Fedora
sudo yum install gawk make wget tar bzip2 gzip python unzip perl patch \
diffutils diffstat git cpp gcc gcc-c++ glibc-devel texinfo chrpath \
ccache perl-Data-Dumper perl-Text-ParseWords perl-Thread-Queue SDL-devel xterm
openSUSE
sudo zypper install python gcc gcc-c++ git chrpath make wget python-xml \
diffstat texinfo python-curses patch libSDL-devel xterm
CentOS
sudo yum install gawk make wget tar bzip2 gzip python unzip perl patch \
diffutils diffstat git cpp gcc gcc-c++ glibc-devel texinfo chrpath SDL-devel xterm
O BSP da Toradex também requer alguns pacotes adicionais:
Para Fedora 20 e 21
sudo yum install cryptopp-devel.i686 curl glibc-devel.i686 libusb-devel.i686 libuuid-devel.i686 lzo-devel.i686 zlib-devel.i686 cd /usr/lib; sudo ln -s libusb-1.0.so.0.1.0 libusb-1.0.so # fixes /usr/bin/ld: cannot find -lusb-1.0
Para Ubuntu 14.04 (64-bit)
sudo dpkg --add-architecture i386 sudo apt-get install curl gawk g++-multilib gcc-multilib lib32z1-dev libcrypto++9:i386 libcrypto++-dev:i386 liblzo2-dev:i386 libusb-1.0-0:i386 libusb-1.0-0-dev:i386 uuid-dev:i386 cd /usr/lib; sudo ln -s libcrypto++.so.9.0.0 libcryptopp.so.6
Para Ubuntu 14.04 (32-bit)
sudo apt-get install curl gawk g++ gcc libcrypto++9 libcrypto++-dev liblzo2-dev libusb-1.0-0 libusb-1.0-0-dev uuid-dev zlib1g cd /usr/lib; sudo ln -s libcrypto++.so.9.0.0 libcryptopp.so.6
Para Ubuntu 12.04
sudo apt-get install curl gawk gcc-multilib ia32-libs lib32z1-dev libcrypto++9:i386 libcrypto++9-dev:i386 liblzo2-dev:i386 libusb-1.0-0:i386 libusb-1.0-0-dev:i386 uuid-dev:i386 cd /usr/lib; sudo ln -s libcrypto++.so.9.0.0 libcryptopp.so.6
O OpenEmbedded também requer alguns repositórios do git, para isso utilizamos a ferramenta chamada “repo”. O repo gerencia os repositórios e seus branches a serem baixados. Mais informações aqui.
Instale o repo com os comandos:
mkdir ~/bin export PATH=~/bin:$PATH curl https://commondatastorage.googleapis.com/git-repo-downloads/repo > ~/bin/repo chmod a+x ~/bin/repo
Agora crie um diretório para o setup do oe-core e clone o meta da Toradex:
mkdir oe-core cd oe-core repo init -u https://git.toradex.com/toradex-bsp-platform.git -b LinuxImageV2.4 repo sync
Após o passo acima será criada uma pasta chamada “stuff”, dentro dela encontram-se arquivos a serem modificados para adicionar o Qt5.
Entre na pasta stuff, aqui se encontram vários layers. Adicione o layer meta-qt5 com o comando:
git clone -b dizzy https://github.com/meta-qt5/meta-qt5.git
A pasta stuff deve estar mais ou menos assim:
giovanni@giovanni-pc:/home/prjs/toradex-linux-new/oe-core/stuff$ ls -l total 44 drwxrwxr-x 14 giovanni giovanni 4096 Ago 4 15:43 meta-angstrom drwxrwxr-x 10 giovanni giovanni 4096 Ago 4 15:43 meta-browser drwxrwxr-x 18 giovanni giovanni 4096 Ago 4 15:43 meta-fsl-arm drwxrwxr-x 7 giovanni giovanni 4096 Ago 4 15:43 meta-fsl-arm-extra drwxrwxr-x 8 giovanni giovanni 4096 Ago 4 15:43 meta-fsl-demos drwxrwxr-x 8 giovanni giovanni 4096 Ago 4 15:43 meta-linaro drwxrwxr-x 7 giovanni giovanni 4096 Ago 4 15:43 meta-lxde drwxrwxr-x 19 giovanni giovanni 4096 Ago 4 15:43 meta-openembedded drwxrwxr-x 8 giovanni giovanni 4096 Ago 4 15:45 meta-qt5 <---layer do qt5 drwxrwxr-x 23 giovanni giovanni 4096 Ago 4 15:43 meta-toradex drwxrwxr-x 8 giovanni giovanni 4096 Ago 4 15:43 openembedded-core
No diretório oe-core/ execute o comando abaixo para configurar o ambiente, o que nos leva para a pasta build.
. export
Na pasta conf teremos dois arquivos para editar, bblayers.conf e local.conf.
Execute vi conf/bblayers.conf e adicione os seguintes layers:
${TOPDIR}/../stuff/meta-openembedded/meta-ruby \
${TOPDIR}/../stuff/meta-qt5 \
Execute vi conf/local.conf e adicione ou modifique os itens abaixo:
MACHINE ?= "colibri-imx6" ACCEPT_FSL_EULA = "1" DISTRO_FEATURES_remove = "x11 wayland" IMAGE_INSTALL_remove = "eglinfo-x11" IMAGE_INSTALL_append = "qtbase qtbase-fonts qtbase-plugins qtbase-examples \ cinematicexperience qt5everywheredemo libxkbcommon "
Em nosso caso a funcionalidade touch nativa não estava funcionando como desejado. Conseguimos contornar o problema usando a aplicação tslib, que pode ser obtida adicionando em IMAGE_INSTALL_append, os seguintes pacotes: tslib, tslib-calibrate, tslib-conf e tslib-tests. Mais a frente mostraremos como a aplicação foi executada usando tslib.
Para gerar a imagem execute o comando bitbake console-trdx-image. (Lembre-se que para isso devemos estar no diretório build). O processo de build pode demorar algumas horas se esse for o primeiro build.
Após o build ser concluído a imagem pode ser encontrada no seguinte diretório:
giovanni@giovanni-pc:/home/prjs/toradex-linux/oe-core/build/out-glibc/deploy/images/colibri-imx6$
A pasta gerada está compactada como .tar.bz2. A pasta deverá ser extraída e dentro dela se encontram os seguintes itens:
giovanni@giovanni-pc:/home/prjs/toradex-linux-new/oe-core/build/out-glibc/deploy/images/colibri-imx6/Colibri_iMX6_LinuxConsoleImageV2.4$ ls colibri-imx6_bin create_configblock.sh imx_flash mnt rootfs update.sh
Para realizar o update da imagem no computador em módulo, fazemos uso de um cartão uSD e um script que realiza a preparação do cartão. Execute o script update.sh com o argumento -o e o path do cartão. Caso o cartão não seja montado automaticamente no diretório de media, realize o procedimento com o comando mount:
mount /dev/sdX /media/yourUser/SDcardName
E então executamos o script.
./update.sh -o /media/yourUser/SDcardName
Com o cartão SD preparado, insira-o na placa. Ligue a placa, pare o UBoot pressionando qualquer tecla no terminal ligado a serial da placa e execute os seguintes comandos para instalar a imagem no módulo:
run setupdate run update
Você encontra um tutorial do processo de alterar a imagem do SO nos módulos Toradex direto neste link ou no site de desenvolvedores da Toradex.
Como já visto no início, para este artigo usamos o módulo Colibri iMX6 e duas saídas de vídeo, uma sendo RGB 18 bits conectada a um display EDT RGB de 10” 1024×600 e outra saída HDMI conectada a um monitor HDMI de 21” 1920×1080. Para configurar ambas as telas e resoluções setamos a variável de U-Boot vidargs com o comando a seguir:
setenv vidargs 'mxc_hdmi.only_cea=1 \ video=mxcfb0:dev=lcd,1024x600M@60,if=RGB666 \ video=mxcfb1:dev=hdmi,1920x1080M@60,if=RGB24 \ video=mxcfb2:off video=mxcfb3:off fbmem=32M'
De acordo com a Wiki do Qt sobre iMX6, quando se tem dois displays conectados (ex: uma tela LCD touch e outra HDMI), temos dois devices de framebuffer: /dev/fb0 e /dev/fb2. Com Qt5 usa-se alguns plugins gráficos como EGLFS, LinuxFB, KMS. Mais informações sobre esses plugins você encontra aqui. Por padrão, ambos eglfs e linuxfb, usam /dev/fb0. Na versão 5.3.0 foi introduzida uma nova variável de ambiente: QT_QPA_EGLFS_FB. Antes de executarmos alguma aplicação podemos setar essa variável para o framebuffer desejado com o seguinte comando:
export QT_QPA_EGLFS_FB=/dev/fb0
Com o comando a seguir podemos iniciar uma das aplicações demo do Qt5:
Qt5_CinematicExperience -platform eglfs
Para escolher em qual tela e qual aplicação exibir, podemos encadear os comandos como abaixo:
export QT_QPA_EGLFS_FB=/dev/fb2; Qt5_CinematicExperience -platform eglfs
Com dois displays conectados temos /dev/fb0 e /dev/fb2, note que fb1 e fb3 são overlays de fb0 e fb2. Sendo assim, podemos usar esses overlays para exibirmos alguma outra funcionalidade.
Há variáveis de ambiente que podem ser usadas de acordo com as necessidades, uma delas é QT_QPA_EGLFS_HIDECURSOR que, ao ser setada para 1, escondemos o cursor do mouse. Outra variável necessária em nossos testes foi QT_QPA_EGLFS_DISABLE_INPUT que foi setada para 1. Assim, conseguimos usar o touch corretamente na aplicação executando a mesma da seguinte forma:
Qt5_CinematicExperience -platform eglfs -plugin tslib:/dev/input/event0
Fizemos uma aplicação de exemplo onde simulamos uma situação de check-in em um aeroporto. A tela maior exibe um FIDS (Flight information display system), enquanto o display touch LCD exibe opções de check-in. Usando a técnica de overlays, colocamos um quadro exibindo o vídeo de uma webcam, simulando, por exemplo, um check-in por QR code.
Figura 3. Aplicação Demo Airport Check-In
Confiram o vídeo da aplicação em funcionamento:
O código fonte dessa aplicação, que pode ser baixado e editado, encontra-se nesses links:
- https://github.com/giobauermeister/qt-checkin-kiosk-demo
- https://github.com/giobauermeister/qt-flight-information-demo
Também disponibilizamos uma imagem pre-build para o módulo Colibri iMX6 no Google Drive.
