Кнопка полной ширины, как выровнять текст

Question

Попытка выяснить, могу ли я выровнять текст по кнопке на всю ширину, т.е. кнопка с width: double.infinity

например это:

ButtonTheme(
  minWidth: double.infinity,
  child: FlatButton(
    onPressed: () {},
    child: Text('Sign Out', textAlign: TextAlign.left),
  ),
)

создает текстовую кнопку по центру, и выравнивание не может быть изменено.

Я попробовал несколько вещей, но не могу понять, если не попытаюсь создать пользовательскую кнопку.

Я пытаюсь получить кнопку полной ширины с текстом: слева, чтобы пользователь мог щелкнуть в любом месте строки и при этом получить эффект касания материала.

Answer 1

Я обнаружил, что RawMaterialButton метод сборки ребенка всегда по центру :

child: Center(
  widthFactor: 1.0,
  heightFactor: 1.0,
  child: widget.child,
),

Чтобы текст был выровнен по началу / влево, можно задать ему бесконечность, что сделает его таким же широким, как и его родитель, виджетом Center.

child: FlatButton(
  child: SizedBox(
    width: double.infinity,
    child: Text(
      'Sign out',
      textAlign: TextAlign.left,
    ),
  ),
  onPressed: () {},
);

Answer 2

вам нужно использовать Expanded виджет

    Expanded(
      child: FlatButton(
        onPressed: (){},
        child: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Padding(
              padding: const EdgeInsets.only(right: 12.0),
              child: Icon(Icons.description),
            ),
            Text("Detalles"),
          ],
        ),
      ),
    ),