трепетание - центр переполнения текста и клипа - PullRequest
0 голосов
/ 05 марта 2020

для реализации макета. Я пытаюсь отцентрировать (обрезать) текст вне экрана (см. Рисунок). Клип в красных прямоугольниках находится за пределами экрана и должен быть обрезан.

desired behavious

Я смог позволить тексту переполнить экран:

Widget build(BuildContext context) {
    return Padding(
            padding: EdgeInsets.fromLTRB(0, 50, 0, 30),
                child: Text(
                  "DASHBOARDasdasdasdasdasdasdas",
                  overflow: TextOverflow.clip,
                  softWrap: false,
                  maxLines: 1,
                  textAlign: TextAlign.center,),

          );
}

но я не смог центрировать текст:

The Text is clipped at the end, but not centered

Кто-нибудь знает, как Понимаете это?

Спасибо

Обновление:

Благодаря ответу @pungjunghyeon текст теперь переполняется слева и справа. Теперь я хотел бы обрезать UnconstrainedBox, чтобы предотвратить предупреждение о переполнении, но я не могу их избежать. Любой дальнейший намек на этот счет?

@override
  Widget build(BuildContext context) {
    return Container(
      width: MediaQuery.of(context).size.width,
      child: ClipRect(
        child: UnconstrainedBox(

          child: Text(

                "DASHBOARD",
                overflow: TextOverflow.visible,
                textAlign: TextAlign.center,

                style: TextStyle(
                  fontFamily: 'Segoe UI',
                  fontWeight: FontWeight.bold,
                  fontSize: 60,
                  letterSpacing: 20,
                  color: Colors.orange
                ),
            ),
        ),
      ),
    );
  }

Ответы [ 2 ]

1 голос
/ 05 марта 2020

Пожалуйста, используйте виджет UnconstrainedBox .

Например:

@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: appBar,
    body: Container(
      width: MediaQuery.of(context).size.width,
      child: UnconstrainedBox(
        child: Text(
          'DASHBOARD',
          style: TextStyle(fontSize: 80.0),
          overflow: TextOverflow.visible,
          textAlign: TextAlign.center
        ),
      )
    ), //Container
  ); // Scaffold
}
0 голосов
/ 05 марта 2020
Padding(
            padding: EdgeInsets.fromLTRB(0, 50, 0, 30),
                child: FittedBox(
                  fit:BoxFit.contain,
                  child: Text(
                    "DASHBOARDasdasdasdasdasdasdas DASHBOARDasdasdasdasdasdasdas DASHBOARDasdasdasdasdasdasdas DASHBOARDasdasdasdasdasdasdas DASHBOARDasdasdasdasdasdasdas DASHBOARDasdasdasdasdasdasdas",
                    overflow: TextOverflow.clip,
                    softWrap: false,
                    maxLines: 1,
                    textAlign: TextAlign.center,),
                ),
      );
...