Flatter SingleChildScrollView не работает внутри стека - PullRequest
0 голосов
/ 09 марта 2020

Поэтому я пытаюсь создать экран со стеком с прокруткой и использую пакет AlignPositioned для выравнивания позиционированных виджетов в стеке. Я пытался использовать расширенные виджеты LayoutBuilders. Я просто не могу понять, как это сделать. Dynami c (https://pub.dev/packages/align_positioned) the UI

Внизу много названий городов, и экран можно прокрутить только до 1-2 из них в зависимости от высоты контейнера. Вот мой текущий код всякий раз, когда я устанавливаю постоянную высоту Контейнер, пользовательский интерфейс не выдает ошибку, но экран не полностью прокручивается

return SafeArea(
  child: Scaffold(
      body: SingleChildScrollView(
        child: Container(
          height: MediaQuery.of(context).size.height,
          child: Stack(
            children: <Widget>[
              Positioned(
                top: 0,
                child: TopArc(), // The blue background circle
              ),
              AlignPositioned(
                dy: 40,
                alignment: Alignment.topCenter,
                child: Padding(
                  padding: const EdgeInsets.symmetric(
                      horizontal: 16, vertical: 4),
                  child: AutoSizeText(
                    "Choose Your Location",
                    stepGranularity: 1,
                    maxLines: 1,
                    style: TextStyle(
                      fontSize: 38,
                      color: Colors.white,
                      // This is the maximum value then the AutoSizeText widget will shrink it until it can fit a single line.
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                ),
              ),
              AlignPositioned(
                dy: 90,
                alignment: Alignment.topCenter,
                child: StreamBuilder<QuerySnapshot>(
                  stream: Firestore.instance
                      .collection('locations')
                      .snapshots(),
                  builder: (context, snapshot) {
                    if (snapshot.hasError) {
                      return CircularProgressIndicator();
                    }
                    if (!snapshot.hasData) {
                      return CircularProgressIndicator();
                    }
                    return ContentTile(
                      child: ListView.builder(
                        physics: NeverScrollableScrollPhysics(),
                        shrinkWrap: true,
                        itemCount: snapshot.data.documents.length,
                        itemBuilder: (ctx, int i) {
                          final document = snapshot.data.documents[i];

                          return LocationExpansionTile(
                              document.documentID, document["cityName"]);
                        },
                      ),
                    );
                  },
                ),
              ),
            ],
          ),
        ),
      )),
);

1 Ответ

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

Замените ListView.builder на Column виджет и удалите все AlignedPositioned вместо использования Positioned (если это возможно). Удалите родительский контейнер стека и добавьте контейнер со значением высоты. Это поможет стеку рассчитать его размер. Вы должны получить окончательный размер из списка вашего товара. Так я мог заставить ваш код работать так, как вы хотите.

var _itemsView = GlobalKey();

double _stackHeight;

@override
void initState() {
  WidgetsBinding.instance.addPostFrameCallback((_) {
    RenderBox stackRB =
        _itemsView.currentContext.findRenderObject() as RenderBox;
    setState(() {
      _stackHeight = stackRB.size.height;
    });
  });
  super.initState();
}

@override
Widget build(BuildContext context) {
  return SafeArea(
    child: Scaffold(
        body: SingleChildScrollView(
      child: Stack(
        children: <Widget>[
          Positioned(
            ...
          ),
          Positioned(
            ...
          ),
          Positioned(
            key: _itemsView,
            top: 90,
            child: Column(
              children: _data.map((i) {
                  final document = snapshot.data.documents[i];
                  return LocationExpansionTile(
                      item.documentID, item["cityName"]);
                }),
            ),
          ),
          Container(
            height: _stackHeight + 90,
          )
        ],
      ),
    )),
  );
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...