『コメ欄』✚(プラス): 画面背景とプロップ

- 7/31/2024

コンテンツクリエイター向けに「画面配信/録画コンテンツコンポーザー」アプリとして公開している、

『コメ欄』✚ (プラス)で、

「アプリ内表示画面」の表示要素 (又はコンテンツ)となる:

「画面背景」と
「プロップ (小道具)」

についての説明をここにメモしておきます。

[目次]

『コメ欄』✚ 関連ページ

画面背景とプロップ

「プロップ」とは何なのかと分かりにくいかもしれませんが、演劇の舞台設定に例えて、「画面背景」は舞台の後ろを覆う舞台背景幕、「プロップ」は背景の手前に配置される小道具と考えてもらえると分かり易いかもしれません。

画面背景

「画面背景」は次の４種類の背景を選択する事ができます:

カメラ: 端末のカメラからの映像を全画面表示。
背景動画: インポートした動画ファイルを表示。
背景画像: インポートした画像ファイルを表示。
背景色: 全画面を単一色又は複数の色のグラデーションで塗りつぶします。

画面背景は「アプリ内表示画面」の背景画として、基本的に全画面で表示されます。また、違う種類の背景が複数有効になっている場合は、次のアニメーションにある様に層状に重ねて表示される為、下層の背景は上層にくる背景コンテンツに透過部がある部分でのみで表示されます。

※: タップするとアニメーションが再開します。

画面の手前から後ろへと、上のリストの上から下への順番、「カメラ」「背景動画」「背景画像」「背景色」で重なって表示されます。

プロップ

プロップは画面背景の手前に重ねて表示されますが、常に一番手前に表示される「 ツールバー」に加えて、次のプロップが「アプリ内表示画面」上に複数個表示出来ます:

オーバーレイ: HTMLオーバーレイやHTMLページなどのHTMLコンテンツを表示。
画像(移動可): png/jpeg/gifなどの画蔵を表示 (回転、縮小/拡大、可)
テキストバナー: 任意のテキストを表示 (文字のスクロールにも対応)。

オーバーレイ

バナー

ツールバー

※: タップするとアニメーションが再開します。

プロップの表示位置

各プロップの表示位置は、「アプリ内表示画面」内でドラッグして調節する仕様になっています。

ツールバーは、ツールバーのアイコンをドラッグする事で移動出来ます。
ツールバー以外のプロップは、ツールバーの

(プロップ)モードでプロップを選択した後にドラッグして表示位置を調節する事が出来ます。

プロップの表示順とシーン

ツールバー以外のプロップは「 プロップ一覧表」で表示するシーンの選択と、プロップの表示の順番を変更する事が出来ます。

※: ツールバーは全てのシーンで表示され、常に他のプロップと画面背景の手前に表示されます。

プロップの追加と設定

ツールバー以外のプロップは「画面背景とプロップ 」画面のプロップタブから開く各プロップの設定画面で追加/設定が出来ます。

ツールバーは、同じタブ内にある「 ツールバー設定」でツールバーの色やシーンのショートカットキーを設定出来ます。

プロップ一覧表

「プロップ一覧表 」には、ツールバー以外の、全ての表示可能なプロップの一覧が表示されます。

この一覧ではプロップが上から下へと順番に行 (↔)で表示されていて、上の行にあるプロップが「アプリ内表示画面」では手前に表示される仕様になっています。 (ツールバーは常に一番手前に表示されます。)

また、表の左側にあるプロップの名前をドラッグする事で順番を並び替える事が出来ます。

縦の列 (↕)にはシーン番号が付いているので、表の該当するセル(マス目)内で、各プロップがどのシーンでの表示 () /非表示 ()になるかをタップで切り替える事が出来ます。

「プロップ一覧表 」は:

「画面背景とプロップ 」画面のプロップタブにある「プロップ一覧表 」、又は、
ツールバーの

(プロップ) モードでスクロール部分の一番右に表示される

ボタン

から開く事が出来ます。

プロファイル

『コメ欄』✚のメイン画面上部にある「プロファイル選択バー」で複数のユーザープロファイルを追加すると、各ユーザー毎の設定を切り替える事が出来ますが:

「画面背景」のプリセット設定は全てのプロファイルの共通設定として保存されますが、各シーンでどのプリセットを有効になるかの選択はプロファイルごとに保存されます。
「プロップ」のプリセット設定はプロファイルごとに固有の設定が保存されます。

ドロワーメニューボタン

ツールバーが最小化していない状態で、ツールバーの一番右に表示されるボタンで、「アプリ内表示画面」のドローワーメニューを開きます。

モードセレクター

「ツールバーマーカー 」と「ドロワーメニューボタン 」の間に、複数のボタンが横スクロール可能な状態で表示されますが、一番左に表示される「モードセレクター」ボタンでツールバーのモードを選択出来ます。

モードセレクターをタップすると、選択可能なモードの一覧がポップアップメニューで表示され、メニューから任意のモードを選択すると「モードセレクター」の右に表示されるボタンは選択したモードに該当したボタンに切り替わります。

「ツールーバーマーカー 」の右にある「モードセレクター」をタップするとモードのメニューが表示されます。

※: ツールバーの色は「 画面背景とプロップ 」画面にある「 ツールバー設定 」画面で変更出来ます。

現バージョン (Ver 0.3.9) ではセレクターをタップすると次の3つのモードがメニュー表示されます。

カメラ設定

画面背景のカメラが有効になっている場合に、カメラ設定を調節出来ます。

ツールバーの「カメラ設定」モードでは「モードセレクター」の右に次のボタンが表示されます:

ライト: 選択されているカメラのライトのオン/オフを切り替えます。

※: 選択されているカメラにライト/フラッシュが無い場合は機能しません。

カメラ選択: カメラを切り替えます。

※: カメラ画像は「アプリ内表示画面」でダブルタップするとフィルターを有効/無効に出来ます。

シーンセレクター

シーンを選択出来ます。

ツールバーの「シーンセレクター」モードでは「モードセレクター」の右に１~５のシーン番号が付いたボタンが表示されます。

シーン1を表示します。

⋮

シーン5を表示します。

BluetoothやUSBでキーボードが接続されている場合は、これらのシーンセレクターボタンをキーボードショートカットで直接操作する事も可能です。

(ショートカットは「画面背景とプロップ 」画面にある「 ツールバー設定」画面で設定出来ます。)

プロップ

ツールーバー以外のプロップの位置や表示サイズを変更する事が出来ます。

このモードを選択後に、

「アプリ内表示画面」で変更したいプロップをタップするか、
ツールバー内の「 (上のプロップ)」「 (下のプロップ)」ボタンでプロップを選んで、

選択したプロップの次の要素を変更する事が出来ます (プロップ編集モード):

表示位置 「」 (プロップが緑枠でハイライトされます。)
表示サイズ 「」 (プロップがオレンジ枠でハイライトされます。)
角度「」 (プロップが黄色枠でハイライトされます。)

同じプロップを再度タップするか、ツールバーの「 (次の編集モード)」ボタンをタップする毎に、プロップ編集モードが

表示位置 → 表示サイズ → 角度 → なし

の順番で循環します。

また、「 (対応)」ボタンをタップする事で選択中のプロップの表示内容を操作する事が出来ます。

プロップが「オーバーレイ」の場合は、表示されているコンテンツ(ボタンやテキスト入力など)を操作出来ますが、「テキストバナー」や「画像(移動可)」は操作に対応していません。

「 プロップ」モードでは「モードセレクター」の右に次のボタンが表示されます:

解除: プロップの編集モードを解除します。

上のプロップ: １つ手前にあるプロップを選択します。
一番手前のプロップが選択されている場合は一番奥のプロップを選択します。

次の編集モード: プロップの編集モードをループして切り替えます。

対話: プロップのUIを有効にします。

下のプロップ: １つ奥にあるプロップを選択します。
(一番奥のプロップが選択されている場合は一番手前のプロップを選択します。)

プロップ一覧: プロップ一覧表を表示します。

「画面背景とプロップ」画面

「画面背景とプロップ 」では「アプリ内表示画面」に表示出来る各コンテンツの設定画面が、

「画面背景」と
「プロップ」(小道具)の

２つのタブに分類してリストされています。

画面背景 (左タブ)

プロップ (右タブ)

画面背景タブ

このタブでは各画背景のプロファイル設定を変更する事が出来ます:

カメラ設定: カメラの表示サイズとフィルターの種類の選択が出来ます。 (この設定はバージョン0.3.10以降で有効です。)
背景動画設定: アプリ共通の背景動画のプリセットを編集出来ます。
背景画像設定: アプリ共通の背景画像のプリセットを編集出来ます。
背景色設定: アプリ共通の背景色のプリセットを編集出来ます。

プロップタブ

このタブでは「プロップ一覧表」を確認出来る他に、各プロップのプロファイル設定を変更する事が出来ます:

プロップ一覧表
オーバーレイ設定: HTMLオーバーレイのプリセットを編集出来ます。
画像(移動可) 設定: 画像(移動可)のプリセットを編集出来ます。
テキストバナー設定: テキストバナーのプリセットを編集出来ます。
ツールバー設定: ツールバーの色、シーン選択のショートカットキーを変更出来ます。

『コメ欄』✚ (プラス)関連ページ

v0.3.x: サポートページ
一般設定画面
画面背景とプロップ (このページ)

『コメ欄』✚ (プラス)

iPhone/iPad版

by BIBO-HQ

Android版

by kii_memo_jp

このブログを検索

kii-memo-dev

ラベル

アーカイブ