【ROS 2】qml_ros2_pluginを使ってみる

ROS

概要

qml_ros2_pluginについて使ってみたので使用方法をメモしていきます。qml_ros2_pluginを使用することでROS 2のトピックをUIに表示したり、UIからトピックをパブリッシュしたりすることができるようになります。

GitHub - StefanFabian/qml_ros2_plugin: Connects QML and ROS2 enabling the simple creation of great looking Graphical User Interfaces for robotics applications.
Connects QML and ROS2 enabling the simple creation of great looking Graphical User Interfaces for robotics applications....
github.com

QML（Qt Modeling Language）は、Qtフレームワークの一部で、主にユーザーインターフェースの開発に使用される宣言型プログラミング言語です。宣言的にUIを記述して、JavaScriptを使用して、ロジックを記述することが可能です。

qml_ros2_pluginは、QMLにROSのトピックのpub/subや、tfのlookupを使用することができるようになるプラグインです。

動作環境はROS 2 Humbleで確認しています。

インストール方法

qml_ros2_pluginのインストール方法を記載します。

以下のコマンドでqml_ros2_pluginをインストールします。ros2_babel_fishを使用しており、rosdep installでは解決できないため、リポジトリを手動でクローンして入れます。

cd ~/colcon_ws/src/
git clone https://github.com/StefanFabian/qml_ros2_plugin.git
git clone https://github.com/LOEWE-emergenCITY/ros2_babel_fish.git
rosdep install --from-paths . --ignore-packages-from-source
cd ~/colcon_ws/
colcon build

以下のコマンドで、QML関連のパッケージをインストールします。

sudo apt install qmlscene qml-module-qtmultimedia qml-module-qtquick2 qml-module-qtquick-controls2 qml-module-qtquick-layouts qml-module-qtquick-window2 ros-$ROS_DISTRO-image-transport-plugins ros-$ROS_DISTRO-usb-cam

これで準備は完了です。

使い方

QMLを使用したHello World

まずはqml_ros2_pluginを使用せずにQMLを作成して画面を表示してみます。

以下の内容を記載したテキストファイルを作成しhello_world.qmlという名称で保存します。

import QtQuick 2.0
import QtQuick.Controls 2.15

ApplicationWindow {
    visible: true
    width: 640
    height: 480
    title: "Hello World"

    Text {
        text: "Hello, World!"
        anchors.centerIn: parent
    }
}

このhello_world.qmlを使用して、画面を表示する場合は、以下のように指定します。

qmlscene ~/hello_world.qml
※ homeディレクトリに配置している場合

実行すると以下のように表示されれば正常です。

qml_ros2_pluginを使ってみる

qml_ros2_pluginを使っていきます。qml_ros2_pluginでは、トピックのpub/subや、tfのlookup,imageトピックの可視化などを行うことができます。QMLのサンプルが、qml_ros2_plugin/examplesに入っていますので、こちらを試しに起動していきます。

ここでは、トピックのpub/subを行うQMLを指定してUIを起動します。

publisher側は以下のように起動します。

cd ~/colcon_ws/
qmlscene src/qml_ros2_plugin/examples/publisher.qml

subscriber側は以下のように起動します。

cd ~/colcon_ws/
qmlscene src/qml_ros2_plugin/examples/subscription.qml

起動すると以下のように起動します。publisher側のSendボタンを押すと、subscriber側の値が更新されます。

以下のようにimageトピックを可視化したり、BIダッシュボードのようにトピックの値を表示することもできます。

QMLは、Qtフレームワーク用のクロスプラットフォーム統合開発環境（IDE）であるQt Creatorでデザイナを使って開発することもできますので、中規模以上であれば使用することも検討するかといいかと思います。

コメント