flutter - ButtonBar处理行溢出？

Question

卡中有ButtonBar。
我想插入按钮，直到卡的末尾，然后它们将换行。

唯一的问题是溢出。

我读到ButtonBar可以处理溢出并换行以继续插入，这是真的吗？我怎样才能做到这一点？

您认为使用Row处理这种情况更好吗？

child: SizedBox(
            width: MediaQuery.of(context).size.width*0.94,
            height: MediaQuery.of(context).size.height*0.3,
            child : Card(
              elevation: 3.0,
              child: Row(
                children: <Widget>[
                  Align(
                    alignment: Alignment(0,-1),
                    child : ButtonBar(
                      overflowDirection: ,
                      //mainAxisSize: MainAxisSize.max,
                      children: <Widget>[
                        new RaisedButton(
                          onPressed: null,
                          child: Text("One",
                          style: TextStyle(
                            color: Colors.black,
                            ),
                          ),
                          disabledColor: Colors.orange,
                          ),
                        new RaisedButton(
                          onPressed: null,
                          child: Text("Two",
                            style: TextStyle(
                              color: Colors.black,
                            ),
                          ),
                          disabledColor: Colors.lightGreen,
                        ),
                          new RaisedButton(
                            onPressed: null,
                            child: Text("Three",
                            style: TextStyle(
                              color: Colors.black,
                              ),
                            ),
                            disabledColor: Colors.yellowAccent,
                              ),
                        new RaisedButton(
                          child: Text("Four",
                          style: TextStyle(
                            color: Colors.black,
                            ),
                          ),
                          disabledColor: Colors.blue,
                        ),
                        new RaisedButton(
                          child: Text("Five",
                            style: TextStyle(
                              color: Colors.black,
                            ),
                          ),
                          disabledColor: Colors.red,
                        ),
                            ],
                          ),
                        ),
                      ],
                    ),
                  ),
                 ),

Answer 1

您可以使用ButtonBar尝试

例

import 'package:flutter/material.dart';

final Color darkBlue = Color.fromARGB(255, 18, 32, 47);

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.dark().copyWith(scaffoldBackgroundColor: darkBlue),
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Center(
          child: MyWidget(),
        ),
      ),
    );
  }
}

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return ButtonBar(
      alignment: MainAxisAlignment.start,
      children: List.generate(
        7,
        (index) => RaisedButton(
          onPressed: () {},
          child: Text("Button $index"),
        ),
      ),
    );
  }
}

输出:
With ButtonBar

但我认为您正在寻找的是Wrap例:

import 'package:flutter/material.dart';

final Color darkBlue = Color.fromARGB(255, 18, 32, 47);

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.dark().copyWith(scaffoldBackgroundColor: darkBlue),
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Center(
          child: MyWidget(),
        ),
      ),
    );
  }
}

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Wrap(
      spacing: 2.0,
      children: List.generate(
        50,
        (index) => RaisedButton(
          onPressed: () {},
          child: Text("Button $index"),
        ),
      ),
    );
  }
}

输出:With Wrap