flutter - 如何使ListView CrossAxisAlignment包装内容?

标签 flutter dart flutter-layout

我的目标是制作一个水平滚动的ListView。我希望高度与ListView中最大项目的高度相同。现在,水平ListView展开以填充整个垂直屏幕。如何缩小高度而不指定高度却仍然可以滚动?

这是带有我所拥有代码的dartpad链接:https://dartpad.dev/13bd819a46e6c2d840147a5855a6e54c

最佳答案

也许这将是您想要的输出,尝试一下,

// Copyright (c) 2019, the Dart project authors.  Please see the AUTHORS file
// for details. All rights reserved. Use of this source code is governed by a
// BSD-style license that can be found in the LICENSE file.

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Home(),
    );
  }
}

class Home extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    var fraction = OutlinedContainer(
        child: IntrinsicWidth(
          child: Padding(
            padding: const EdgeInsets.all(8.0),
            child: Column(
              mainAxisSize: MainAxisSize.min,
              children: <Widget>[
                Text("100"),
                Container(
                  height: 2,
                  color: Colors.black,
                ),
                Text("300"),
              ],
            ),
          ),
        ));

    return Scaffold(
        body: OutlinedContainer(
          child: Column(
            mainAxisSize: MainAxisSize.min,
          children: [Wrap(
          children: <Widget>[
            fraction,fraction,   fraction
          ],),]),
        ));
  }
}

class OutlinedContainer extends Container {
  OutlinedContainer({@required Widget child}) : super(child: child,             decoration: BoxDecoration(
                border: Border.all(color: Colors.blue, width: 3),
                borderRadius: BorderRadius.circular(10)));
}

enter image description here

关于flutter - 如何使ListView CrossAxisAlignment包装内容?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59367629/

相关文章:

Flutter auto_route, getter 'key' 在 null 上被调用

flutter - 在if语句条件下如何使用Future <bool>?

dart - 如何根据文本大小扩展文本和容器?

regex - 如何在WhitelistingTextInputFormatter的正则表达式中允许单引号?

dart - Dart 中的关闭 Hook ?

flutter - 当我尝试将 APK 构建为发布版本时,我遇到了灰屏,Flutter 中没有任何内容

flutter - 没有这样的方法错误: The getter 'isNotEmpty' was called on null

flutter - 在 flutter 中添加背景图像

Flutter 应用程序和 Web 自适应 UI 布局

flutter - ShaderMask LinearGradient停止奇怪的行为