メインコンテンツまでスキップ

AspectRatio

概要

縦横比を固定します。たとえば16:9の比率のサムネイルや動画領域を確保できます。

プロパティ

プロパティ説明デフォルト値
aspectRatioウィジェットの横:縦の比率をこの値(幅÷高さ)で固定します。サイズは子コンテンツではなく、親から与えられたスペースを基準に決まります(下の「サイズの決まり方」を参照)。0より大きい数値1.0

サイズの決まり方

AspectRatioは**子コンテンツのサイズには合わせません。**親から与えられたレイアウトスペース(制約)を基準に自分のサイズを先に決め、そのサイズに合わせて子を配置します。

  • 親が与える最大の幅を取り → 高さ = 幅 ÷ 比率
  • 幅が制限なく無限の場合 → 代わりに最大の高さを取り、幅 = 高さ × 比率
  • 計算結果が親の制約を超える場合は、制約の範囲内に収め直します。
警告

そのため、Row・Columnのように一方向に広いスペースを与える親の中では、子(例:テキスト)ではなく親が許容した幅まで横に拡張されます。たとえばRowの中のテキストにAspectRatioを適用すると、文字幅ではなくRowが許容した幅まで横に伸び、その幅に比率を合わせて高さが決まります。子のサイズに合わせたい場合は、親側で幅を制限してください(SizedBoxや固定幅で囲む、またはAlign・Centerで配置)。