『コメ欄』✚(プラス): 画面背景とプロップ
![『コメ欄』✚ 『コメ欄』✚](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKEuUB7T-MHeSe1zwce1lyLER2CqUnxyK16IGDaRlU02Ur13-ol8a1F8-N-GifxGxOM1t3fIwHR4K-VITkuy9A6v73GJRRAiJnprj1AUN4pb6FhdVknghYiONF0fJxG5PESqH6tk9xHa14Tk17-DSyLNEj29mDm-L452JmFk6vrFfqBCQbfzarH12d/s1600/ic_launcher.png)
コンテンツクリエイター向けに「画面配信/録画コンテンツコンポーザー」アプリとして公開している、
「アプリ内表示画面」の表示要素 (又はコンテンツ)となる:
- 「画面背景」と
- 「プロップ (小道具)」
についての説明をここにメモしておきます。
画面背景とプロップ
画面背景
「画面背景」は次の4種類の背景を選択する事ができます:
- カメラ: 端末のカメラからの映像を全画面表示。
- 背景動画: インポートした動画ファイルを表示。
- 背景画像: インポートした画像ファイルを表示。
- 背景色: 全画面を単一色又は複数の色のグラデーションで塗りつぶします。
画面背景は「アプリ内表示画面」の背景画として、基本的に全画面で表示されます。 また、違う種類の背景が複数有効になっている場合は、次のアニメーションにある様に層状に重ねて表示される為、下層の背景は上層にくる背景コンテンツに透過部がある部分でのみで表示されます。
※: タップするとアニメーションが再開します。
画面の手前から後ろへと、上のリストの上から下への順番、「 カメラ」「 背景動画」「 背景画像」「 背景色」で重なって表示されます。
プロップ
プロップは画面背景の手前に重ねて表示されますが、常に一番手前に表示される 「 ツールバー」に加えて、次のプロップが「アプリ内表示画面」上に複数個表示出来ます:
- オーバーレイ: HTMLオーバーレイやHTMLページなどのHTMLコンテンツを表示。
- 画像(移動可): png/jpeg/gifなどの画蔵を表示 (回転、縮小/拡大、可)
- テキストバナー: 任意のテキストを表示 (文字のスクロールにも対応)。
オーバーレイ
※: タップするとアニメーションが再開します。
プロップの表示位置
各プロップの表示位置は、「アプリ内表示画面」内でドラッグして調節する仕様になっています。
- ツールバーは、ツールバーの アイコンをドラッグする事で移動出来ます。
- ツールバー以外のプロップは、ツールバーの
プロップの表示順とシーン
ツールバー以外のプロップは「 プロップ一覧表」で表示するシーンの選択と、プロップの表示の順番を変更する事が出来ます。
※: ツールバーは全てのシーンで表示され、常に他のプロップと画面背景の手前に表示されます。
プロップの追加と設定
ツールバー以外のプロップは「画面背景とプロップ 」画面のプロップ タブから開く各プロップの設定画面で追加/設定が出来ます。
ツールバーは、同じタブ内にある「 ツールバー設定」でツールバーの色やシーンのショートカットキーを設定出来ます。
プロップ一覧表
「プロップ一覧表 」には、ツールバー以外の、全ての表示可能なプロップの一覧が表示されます。
この一覧ではプロップが上から下へと順番に行 (↔)で表示されていて、上の行にあるプロップが「アプリ内表示画面」では手前に表示される仕様になっています。 (ツールバーは常に一番手前に表示されます。)
また、表の左側にあるプロップの名前をドラッグする事で順番を並び替える事が出来ます。
縦の列 (↕)にはシーン番号が付いているので、表の該当するセル(マス目)内で、各プロップがどのシーンでの表示 () /非表示 ()になるかをタップで切り替える事が出来ます。
「プロップ一覧表 」は:
- 「画面背景とプロップ 」画面のプロップ タブにある「プロップ一覧表 」、又は、
- ツールバーの
から開く事が出来ます。
ツールバー
「アプリ内表示画面」ではツールバー上のボタンで
- シーンの選択、
- プロファイルの表示位置や大きさの調節、
- カメラ操作、
などが出来ます。
次のツールバーは実際の『コメ欄』✚の「アプリ内表示画面」で表示されるツールバーをこのページ上で模作した物で、ボタン操作時の反応を可能な限り再現しています。
(※: スクロールバーの見た目やアニメーションは実際のアプリの表示とは多少異なる場合があります。)
ツールバーマーカー
- 画面上でマーカーアイコン ()をドラッグして、ツールバーを移動する事が出来ます。
- マーカーアイコン ()をタップして、マーカー以外のボタンの表示/非表示を切り替える事が出来ます。
※: 上のツールバーのマーカーをタップして表示を切り替える事も可能です
ドロワーメニューボタン
ツールバーが最小化していない状態で、ツールバーの一番右に表示されるボタンで、「アプリ内表示画面」のドローワーメニューを開きます。
モードセレクター
「ツールバーマーカー 」と「ドロワーメニューボタン 」の間に、複数のボタンが横スクロール可能な状態で表示されますが、一番左に表示される「モードセレクター」ボタンでツールバーのモードを選択出来ます。
モードセレクターをタップすると、選択可能なモードの一覧がポップアップメニューで表示され、メニューから任意のモードを選択すると「モードセレクター」の右に表示されるボタンは選択したモードに該当したボタンに切り替わります。
※: ツールバーの色は「 画面背景とプロップ 」画面にある「 ツールバー設定 」画面で変更出来ます。
現バージョン (Ver 0.3.9) ではセレクターをタップすると次の3つのモードがメニュー表示されます。
カメラ設定
画面背景のカメラが有効になっている場合に、カメラ設定を調節出来ます。
ツールバーの「 カメラ設定」モードでは「モードセレクター」の右に次のボタンが表示されます:
ライト: 選択されているカメラのライトのオン/オフを切り替えます。
※: 選択されているカメラにライト/フラッシュが無い場合は機能しません。
カメラ選択: カメラを切り替えます。
※: カメラ画像は「アプリ内表示画面」でダブルタップするとフィルターを有効/無効に出来ます。
シーンセレクター
シーンを選択出来ます。
ツールバーの「 シーンセレクター」モードでは「モードセレクター」の右に1~5のシーン番号が付いたボタンが表示されます。
シーン1を表示します。
シーン5を表示します。
BluetoothやUSBでキーボードが接続されている場合は、これらのシーンセレクターボタンをキーボードショートカットで直接操作する事も可能です。
(ショートカットは「画面背景とプロップ 」画面にある「 ツールバー設定」画面で設定出来ます。)
プロップ
ツールーバー以外のプロップの位置や表示サイズを変更する事が出来ます。
このモードを選択後に、
- 「アプリ内表示画面」で変更したいプロップをタップするか、
- ツールバー内の「 (上のプロップ)」「 (下のプロップ)」ボタンでプロップを選んで、
選択したプロップの次の要素を変更する事が出来ます (プロップ編集モード):
- 表示位置 「」 (プロップが緑枠でハイライトされます。)
- 表示サイズ 「」 (プロップがオレンジ枠でハイライトされます。)
- 角度 「」 (プロップが黄色枠でハイライトされます。)
同じプロップを再度タップするか、ツールバーの「 (次の編集モード)」ボタンをタップする毎に、プロップ編集モードが
の順番で循環します。
また、「 (対応)」ボタンをタップする事で選択中のプロップの表示内容を操作する事が出来ます。
プロップが「オーバーレイ」の場合は、表示されているコンテンツ(ボタンやテキスト入力など)を操作出来ますが、「テキストバナー」や「画像(移動可)」は操作に対応していません。
「 プロップ」モードでは「モードセレクター」の右に次のボタンが表示されます:
解除: プロップの編集モードを解除します。
上のプロップ:
1つ手前にあるプロップを選択します。
一番手前のプロップが選択されている場合は一番奥のプロップを選択します。
次の編集モード: プロップの編集モードをループして切り替えます。
対話: プロップのUIを有効にします。
下のプロップ:
1つ奥にあるプロップを選択します。
(一番奥のプロップが選択されている場合は一番手前のプロップを選択します。)
プロップ一覧: プロップ一覧表を表示します。
「画面背景とプロップ 」画面
画面背景 タブ
このタブでは各画背景のプロファイル設定を変更する事が出来ます:
- カメラ 設定: カメラの表示サイズとフィルターの種類の選択が出来ます。 (この設定はバージョン0.3.10以降で有効です。)
- 背景動画 設定: アプリ共通の背景動画のプリセットを編集出来ます。
- 背景画像 設定: アプリ共通の背景画像のプリセットを編集出来ます。
- 背景色 設定: アプリ共通の背景色のプリセットを編集出来ます。
プロップ タブ
このタブでは「プロップ一覧表」を確認出来る他に、各プロップのプロファイル設定を変更する事が出来ます:
- プロップ一覧表
- オーバーレイ 設定: HTMLオーバーレイのプリセットを編集出来ます。
- 画像(移動可) 設定: 画像(移動可)のプリセットを編集出来ます。
- テキストバナー 設定: テキストバナーのプリセットを編集出来ます。
- ツールバー 設定: ツールバーの色、シーン選択のショートカットキーを変更出来ます。
コメント
コメントを投稿