Flutter Row：动态高度和垂直拉伸

Question

我有一个 ListView 项目，它具有受文本内容影响的动态高度。这是一个带有两个文本小部件的简单 Column。

当将 Column 包裹在 Row 中并添加 Image 时，我希望图像垂直扩展（但固定宽度）以匹配文本的自动高度。

但是，我无法在 Row 上使用 CrossAxisAlignment.stretch，因为它需要固定高度。

如何根据图片旁边的文字内容得到我的图片，expand/shrink？

Answer 1

A Stack 将自动包装未定位的子项。您可以利用这一优势：

import 'package:flutter/material.dart';

void main() => runApp(App());

class App extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(),
        body: ListView(
          children: <Widget>[
            Stack(
              children: <Widget>[
                Positioned(
                  left: 0,
                  top: 0,
                  bottom: 0,
                  width: 100,
                  child: Container(color: Colors.orange), // replace with your image
                ),
                Padding(
                  padding: EdgeInsets.fromLTRB(116, 16, 16, 16),
                  child: Text('Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo'),
                )
              ],
            ),
          ],
        )
      ),
    );
  }
}

Flutter Row：动态高度和垂直拉伸

Flutter Row: Dynamic Height & Vertical Stretch

image

dynamic

flutter

expand