質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
Qt

QtはGUIプログラムの開発で広く使われているクロスプラットフォーム開発のフレームワークです。

Qt Creator

Qt Creatorは、Qtアプリケーションを開発するための開発統合環境(IDE)です。

Q&A

解決済

2回答

2506閲覧

QML オブジェクトを使いまわしたい

taichaso

総合スコア22

Qt

QtはGUIプログラムの開発で広く使われているクロスプラットフォーム開発のフレームワークです。

Qt Creator

Qt Creatorは、Qtアプリケーションを開発するための開発統合環境(IDE)です。

0グッド

0クリップ

投稿2019/09/24 23:56

編集2019/09/25 00:03

前提・実現したいこと

いつもお世話になっております。
レイアウト中にオブジェクトを使い回せないか検討しています。

現在カメラの表示を行っており、その表示する結果を様々なところで流用したいと考えています。

イメージとしては、SwipeViewの中にページが3つあって、それぞれでカメラの映像するといったものです。

qml

1SwipeView { 2 anchors.fill: parent 3 4 Page { 5 // ここに cameraViewを置きたい 6 } 7 Page { 8 // ここに cameraViewを置きたい 9 } 10  Page{ 11 cameraView { // イメージ 12 width: parent.width / 2; height: parent.height / 2 13 x: 0; y: 0; 14 } 15 cameraView { 16 width: parent.width / 2; height: parent.height / 2 17 x: 0; y: 0; 18 } 19 } 20} 21// 使いまわしたいオブジェクト 22Rectangle { 23 id: cameraView 24 25 Camera { 26 // 省略 27 } 28 VideoOutput { 29 // 省略 30 } 31}

発生している問題・エラーメッセージ

Pageとして作成したものをStackViewに入れ、それを2画面同時表示などを行うとスワイプして戻った場合にそのレイアウトが消えてしまう。
また、GoogleやQtの公式サイトで検索したいがどのように調べればよいかわからなかった。
(「Qml レイアウト 使いまわし」などで検索)

試したこと

Page として作成しておけばSwipeViewやStackViewなどで何度も使用することができるのは確認しました。
しかし、2画面表示などを行う際にはページ単位で持つのは難しいと思い、Rectangle または Itemとして扱えないかと考えています。

補足情報(FW/ツールのバージョンなど)

Qt 5.10.1
Qt Creator 4.5.1

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答2

0

自己解決

下記の方法で解決することが出来ました。

RectangleではなくItemで扱い、StackViewで保持する方法で実装することが出来ました。

qml

1 2SwipeView { 3 anchors.fill: parent 4 5 onCurrentIndexChanged: { 6 sv_page1.clear(null); // これでStackView内全削除 7 sv_page2.clear(null); 8 sv_page3.clear(null); 9 10 // 表示されているViewのみに表示 11 switch (currentIndex) { 12 case 0: 13 sv_page1.push(cameraView); 14 break; 15 case 2: 16 sv_page2.push(cameraView); 17 break; 18 case 3: 19 sv_page3.push(cameraView); 20 break; 21 } 22 } 23 24 StackView{ 25 id: sv_page1 26 } 27 StackView{ 28 id: sv_page2 29 } 30 Page{ 31 StackView{ 32 id: sv_page3 33 } 34 StackView { 35 // 別のオブジェクトをここで使う 36 } 37 } 38} 39// 使いまわしたいオブジェクト 40Item { 41 id: cameraView 42 43 Camera { 44 // 省略 45 } 46 VideoOutput { 47 // 省略 48 } 49} 50

投稿2019/09/27 23:39

taichaso

総合スコア22

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

表示のコピーで良いのであれば、ちょっとトリッキーですが、 ShaderEffectSource を利用するという手があります。この場合、表示以外の機能は各 Page で実装する形になります。

qml

1import QtQuick 2.12 2import QtQuick.Controls 2.5 3 4ApplicationWindow { 5 visible: true 6 width: 640 7 height: 480 8 title: qsTr("Tabs") 9 10 Rectangle { 11 id: content 12 anchors.fill: parent 13 color: 'red' 14 } 15 16 SwipeView { 17 id: swipeView 18 anchors.fill: parent 19 currentIndex: tabBar.currentIndex 20 21 Repeater { 22 model: 5 23 Page { 24 ShaderEffectSource { 25 anchors.fill: parent 26 sourceItem: content 27 hideSource: true 28 } 29 MouseArea { 30 anchors.fill: parent 31 onClicked: console.debug('page %1 clicked'.arg(model.index)) 32 } 33 } 34 } 35 } 36 37 footer: TabBar { 38 id: tabBar 39 currentIndex: swipeView.currentIndex 40 41 Repeater { 42 model: 5 43 TabButton { 44 text: qsTr('Page %1'.arg(model.index)) 45 } 46 } 47 } 48} 49 50

投稿2019/09/26 14:53

tasuku.

総合スコア347

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問