コンテナウィジェットを親ウィジェットの垂直方向に配置する 質問する

コンテナウィジェットを親ウィジェットの垂直方向に配置する 質問する

TL;DR コンテナーがオンタップ リスナーとして機能できるように、垂直方向のスペースを埋める必要があります。ほとんどの解決策を試しましたが、何も機能しないようです。

私がやろうとしているのは、コンテナの幅を固定したまま、垂直方向のスペースを埋めることです。2つ目は私が持っているもので、3つ目は私が欲しいものですアイデアは、ジェスチャ オンタップ リスナーを使用してコンテナーを透明にすることです。別の解決策としてより良いアイデアをお持ちの方は、遠慮なく提案してください。

    Widget build(BuildContext context) {
    return new GestureDetector(
      onHorizontalDragUpdate: _move,
      onHorizontalDragEnd: _handleDragEnd,
      child: new Stack(
        children: <Widget>[
          new Positioned.fill(           
            child: new Row(
              mainAxisAlignment: MainAxisAlignment.end,
              children: <Widget>[
                new Container(
                  child: new IconButton(                          
                    padding: new EdgeInsets.only(top: 16.0, bottom: 16.0, left: 24.0, right: 24.0),
                    icon: new Icon(Icons.warning),
                    color: Colors.black12,
                    onPressed: () {},
                  )
                ),
              ],
            ),
          ),
          new SlideTransition(
            position: new Tween<Offset>(
              begin:  Offset(0.0, 0.0),
              end: const Offset(-0.6, 0.0),
            ).animate(_animation),
            child: new Card(
              child: new Row(
                children: <Widget>[
                  new Container(
                    width: 20.0,
                    height: 20.0,
                    color: Colors.amber,
                  ),
                  new Expanded(
                    child: new Column(
                      mainAxisSize: MainAxisSize.min,
                      children: <Widget>[
                        
                        _getListTile(),
                        _ifStoplineIsToBeShown()
                      ],
                    ),
                  )
                ],
              )
            ),
          ),
        ],
      )
    );
  }

いろいろなことを試してみたが、何もうまくいかないということを考えると、何かを見落としているのは確かです。

デバッグペイントの画像もアップロードしましたここ

PS. 高さを固定値に設定しましたが、これがコンテナを表示する唯一の方法です。

ベストアンサー1

コツはIntrinsicHeightウィジェットとをRow組み合わせることですcrossAxisAlignment: CrossAxisAlignment.stretch

これにより、Row の子要素は垂直方向に拡張されますが、Row は可能な限り最小の垂直方向のスペースを占めることになります。

Card(
  child: IntrinsicHeight(
    child: Row(
      crossAxisAlignment: CrossAxisAlignment.stretch,
      children: <Widget>[
        Container(
          width: 20.0,
          color: Colors.amber,
        ),
        // Expanded(...)
      ],
    ),
  )
)

おすすめ記事