レイアウト概念

ダッシュボードコンテンツのサイズと位置を変更できますが、いくつか制約があります。たとえば、ウィジェットで指定されている最小サイズでは、特定の位置にレポートウィジェットを配置できない可能性があります。

ホットスポット

ホットスポット領域を使うと、ウィジェットの配置とサイズ変更、およびダッシュボード上の使用可能なスペースの最適化ができます。

ダッシュボードが空の場合、そのコーナーとエッジにホットスポットが配置されます。ウィジェットを含むダッシュボードには、空またはウィジェットによって占有されているスペースのエッジとコーナーにホットスポットがあります。

ウィジェットのホットスポット領域は、エッジとセンターにあります。

ウィジェットをドラッグすると、指を領域の上に合わせたときにホットスポット領域が表示されます。

ホットスポット領域の上で指を止めると、ウィジェットの下にプレビューが表示されます。このプレビューは、ウィジェットをドロップした場合にウィジェットが占有する位置を示します。

ホットスポット領域の動作は、ホットスポット領域をエッジで使用するか、ダッシュボードのコーナーで使用するか、またはウィジェットを使用するかによって異なります。

  • ウィジェットをダッシュボードのコーナーにあるホットスポット領域に置くと、ウィジェットは利用可能なスペース全体を占めます。

    次の図は、コーナーのホットスポット領域を使用した例です。

  • ウィジェットをダッシュボードのエッジにあるホットスポット領域に置くと、ウィジェットはエッジに沿って利用可能なスペースの半分を占めます。

    次の例に、ダッシュボードのエッジにあるホットスポット領域を使用したケースを表示します。ダッシュボードのエッジにあるホットスポット領域は、エッジの高さ方向に沿ってちょうど中央の位置を占めます。ドロップすると、ウィジェットは、エッジの高さ方向に沿って縦に展開します。また、横に展開して利用可能なスペースの半分を占めます。

  • ウィジェットを別のウィジェットのセンターにあるホットスポット領域に置くと、ウィジェットが置き換わります。

コンテンツを追加するにつれて、利用できるホットスポット領域が増えます。

この例では、ダッシュボードの左側はすでに 2 つのウィジェットが占めており、右側に空きスペースが残されています。別のウィジェットを上のエッジの右側のスペースまでドラッグすると、ホットスポット領域が表示されます。そこでドロップすると、ウィジェットは空きスペースの横一杯を占め、さらに縦に展開して利用可能なスペースの半分を占めます。

並べて表示

ホットスポットが既存のウィジェットにある場合、ドロップされたウィジェットによって既存のウィジェットが半分に切り取られます。ホットスポットの枠が縦か横かに応じて、ウィジェットは垂直または水平方向に整列します。ホットスポットがダッシュボードのエッジにある場合、ドロップされたウィジェットはエッジにスナップされ、利用可能な長さを占有します。

ここでは、2 つのウィジェットがダッシュボードの右側を占めています。ダッシュボードの下部にあるウィジェットのホットスポット領域まで指でドラッグして別のウィジェットをドロップします。追加されたウィジェットは、ダッシュボードの下部にあるウィジェットが占めていたスペースの半分を取得します。

スワップ

2 つのウィジェットの位置をスワップするには、1 つのウィジェットをもう 1 つのウィジェットの上にドラッグして、中央のホットスポット領域の位置が合ったら、ドロップします。ウィジェットをドラッグする指が既存のウィジェットの真上になったときに、次のどちらかの結果になります。

  • 指を既存のウィジェットの中央に合わせると、ウィジェットが場所をスワップします。
  • ドラッグされたウィジェットがコンテンツ接続からドラッグされている場合、このウィジェットが既存のウィジェットを置き換えます。

注: 

ウィジェットに最小サイズが利用可能なスペースを超過しているレポートが含まれる場合、スワップできないことがあります。

プッシュおよび圧縮

2 本の指を使用してウィジェットをドラッグすると、そのパスで他のウィジェットがプッシュされます。ウィジェットがダッシュボードのエッジ、またはこれ以上圧縮されないウィジェットに向かってプッシュされると、そのウィジェットがエッジに向かって圧縮されます。

プッシュしているウィジェットをドロップする前に引き戻すと、圧縮されたウィジェットが元のサイズに戻ります。2 番目の指は、ウィジェットの外側または内側のどこにでも置くことができます。

中間プッシュ

ウィジェットを他のウィジェットの間にプッシュするには、1 本の指でドラッグして、2 番目の指で位置を決めてダッシュボードにドロップします。

追加されたウィジェットはその寸法を保持するか、他のウィジェットをプッシュする十分なスペースがなければ、縮小されます。通常、既存のウィジェットは新しいウィジェットを収容するために縮小されます。

注: 

2 番目の指は、ウィジェットの外側または内側のどこにでも置くことができます。

幅調整

ウィジェットのプロパティの [レイアウト] タブで、ウィジェットが自動的に展開されて、利用可能なスペースが埋まるように指定できます。

または、ウィジェットをホットスポット領域の上にドラッグアンドドロップすると、ウィジェットのプロパティの対応する幅調整オプションが自動的にオンになります。たとえば、コーナーのホットスポット領域を使用すると、ウィジェットの水平方向と垂直方向の両方の幅調整プロパティがオンになります。

これは、自動サイズ調整されるダッシュボードを作成するときに重要です。横または縦に幅調整するウィジェットのいずれかの端にウィジェットを配置できます。

  1. 横または縦に幅調整するウィジェットの端にウィジェットを指でドラッグします。
  2. 2 番目の指をダッシュボードに置きます。
  3. 両方の指を同時にダッシュボードから持ち上げます。

幅調整するウィジェットは新しいウィジェットを収容するために縮小されますが、幅調整の設定はそのままです。

ここで、ダッシュボードの下部のウィジェットは横に幅調整されます。もう一方のウィジェットを 1 本の指で下部のウィジェットのエッジまでドラッグします。引き戻す前に 2 番目の指を追加します。下部のウィジェットは縮小しますが、幅調整の設定はそのまま維持されます。2 番目のウィジェットを削除すると、下部のウィジェットは再び展開します。

注: 

2 番目の指は、図のようにウィジェットの外側と内側のどこに置いてもかまいません。