Как исправить макет? - PullRequest
       7

Как исправить макет?

0 голосов
/ 03 ноября 2018

У меня есть этот код во флаттере:

@override
  Widget build(BuildContext context) {
    return new Stack(
      children: <Widget>[
        // The containers in the background
        new Column(
          children: <Widget>[
            new Container(
              height: MediaQuery.of(context).size.height * .65,
              color: const Color.fromRGBO(132, 162, 175, 1.0),
              child: new Column(
                children: [
                  new Image.asset('assets/app_logo_transparent_bg.png',
                  height: 100.0,
                  width: 100.0,
                  fit: BoxFit.fill,
                  ),
                ],
              ),
            ),
            new Container(
              height: MediaQuery.of(context).size.height * .35,
              color: Colors.white,
            )
          ],
        ),
        new Container(
          alignment: Alignment.topCenter,
          padding: new EdgeInsets.only(
              top: MediaQuery.of(context).size.height * .58,
              right: 20.0,
              left: 20.0),
          child: new Container(
            height: 200.0,
            width: MediaQuery.of(context).size.width,
            child: new Card(
              color: Colors.white,
              elevation: 4.0,
            ),
          ),
        )
      ],
    );
  }  

Результат таков:
https://www.dropbox.com/s/bxsormtht173t9d/Screenshot_20181103-204135.png?dl=0

Но я пытаюсь добиться этого:
https://www.dropbox.com/s/pgqlcuw28r19jfi/Screenshot_20181103-204559.png?dl=0

Так как убрать эти странные черные ящики?

1 Ответ

0 голосов
/ 04 ноября 2018

Вам нужно растянуть Column, используйте параметр CrossAxisAlignment.stretch до поля crossAxisAlignment вашего Column.

         @override
          Widget build(BuildContext context) {
            return new Stack(
              children: <Widget>[
                // The containers in the background
                new Column(
                  crossAxisAlignment: CrossAxisAlignment.stretch,
                  children: <Widget>[
                    new Container(

                    ...
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...