博客專欄

        EEPW首頁 > 博客 > NXP iMX8基于嵌入式Linux部署網絡瀏覽器

        NXP iMX8基于嵌入式Linux部署網絡瀏覽器

        發布人:toradex 時間:2020-12-11 來源:工程師 發布文章

        By Toradex秦海

        1). 簡介

        隨著嵌入式設備的發展,網絡通信在應用中越來越廣泛,而在客戶端,就需要可以方便訪問網絡服務的瀏覽器配置,本文就基于NXP iMX8平臺演示如何在嵌入式Linux BSP中集成網絡瀏覽器,包括Chromium瀏覽器和基于Qtwebenine的示例瀏覽器quicknanobrowser

         

        本文所演示的平臺來自于Toradex Apalis iMX8 ARM嵌入式平臺,這是一個基于NXP iMX8QM ARM處理器,支持Cortex-A72+A53Coretex-M4架構的計算機模塊平臺。

         

         

        2. 準備

        a). Apalis iMX8QM 4GB WB IT ARM核心版配合Ioxra 載板,連接調試串口UART1(載板X22)到開發主機方便調試。

         

        b). 載板連接HDMI顯示器和網絡用于顯示和聯網,USB鼠標鍵盤用于操作瀏覽器。

         

         

        3). Apalis iMX8 Ycoto Linux 編譯部署以及配置

        a). Apalis iMX8 Ycoto Linux 通過Ycoto/Openembedded 框架編譯,具體的配置方法請參考這里,參考如下修改后編譯Reference-Multimedia image鏡像

        ./ iMX8 Ycoto layer 中默認沒有包含瀏覽器的相關layer,因此首先需要通過下面修改添加相關layer

        -------------------------------

        ### add mata-browser

        $ git clone https://github.com/OSSystems/meta-browser.git

        ### add meta-clang

        $ git clone -b dunfell https://github.com/kraj/meta-clang.git

        ### add meta-python2

        $ git clone -b dunfell https://github.com/YoeDistro/meta-python2.git

         

        ### modify build/conf/bblayer.conf to add above extra layers

        --- a/build/conf/bblayers.conf   

        +++ b/build/conf/bblayers.conf   

        @@ -24,6 +24,9 @@

           ${TOPDIR}/../layers/meta-openembedded/meta-python \

           ${TOPDIR}/../layers/meta-freescale-distro \

           ${TOPDIR}/../layers/meta-toradex-demos \

        +  ${TOPDIR}/../layers/meta-python2 \

        +  ${TOPDIR}/../layers/meta-clang \

        +  ${TOPDIR}/../layers/meta-browser \

           ${TOPDIR}/../layers/meta-qt5 \

           \

           \

        -------------------------------

         

        ./ 修改 local.conf,增加chromiumqtwebengine支持

        -------------------------------

        +IMAGE_INSTALL_append = " chromium-ozone-wayland qtwebengine qtwebengine-dev"

        +ACCEPT_FSL_EULA = "1"

        -------------------------------

         

        ./ 修改imageQt5 SDK 文件

        -------------------------------

        // tdx-reference-multimedia-image.bb文件,增加Qt5 SDK 和中文字體支持

        --- a/layers/meta-toradex-demos/recipes-images/images/tdx-reference-multimedia-image.bb

        +++ b/layers/meta-toradex-demos/recipes-images/images/tdx-reference-multimedia-image.bb

        @@ -3,6 +3,8 @@

         SUMMARY = "Toradex Embedded Linux Reference Multimedia Image"

         DESCRIPTION = "Image for BSP verification with QT and multimedia features"

         

        +inherit populate_sdk_qt5

        +

         #Prefix to the resulting deployable tarball name

         export IMAGE_BASENAME = "Reference-Multimedia-Image"

         

        @@ -14,6 +16,9 @@

                                                                '', d), d)} \

         "

         

        +# add chinese fonts

        +FONT_CHINESE = "ttf-droid-sans ttf-droid-sans-fallback ttf-droid-sans-mono ttf-droid-serif freetype"

        +

         APP_LAUNCH_WAYLAND ?= "wayland-qtdemo-launch-cinematicexperience"

         APP_LAUNCH_X11 ?= "x-window-qtcinematicexperience"

         

        @@ -33,6 +38,8 @@

             packagegroup-tdx-graphical \

             packagegroup-tdx-qt5 \

             \

        +    ${FONT_CHINESE} \

        +    \

             bash \

             coreutils \

             less \

         

        // tdx-reference-minimal-image.bb文件,增加中文語言支持

        ### modify layers/meta-toradex-demos/recipes-images/images/tdx-reference-minimal-image.bb

        #IMAGE_LINGUAS = "en-us"

        # add chinese font support

        IMAGE_LINGUAS = "en-us zh-cn"

         

        // packagegroup-qt5-toolchain-target.bb文件,增加Qt5 SDK qtwebengine支持

        --- a/layers/meta-qt5/recipes-qt/packagegroups/packagegroup-qt5-toolchain-target.bb

        +++ b/layers/meta-qt5/recipes-qt/packagegroups/packagegroup-qt5-toolchain-target.bb

        @@ -93,6 +93,9 @@

             qtwebchannel-dev \

             qtwebchannel-mkspecs \

             ${@bb.utils.contains('DISTRO_FEATURES', 'opengl', 'qtwebchannel-qmlplugins', '', d)} \

        +    qtwebengine-dev \

        +    qtwebengine-mkspecs \

        +    ${@bb.utils.contains('DISTRO_FEATURES', 'opengl', 'qtwebengine-qmlplugins', '', d)} \

             qtxmlpatterns-dev \

             qtxmlpatterns-mkspecs \

             qttranslations-qtxmlpatterns \

        -------------------------------

         

        ./ 編譯imageSDK

        -------------------------------

        # compile Reference-Multimedia image

        $ bitbake bitbake tdx-reference-multimedia-image

         

        # compile SDK

        bitbake tdx-reference-multimedia-image -c populate_sdk

        -------------------------------

         

        b). Ycoto Linux image部署

        參考這里通過Toradex Easy installer將上面編譯好的image更新部署到模塊,版本為目前最新的Ycoto Linux V5.1

         

        c). 顯示配置

        ./ HDMI默認即可正常顯示,如果有顯示器EDID讀取問題不能成功顯示,可以通過下面方法通過軟件firmware方式手動加載EDID,更多關于顯示的配置請參考這里

        -------------------------------

        # cp EDID binary file to rootfs

        $ mkdir /lib/firmware/edid

        $ cp 1920x1080.bin /lib/firmware/edid

         

        # set uboot kernel command line

        # setenv defargs ‘pci=nomsi drm.edid_firmware=HDMI-A-1:edid/1920x1080.bin’

        # saveenv && reset

        -------------------------------

         

        d). Qt5 SDK安裝配置

        請參考這里的說明安裝上面編譯好的SDK,以及配置Qtcreator交叉編譯環境

         

         

        4). Chromium 瀏覽器應用測試

        a). 通過下面命令啟動chromium 應用,添加 ”--in-process-gpu” 參數使應用可以在wayland環境下正常運行

        -------------------------------

        root@apalis-imx8:~# chromium --no-sandbox --in-process-gpu

        -------------------------------

         

        b). 運行效果如下圖,可見中文也可以正常顯示

        image001.png

         

        c). chromium運行時查看了下CPU占用率,大概是在40% - 180% 這個區間動態變化,iMX8包含6Cortex-A CPU核心,因此最多可以到600%的使用率。

         

        5). QT Webengine 示例瀏覽器quicknanobrowser測試

        Quick Nano Brower 示例程序是Qt5自帶的 Webengine示例程序,這是一個基于Qt Quick Webengine開發的精簡瀏覽器示例,本文使用版本為和Qt library匹配的5.14.2版本。

        a). 使用上面配置好交叉編譯環境進行編譯,將編譯生成的可執行文件 quicknanobrower 復制到Apalis iMX8模塊 “/home/root” 目錄下

         

        b). 配置簡單測試啟動腳本

        ./ test.sh,程序啟動腳本文件

        ---------------------------------------------------

        !/bin/sh

         

        export QT_QPA_PLATFORM=wayland-egl

        /home/root/quicknanobrowser --no-sandbox &

        ---------------------------------------------------

         

        c). 運行quicknanobrowser應用

        ---------------------------------------------------

        $ /home/root/test.sh

        ---------------------------------------------------

         

        d). 運行效果如下圖,中文也可以正常顯示

        image003.png

         

        c). chromium運行時查看了下CPU占用率,大概是在50% - 200% 這個區間動態變化。

         

        6). 總結

        本文基于NXP iMX8嵌入式平臺在嵌入式linux系統下測試網絡瀏覽器部署。


        *博客內容為網友個人發布,僅代表博主個人觀點,如有侵權請聯系工作人員刪除。



        關鍵詞:

        相關推薦

        技術專區

        關閉
        主站蜘蛛池模板: 陆良县| 新安县| 高唐县| 太保市| 双鸭山市| 平顺县| 灵川县| 涿鹿县| 清新县| 富源县| 南投市| 明星| 彰化县| 西丰县| 鲁甸县| 台前县| 西乌珠穆沁旗| 海南省| 公主岭市| 体育| 东方市| 凤阳县| 巧家县| 临江市| 沅陵县| 桓仁| 建始县| 台中市| 安阳市| 小金县| 山丹县| 彭泽县| 田林县| 麦盖提县| 麻栗坡县| 石阡县| 冀州市| 东港市| 体育| 青铜峡市| 建德市|