текущий способ использования списка в флаттере для прокрутки с расширенным или гибким - PullRequest
1 голос
/ 20 апреля 2020

мой экран не прокручивается, и имеет предельную высоту (только прокручиваемую в предельной высоте). Я хочу сделать свою страницу там для прокрутки, вот моя текущая страница сейчас:

my page not scrollable

Если вы видите в GIF выше, моя страница не прокручивается и застревает только в одном поле и прокручивается внутри, я люблю прокручивать их в обычном режиме для всех страниц, если я буду использовать ListView здесь ?? а как сделать пи c и текст для отзывчивости как выше? но я делаю высоту текста слишком близкой, могу ли я узнать, как вы уменьшаете размер текста в списке ??

вот мой код для этой ссылки Виджет

Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(
          data['title'],
          softWrap: true,
        ),
      ),
      body: Container(
        padding: EdgeInsets.all(MediaQuery.of(context).size.width * 0.05),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.spaceAround,
          children: <Widget>[
            Expanded(
              flex: 1,
              child: Align(
                alignment: Alignment.center,
                child: Image.network('https://i.ibb.co/nrWqyMx/belgium.png'),
              )
            ),
            Expanded(
              flex: 2,
              child: Align(
                alignment: Alignment.topLeft,
                child: ListView.builder(
                  itemBuilder: (ctx, index) {
                    return Container(
                      height: MediaQuery.of(context).size.width * 0.14,
                      child: ListTile(
                        leading: Icon(Icons.radio_button_checked, size: 17),
                        title: Text(data['ingredients'][index], style: TextStyle(height: 1.3),),
                      )
                    );
                  },
                  itemCount: data['ingredients'].length,
                ),
              )
            )
          ],
        ),
      ),
    );
  }

: кодовая ручка флаттера

Ответы [ 2 ]

1 голос
/ 20 апреля 2020
Scaffold(
      appBar: AppBar(
        title: Text(
          'MyAppBar',
          style:
          TextStyle(color: Colors.cyan[100], fontWeight: FontWeight.bold),
        ),
      ),
      body: ListView(
          children: <Widget>[
            Container(
              child: Image.network
                ('https://i.ibb.co/nrWqyMx/belgium.png'),
            ),
            ListView.builder(
              physics: ScrollPhysics(),
              shrinkWrap: true,
              itemBuilder: (ctx, index) {
                return Container(
                    height: MediaQuery.of(context).size.width * 0.14,
                    child: ListTile(
                      leading: Icon(Icons.radio_button_checked, size: 17),
                      title: Text("data['ingredients'][index]", style: TextStyle(height: 1.3),),
                    )
                );
              },
              itemCount:25,
            )
          ],
      ),
    );
0 голосов
/ 20 апреля 2020

Вам нужно будет поместить ScrollView в качестве основного контейнера вашего виджета. Как то так:

@override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Container(
        color: Colors.red,
        child: SingleChildScrollView(
          child: Column(
            children: [
              Text("Title"),
              ListView.builder(
                shrinkWrap: true,
                itemCount: 3,
                itemBuilder: (context, index) {
                  return Container(
                    height: 300,
                    width: double.infinity,
                    decoration: BoxDecoration(
                      color: Colors.blue,
                      border: Border.all(
                        color: Colors.black,
                        style: BorderStyle.solid
                      )
                    ),
                  );
                },
              )
            ],
          ),
        ),
      )
    );
  }
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...