ButtonBar обрабатывает переполнение строки? - PullRequest
0 голосов
/ 25 мая 2020

У меня внутри карты ButtonBar. Я хотел бы вставить кнопки до конца карты, тогда они будут go на новой строке.

Единственная проблема - переполнение.

Я читал, что ButtonBar может справиться с переполнение и go на новой строке, чтобы продолжить вставку, это правда? Как это сделать?

Как вы думаете, лучше ли справиться с этой ситуацией с помощью 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,
                        ),
                            ],
                          ),
                        ),
                      ],
                    ),
                  ),
                 ),

1 Ответ

0 голосов
/ 25 мая 2020

Вы можете попробовать 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"),
        ),
      ),
    );
  }
}

Результат: С 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"),
        ),
      ),
    );
  }
}

Результат: С переносом

...