概要

キャンバスでは、動的レイアウトシャウトアウトの全体構造と外観を定義します。 フレームとウィジェットのコンテナとして機能し、シャウトアウトのサイズ、位置、画面上の表示方法を制御します。

この記事では、レイアウト動作、間隔、位置、閉じるボタン設定、要素ナビゲーションなど、キャンバスをスタイル付けし、設定する方法を説明します。

キャンバススタイリング

プロパティバッグの「スタイル」タブからキャンバスの外観をカスタマイズできます。

設定できます：

• コーナー半径
• 境界線の幅と色
• 塗りつぶし色

キャンバスシャドウ

キャンバスに影を追加して、背景から視覚的に分離できます。 以下の事前定義オプションが利用できます：

• なし
• ソフト
• レギュラー
• レトロ

コーナー半径値は、均一に適用したり、各コーナーに個別に設定したりできます。

レイアウトとサイズ設定

キャンバスレイアウトは、シャウトアウトがコンテンツにどのように適合するかを決定します。

サイズ設定動作

• キャンバス幅は、キャンバス上で直接ドラッグするか、プロパティバッグに値を入力することでサイズを変更できます。
• キャンバスの高さは、コンテンツの量に基づいて自動的に調整されます。
• キャンバスの幅のみが手動でサイズを変更できます。

内部スペース

内部スペースは、キャンバスの端と内部のフレームとの間の距離を制御します。

内部スペースを調整するには：

• キャンバスを選択します。
• プロパティバッグの間隔値を更新します。

デフォルトでは、すべての側面に同じ間隔値が適用されます。 各側に異なる値を設定するには：

• 枠線アイコンを選択します。
• 個々のサイド値を調整します。

間隔インジケーターは、変更を加えるとキャンバスに直接表示されます。

キャンバス位置

画面上のキャンバス位置は、プロパティバッグから設定されます。

以下の操作が可能です:

• デフォルトの画面上の位置のいずれかを選択します。
• カスタム位置トグルをオンにすると、正確な配置値を定義できます。

キャンバスの位置は、キャンバスから直接調整できません。

閉じるボタン設定

「閉じる」ボタンを使用すると、ユーザーはシャウトアウトを解除でき、完全にカスタマイズできます。

表示または非表示

• 「閉じるボタンを表示」トグルをオフにすると、キャンバスから「閉じる」ボタンが非表示になります。
• 再度表示するには、閉じるボタンの場所にカーソルを合わせ、選択し、トグルをオンに戻します。

スタイリング

スタイリングタブから「閉じる」ボタンをカスタマイズできます：

• アイコンのサイズと色
• ボタン半径と塗りつぶし色
• 境界線の幅と色

サイズと位置

• キャンバス上で直接「閉じる」ボタンのサイズを変更します。
• レイアウトタブから、ボタン位置を右上または左上隅に変更します。

要素ツリー

要素ツリーは、ビジュアルデザイナー内のすべてのコンポーネントとレイヤーの階層ビューを提供します。

要素ツリーを開くには：

• レイヤーアイコンを選択します。

要素ツリーを使用すると、次のことができます：

• 要素間をすばやく移動します。
• 入れ子コンポーネントをより簡単に選択して編集します。
• より強力な制御で複雑なレイアウトを管理します。

技術的なノート

• キャンバスの高さは、コンテンツによって自動的に決定されます。
• キャンバス幅は、手動でサイズを変更できる唯一のディメンションです。