web-dev-qa-db-ja.com

フラッター:拡張対柔軟

ExpandedウィジェットとFlexibleウィジェットの両方を使用しましたが、同じように動作するようです。私が逃した2つの間に違いはありますか?

33
Volleyball
Scaffold(
  appBar: AppBar(),
  body: Column(
    children: <Widget>[
      Row(
        children: <Widget>[
          buildExpanded(),
          buildFlexible(),
        ],
      ),
      Row(
        children: <Widget>[
          buildExpanded(),
          buildExpanded(),
        ],
      ),
      Row(
        children: <Widget>[
          buildFlexible(),
          buildFlexible(),
        ],
      ),
    ],
  ),
);

enter image description here

44
Raouf Rahiche

ExpandedFlexibleの省略形です

このように展開された使用:

Expanded(
  child: Foo(),
);

以下と厳密に同等です:

Flexible(
  fit: FlexFit.tight,
  child: Foo(),
);

別のFlexibleが必要な場合は、Expandedfitよりも使いたい場合があります。これは、レスポンシブレイアウトで役立ちます。

FlexFit.tightFlexFit.looseの違いは、looseを使用すると子が最大サイズになり、子が使用可能なすべてのスペースを強制的に占有することです。

44
Rémi Rousselet

拡張-セットフィットで柔軟です

class Expanded extends Flexible {
    const Expanded({
    Key key,
    int flex = 1,
@required Widget child,
}) : super(key: key, flex: flex, fit: FlexFit.tight, child: child);
}
5

Flexibleを使用して、rowsおよびcolumns。主に、親ウィジェットとの関係を維持しながら、さまざまな子ウィジェットのスペースを調整するために使用されます。

一方、Expandedは、rowsおよびの子に送信される制約を変更します列;そこの利用可能なスペースを埋めるのに役立ちます。したがって、子をExpandedウィジェットでラップすると、空のスペースが埋められます。

Flutterの公式YouTubeチャンネルからこれらのビデオを提供して、今後これを探す人を助けるために...

  1. 拡張:

  2. フレキシブル:

4
asifMojtoba