Qt Creator Using Qt Creator Value-Add Features to Further Productivity 株 式 会 社 SRA 朝 木 卓 見
自 己 紹 介 名 前 : 朝 木 卓 見 職 業 : Qtコンサルタント, Qt Certified Specialist Qt 歴 : Qt 1.0.1(1996) 活 動 場 所 : 株 式 会 社 SRA http://qt-labs.jp 日 本 Qtユーザー 会 2
アジェンダ Qt Creator 紹 介 基 本 的 な 使 い 方 プロジェクトの 作 成 エディタ Qt Quick Designer デバッグ QML Profiler 商 用 版 の 追 加 機 能 Qt Creatorをもっと 使 いこなそう 3
Qt Creatorとは クロスプラットフォーム 統 合 開 発 環 境 (IDE) Qtで 作 られたQtのためのIDE プラグインアーキテクチャによる 高 い 拡 張 性 柔 軟 性 対 応 言 語 : C++, QML, JavaScript 非 Qtプロジェクトにも 対 応 対 応 プラットフォーム: Windows, Linux, OS X ターゲット: デスクトップ, 組 み 込 みLinux, ios, Android, VxWroks, QNX, ベアメタル, etc. ベアメタル: OSを 持 たない 組 み 込 み 用 コンピュータ http://en.wikipedia.org/wiki/bare_machine http://doc.qt.io/qtcreator/index.html 4
対応プラットフォーム Linux OS X Windows http://doc.qt.io/qtcreator/creator- os- supported- platforms.html 5
ターゲットプラットフォーム http://doc.qt.io/qtcreator/creator- os- supported- platforms.html 6
Qt Creator 7
主 な 機 能 エディタ: コード 補 完 ハイライト 表 示 分 割 表 示 マルチウィンドウ リファ クタリング UIデザイン: GUIデザイナー(Qt Designer, Qt Quick Designer) デバッグ: GDB, LLDB, CDBに 対 応 プロジェクト: プロジェクト 固 有 設 定 (コードスタイルなど) 共 有 設 定 機 能 解 析 : Valgrind, perf(linux), QML Profiler ヘルプ: Qt Assistant 8
入 手 方 法 Qt Online Installer Qt + Qt Creator QtやQt Creatorをアップデート 可 能 Qt Offline Installer Qt + Qt Creator バージョンを 固 定 して 利 用 する 場 合 Qt Creator Qt Creatorのみ QtやQtのバイナリパッケージが 不 要 な 場 合 http://www.qt.io/download/ 9
プロジェクトの 作 成 生 成 可 能 なプロジェクト アプリケーション: Qt Widget, Qt Quick, Qt Console ライブラリ: C++ライブラリ, Qt Quick プラグイン, Qt Creator プラグイン 非 Qt: cmake, qbs, qmakeプロジェクト(c, C++) 外 部 プロジェクト: 各 種 バージョン 管 理 システムのリポジトリクローン その 他 : Qt ユニットテスト, subdirs qmake プロジェクト, 空 のプロジェクト http://doc.qt.io/qtcreator/creator-project-creating.html 10
プロジェクトの 作 成 11
エディタ 主 な 機 能 コード 補 完 シグナル スロットも 補 完 可 能 シンタックスハイライト 移 動 ブックマーク コードチェック 自 動 インデント コードテンプレート キーボードマクロ http://doc.qt.io/qtcreator/creator-editor-functions.html 12
エディタ: C++ 13
エディタ: QML 14
エディタ: Qt Quick Toolbars QML 編 集 中 にプロパティの 値 をGUIで 編 集 Image, BorderImage: source, fillmode Text: color, font, style, alignment PropertyAnimation: duration, easing Rectangle: color, gradient, border 右 クリック or ツール QML/JS から 表 示 http://doc.qt.io/qtcreator/qt-quick-toolbars.html 15
Qt Quick Designer http://doc.qt.io/qtcreator/creator-visual-editor.html 16
デバッグ GDB, LLDB, CDBに 対 応 QML/JavaScriptのデバッグにも 対 応 JavaScriptへのブレークポイント 設 定 QMLのインスペクタ GDB: Python scripting extensionへの 対 応 が 必 要 特 に 組 み 込 みLinuxの 場 合 に 注 意 17
Windowsでのデバッグ(Visual Studio) Debugging tools for Windowsのインストールが 必 要 シンボルサーバーのセットアップも 必 要 デバッグが 遅 い 場 合 リビルド proファイルに 以 下 を 追 加 QMAKE_LFLAGS_DEBUG += /INCREMENTAL:NO http://wiki.qt.io/qt_creator_windows_debugging 18
デバッグ: C++ 19
デバッグ: QML/JavaScript 20
解 析 QML Profiler Valgrind Code Analysis Tool メモリアナライザ: http://doc.qt.io/qtcreator/creator-analyzer.html 関 数 プロファイラ: http://doc.qt.io/qtcreator/creator-cache-profiler.html Clang Static Analyzer( 商 用 ) CPU Usage Analyzer( 商 用 ) 21
QML Profiler QMLのプロファイリング qmlのコンパイル アイテムの 生 成 バインディング シグナルの 処 理 時 間 描 画 シーングラフ( 商 用 版 ) リモート 実 行 時 も 取 得 可 能 ネットワーク 経 由 or qmlprofilerコマンド 経 由 Qt Quick 2(Qt 5)で 対 応 イベントを 大 幅 に 拡 大 オーバーヘッド 増 パフォーマンス 解 析 には 必 須 http://doc.qt.io/qtcreator/creator-qml-performance-monitor.html 22
QML Profiler 23
QML Profilerの 使 い 方 プロジェクトの 設 定 (リリースビルド 時 に 注 意 ) ビルド: ビルドステップ qmake 詳 細 Enable QML debugging and profiling: に 実 行 : Debugger Setting Enable QML に Analyze QML プロファイラ アプリケーションがQt Creatorから 起 動 可 能 な 場 合 リモート 実 行 時 も 可 Analyze QML プロファイラ ( 外 部 ) アプリケーションの 起 動 を 手 動 で 行 う 場 合 24
QML Profiler: ビルド 設 定 25
QML Profiler: 実 行 設 定 26
QML Profiler: タイムライン アプリケーション の 起 動 停 止 プロファイル の 開 始 停 止 27
QML Profiler: イベント 28
組 み 込 みLinux 対 応 Qt for Device Creation (Boot 2 Qt) 設 定 不 要 で 利 用 可 能 ボードを 自 動 的 に 認 識 adbを 用 いたボード 制 御 その 他 のQt (BSP 付 属 独 自 ビルド) キットの 作 成 が 必 要 キット: Qtやツールチェイン デバイスの 設 定 をまとめたもの 29
組 み 込 みLinux 対 応 設 定 ホスト 側 Qt: 設 定 ビルドと 実 行 Qtバージョン http://doc.qt.io/qtcreator/creator-project-qmake.html コンパイラ: 設 定 ビルドと 実 行 コンパイラ http://doc.qt.io/qtcreator/creator-tool-chains.html デバッガ: 設 定 ビルドと 実 行 Debuggers Python scripting extensionに 対 応 したGDBが 必 要 http://doc.qt.io/qtcreator/creator-debugger-engines.html デバイス: 設 定 デバイス 実 行 するデバイスのIPアドレスなど http://doc.qt.io/qtcreator/creator-developing-generic-linux.html キット: 設 定 ビルドと 実 行 キット Qt, コンパイラ, デバッガ, デバイスの 組 み 合 わせ http://doc.qt.io/qtcreator/creator-targets.html デバイス 側 ssh, sftpサーバ ホストとのネットワークアクセス ホストのデバッガに 対 応 するgdbserver 30
設 定 : デバイス http://doc.qt.io/qtcreator/creator-developing-generic-linux.html 31
商 用 版 の 機 能 機 能 Windows Linux Mac 備 考 Auto Test Clang Static Analyzer 要 clang QML Profiler 拡 張 Qt Quick Designer 拡 張 CPU Usage Analyzer 要 perf Boot2Qt 5.x 用 Boot2Qt 対 応 VxWorks 対 応 http://doc.qt.io/qtcreator/creator-commercial-overview.html 32
Auto Test Qt Testモジュールを 用 いたユニットテスト 用 Auto Testプロジェクトテンプレート OS X 版 にはバグで 同 梱 されていない: https://bugreports.qt.io/browse/qtcreatorbug-14490 Qt Testの 出 力 を 整 形 実 行 するテストの 選 択 http://doc.qt.io/qtcreator/creator-autotest.html 33
Auto Test 34
Clang Static Analyzer Clangを 用 いて 静 的 解 析 を 行 う 対 応 する 項 目 はClangに 依 存 http://clang-analyzer.llvm.org/available_checks.html clangコマンドの 別 途 インストールが 必 要 簡 易 チェックとしては 有 用 http://doc.qt.io/qtcreator/creator-clang-static-analyzer.html 35
Clang Static Analyzer 36
Qt Quick Designer 拡 張 PathViewのパスの 編 集 機 能 Qt Quick UI FormではPathViewが 使 えないため 工 夫 が 必 要 エレメント 公 開 用 チェックボックス Qt Quick UI Formでほぼ 必 須 Connectionsペイン Connection エレメントを 作 成 Qt DesignerのようにGUIでの 編 集 は 不 可 能 エレメント 内 の onfoo ハンドラは 対 象 外 http://doc.qt.io/qtcreator/creator-qtquick-designer-extensions.html 37
Qt Quick Designer 拡 張 エレメント 公 開 用 チェックボックス Connectionsペイン PathViewのパス 編 集 38
Qt Quick Designer( 商 用 版 )の 使 用 例 https://www.youtube.com/watch?v=covidcywnci 39
QML Profiler 拡 張 機 能 イベント Qt Quick 1 Qt Quick 2 商 用 版 のみ 備 考 Pixmap Cache Scene Graph Qt Quick 2の 描 画 イベント Memory Usage JavaScriptのヒープサイズ Input Events Painting Animations Compiling Creating Binding Handling Signal JavaScript JavaScriptの 関 数 実 行 http://doc.qt.io/qtcreator/creator-qml-performance-monitor.html 40
QML Profilerの 拡 張 イベント ツール 保 存 表 示 備 考 Qt Creator(OSS) Qt Creator( 商 用 ) qmlprofiler ー コマンドラインツール http://doc.qt.io/qtcreator/creator-qml-performance-monitor.html 41
CPU Usage Analyzer Linuxカーネルのperf 機 能 を 用 いてCPUの 利 用 状 況 を 解 析 サンプリングベースのプロファイル perfコマンドの 別 途 インストールが 必 要 Boot2Qt 5.x 以 降 用 現 時 点 では 利 用 不 可 能 (Boot2Qt 4.x) perfparserコマンドがb2qt 5.xに 付 属 予 定 Generate separate debug info を 推 奨 Project ビルド qmake 詳 細 http://doc.qt.io/qtcreator/creator-cpu-usage-analyzer.html 42
CPU Usage Analyzer 43
Qt Quick Compiler( 商 用 版 ) プロジェクトの 設 定 で 有 効 化 ビルド ビルドステップ qmake 詳 細 Enable Qt Quick Compiler: に プロジェクトのリビルド Qt Quick Compiler qmlファイルをc++にコンパイル qmlファイルの 実 行 時 コンパイル 時 間 を 削 減 qmlファイルがqrcで 埋 め 込 まれていること システム 側 のqml(Qt Quick Controls, Qt Graphical Effects)は 対 象 外 QMLデバッグとの 併 用 は 不 可 能 (プロファイルは 可 能 ) アプリのコンパイル 時 間 バイナリサイズ 増 大 http://doc.qt.io/qtquickcompiler/ 44
Qt Quick Compiler 45
設 定 便 利 な 設 定 C++ ファイル 命 名 規 則 ファイル 名 をキャメルケースにする 場 合 ライセンステンプレートの 設 定 46
プラグインの 有 効 無 効 化 Qt Creatorの 機 能 はプラグインで 追 加 削 除 可 能 ヘルプ プラグインについて デフォルトで 無 効 なプラグイン Build Systems: AutotoolsProjectManager C++: Beautifier, ClangCodeModel Device Support: BareMetal, VxWorks Qt Quick: QmlProjectManager Utilities: AutoTest, EmacsKeys, HelloWorld, Todo http://doc.qt.io/qtcreator/creator-configuring.html#enabling-and-disabling-plugins 47
コードモデル ソースコードの 情 報 をモデル 化 したもの 補 完 ハイライト 高 度 な 検 索 などに 利 用 二 つのコードモデル Qt Creator 内 製 モデル: デフォルト Clangコードモデル: Clangベースのコードモデル 遅 いがより 正 確 C++11などへの 対 応 デフォルトでは 無 効 補 完 とハイライトにのみ 対 応 ヘルプ プラグインについて C++ ClangCodeModel に 変 更 後 Qt Creatorの 再 起 動 が 必 要 設 定 C++ コードモデル 各 言 語 Clang http://doc.qt.io/qtcreator/creator-clang-codemodel.html 48
クイックアクセス(Locator) ウィンドウ 左 下 の 入 力 欄 Ctrl+K(OS X: Command+K)で 開 始 ファイルやヘルプなどへ 素 早 くアクセス プレフィックス 無 し: 全 プロジェクトのファイル? : ヘルプ l : 行 番 号 指 定 o : 編 集 中 のファイル r : Web 検 索 http://doc.qt.io/qtcreator/creator-editor-locator.html 49
クイックアクセス(Locator) 50
検 索 ファイル 内 検 索 : Ctrl + F オプションはサーチアイコンをクリックして 変 更 複 数 のファイルを 検 索 : Ctrl + Shift + F http://doc.qt.io/qtcreator/creator-editor-finding.html 51
QMLのチェック ツール QML/JS チェックを 実 行 アプリケーションのQMLファイルの 簡 易 静 的 解 析 を 実 行 QML のプロパティの 型 パフォーマンス 確 保 用 のヒント etc. QML 開 発 時 の 参 考 に http://doc.qt.io/qtcreator/creator-checking-code-syntax.html 52
バージョン 管 理 システム(VCS) 様 々なバージョン 管 理 システムに 対 応 Bazaar ClearCase CVS Git Mercurial Perforce Subversion http://doc.qt.io/qtcreator/creator-version-control.html 53
プロジェクトの 設 定 共 有 プロジェクトの 設 定 使 用 するキット, ビルドオプション, コードスタイル, etc <project>.pro.user: 各 ユーザー 用 ( 自 動 的 に 生 成 ) <project>.pro.shared: プロジェクト 内 で 共 有 用.pro.sharedの 作 成 方 法.pro.userをコピー 不 要 な 項 目 を 削 除 ProjectExplorer.Project.Updater.FileVersion は 必 要 なので 残 す 作 成 した.pro.shared をリポジトリに 追 加 して 共 有 http://doc.qt.io/qtcreator/creator-sharing-project-settings.html 54
リファクタリングアクション コードの 記 述 を 補 助 シンボル 出 現 箇 所 の 検 索 シンボルの 変 更 メソッド 定 義 の 生 成 選 択 範 囲 から 関 数 エレメントを 作 成 Q_PROPERTY 用 メンバの 作 成 仮 想 関 数 のオーバーライドの 生 成, etc. 右 クリック アクションの 選 択 http://doc.qt.io/qtcreator/creator-editor-refactoring.html 55
外 部 ツール Qt Creatorから 外 部 のツールを 実 行 Linguist: lrelease, lupdate Qt Quick: プレビュー(qmlviewer, qmlscene) その 他 : vi, ソート ツールの 追 加 などのカスタマイズも 可 能 http://doc.qt.io/qtcreator/creator-editor-external.html 56
機 能 拡 張 Qt Creatorはプラグインで 拡 張 可 能 なアーキテクチャ コードモデルでリファクタリング 系 の 実 装 も 比 較 的 容 易 http://qt-labs.jp/2014/09/extending-qt-creator.html Qt Creator Pluginテンプレートも 活 用 http://doc-snapshots.qt.io/qtcreator-extending/extending-index.html 57
Qt Creator CppCheck integration plugin Qt Creator 用 CppCheck プラグイン サードパーティ 製 プラグイン 別 途 インストールが 必 要 CppCheck オープンソース(GPL)のC/C++ 用 静 的 解 析 ツール http://cppcheck.sourceforge.net http://sourceforge.net/projects/qtc-cppcheck/ 58
Qt Creator CppCheck integration plugin 59
翻 訳 プロジェクト Qt Creatorの 翻 訳 コミュニティによるボランティア https://www.transifex.com/projects/p/qt-creator/ 60
Application Development with Qt Creator - Second Edition Qt 入 門 書 Qt 5.3 & Qt Creator 3.1 https://www.packtpub.com/application-development/application-development-qt-creator-2nd-edition 61
Thank you http://www.qt.io/qtjapansummit2015/