Блог

Я использую виджет «от одного Stack до Positioned одного» поверх Image.asset виджета, но проблема в том, что мой виджет «Весь стек» не прокручивается для просмотра всего содержимого. Я завернул Stack виджет в a SingleChildScrollView , но проблема все еще сохраняется. Если я оберну виджет стека с помощью a Containter и дам height: MediaQuery.of(context).size.height, ему возможность прокрутки, но я все равно не смогу увидеть все содержимое страницы. Где моя ошибка, вот что мне интересно? С помощью какого виджета я должен обернуть стек или есть лучший способ решить мою проблему? Короче говоря, я укладываю a Column поверх an Image , и мне нужно, чтобы весь Stack виджет был прокручиваемым, чтобы я мог видеть все содержимое виджета стека. Вот код:

 Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.grey,
      body: SafeArea(
        child: SingleChildScrollView(
          child: Stack(
            overflow: Overflow.visible,
            children: [
              Image.asset(
                'lib/modules/common/images/logo.png',
                width: double.infinity,
                height: 196.0,
              ),
              Positioned(
                width: MediaQuery.of(context).size.width,
                height: MediaQuery.of(context).size.height,
                top: 136.0,
                child: Column(
                  children: [
                    Container(), // some content inside the container
                    Container(), // // some content inside the container
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
 

Заранее спасибо за помощь!

если вы хотите иметь изображение на задней панели и прокручиваемый контент на передней панели, проверьте этот ответ, если нет, дайте мне знать и поделитесь прототипом/изображением, которое вы хотите.

 

  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.grey,
      body: SafeArea(
        child: SingleChildScrollView(
          child: SizedBox(
            width: MediaQuery.of(context).size.width,
            height: MediaQuery.of(context).size.height * 3,
            child: Stack(
              fit: StackFit.loose,
              children: [
                Align(
                  alignment: Alignment.topCenter,
                  child: Image.asset(
                    'assets/image.jpg',
                    width: double.infinity,
                    height: 196.0,
                  ),
                ),
                Positioned(
                  top: 136.0,
                  child: SizedBox(
                    width: MediaQuery.of(context).size.width,
                    height: MediaQuery.of(context).size.height,
                    child: Column(
                      mainAxisSize: MainAxisSize.min,
                      children: List.generate(
                        2,
                        (index) => Container(
                          height: 100,
                          width: double.infinity,
                          color: index % 2 == 0
                              ? Colors.amberAccent
                              : Colors.cyanAccent,
                        ), // some content inside the container
                        // some content inside the container
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }