Help us understand the problem. What is going on with this article?

Android上でSVGファイルが表示されない(Qt)

概要

ソースコード
前回の記事でAndroidアプリの作成について書いたのですが、Windowsデバックでしか確認してなかったので、Android側でデバックしてみると、画像が表示されていないことに気づきました。

原因はSVG画像の読み込みが出来ていなかったからだ。PNG画像は正常に表示出来ていたのに、SVG画像だけが表示されていなかったです。

Screenshot_20191116-174138.png
ドット絵はPNGなので前回の記事でも表示されていたのですが、アイコンは全てSVGだったのが表示されていなかった。

対象読者

QtでAndroidアプリ開発をしている人

解決方法

  • QtのプロジェクトにSVGモジュールを追加
  • main.cppにもSVG対応をする
  • QML側からもSVGの画像サイズを指定

筆者の開発環境

Qtのバージョン

  • Qt 5.12.2:カメラ機能に対応するためにアップしました。
  • MinGW 32bit(コンパイラにはMSVCも使用できますが、MSVC2017をインストールしていないため使用不可)
    image.png

  • JDK1.8.0

  • SDK26.1.1

  • NDKr14.1
    image.png

変更内容

QiitaApplication.pro

QT += qml quick webview svg

main.cpp:QtSvgのinclude

#ifdef Q_OS_ANDROID
#include <QtSvg>    //Because deployment sometimes just forgets to include this lib otherwise
#endif

QML側:SourceSizeを指定します。

        Image {
            source: toolButtonIcon
            sourceSize.width: 30
            sourceSize.height: 30
            fillMode: Image.PreserveAspectFit
            anchors.fill: parent
            anchors.bottomMargin: 10
        }

まとめ

今回の内容は、下記のリンクを参考にしました。
Qml Doesn't Show SVG Images
Requirements For SVG Icons Changed In Qt5.10.1
Qtの情報は日本語で調べてもほどんど問題解決できないことが多いです。英語でキーワード検索しないといけないレベル。
ドキュメントがしっかりしているとは言うが、本当に困った時には、結局Stack Overflowとかを参考にしないといけないことがほとんどだなーと感じますね。

WindowsやAndroidのクロスプラットフォーム開発をしながら、今後も記事を蓄積させていきます。

Why do not you register as a user and use Qiita more conveniently?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away