Избегайте переполнения пикселей на AnimatedContainer - PullRequest
Новая
       24

Избегайте переполнения пикселей на AnimatedContainer

0 голосов
/ 08 мая 2019

У меня есть этот AnimatedContainer, который начинается с округлой формы, а затем, изменяя состояние, становится прямоугольником.Сначала он имеет только центрированный значок внутри, но когда контейнер расширяется, всплывающий текст рядом со значком.Проблема в том, что при расширении контейнера текст больше его контейнера, поэтому происходит переполнение пикселей.Как я могу это исправить?

Widget _animatedButton() {
    return GestureDetector(
      child: AnimatedContainer(
        duration: Duration(milliseconds: 300),
        height: MediaQuery.of(context).size.height * 0.08,
        width: _searchOpen
            ? MediaQuery.of(context).size.width * 0.5
            : MediaQuery.of(context).size.height * 0.08,
        decoration: new BoxDecoration(
          gradient: _searchOpen
              ? LinearGradient(colors: greenGradient)
              : RadialGradient(colors: greenGradient),
          borderRadius: _searchOpen
              ? BorderRadius.circular(16)
              : BorderRadius.circular(
                  MediaQuery.of(context).size.height * 0.04),
          boxShadow: <BoxShadow>[
            new BoxShadow(
              color: Colors.black12,
              blurRadius: 10.0,
              offset: const Offset(0, 10.0),
            )
          ],
        ),
        child: Row(
          children: <Widget>[
            Expanded(child: Container()),
            Center(
              child: Icon(
                Icons.search,
                color: Colors.white,
                size: MediaQuery.of(context).size.height * 0.05,
              ),
            ),
            _searchOpen
                ? new SizedBox(width: MediaQuery.of(context).size.width * 0.02)
                : Container(),
            _searchOpen
                ? new Text(
                    "Search",
                    style: TextStyle(
                        color: Colors.white,
                        fontFamily: "LazyDog",
                        fontSize: MediaQuery.of(context).size.width * 0.1),
                  )
                : Container(),
            new Expanded(child: Container()),
          ],
        ),
      ),
      onTap: () {
        setState(() {
          _searchOpen ? _searchOpen = false : _searchOpen = true;
        });
      },
    );
  }
...