Flutter - фиксированный виджет SingleChildScrollView - PullRequest
Новая
       36

Flutter - фиксированный виджет SingleChildScrollView

0 голосов
/ 16 января 2020

есть возможность иметь SingleChildScrollView в Scaffold, у которого есть другой виджет поверх SingleChildScrollView, который не нужно прокручивать. Например, у меня есть SingleChildScrollView, и мне нужно добавить фиксированную кнопку в указанную позицию, но эту кнопку не нужно прокручивать.

Я пытаюсь использовать виджет Stack, но если я добавляю виджет кнопки перед SingleChildScrollView это не может быть нажата в противном случае, если я добавляю кнопку после SingleChildScrollView, сенсор прокрутки не работает.

У кого-нибудь есть проблемы?

Ответы [ 2 ]

1 голос
/ 16 января 2020

Теперь, когда мы понимаем, чего вы хотите достичь, это можно сделать с помощью виджета Stack, ListView и использования виджета Align для позиционирования контейнера, в котором содержится виджет, который вы хотите использовать в качестве заголовка: 

Stack(
  children: <Widget>[
    ListView.builder(
      itemCount: 20,
      itemBuilder: (context, index) {
        return Container(
          child: Text('item $index'),
          height: 40,
          color: Colors.blueGrey,
          margin: EdgeInsets.all(14),
        );
      }
    ),
    Align(
      alignment: Alignment.topCenter,
      child: Container(
        margin: EdgeInsets.only(top: 20),
        alignment: Alignment.center,
        height: 30,
        width: 300,
        color: Colors.blue,
        child: Text('This is a title')
      ),
    ),
  ],
)

Предыдущие ответы, прежде чем окончательно понять, что хотел пользователь.

Если я правильно понял вашу проблему, и вы хотите, чтобы в представлении был фиксированный виджет сверху и список прокручиваемых элементов под ним, тогда CustomScrollView с SliverAppBar и SliverList будет решением для вас. Пожалуйста, см. Пример ниже: 

CustomScrollView(
  slivers: <Widget>[
    SliverAppBar(
      pinned: true,
      title: Center(child: Text('Title')),
    ),
    SliverList(
      delegate: SliverChildBuilderDelegate(
        (BuildContext context, int index) {
          return Container(
            height: 40,
            margin: EdgeInsets.all(10),
            alignment: Alignment.center,
            color: Colors.teal[100 * (index % 9)],
            child: Text('grid item $index'),
          );
        },
        childCount: 20
      ),
    ),
  ],
)

Если вы хотите, чтобы фиксированный виджет был в нижней части представления, вы можете использовать свойство bottomNavigationBar в Scaffold`: 

Scaffold(
  ...
  bottomNavigationBar: Container(
    alignment: Alignment.center,
    height: 50,
    child: Text('title')
  ),
)
0 голосов
/ 16 января 2020

Жоао большое спасибо, я делаю скрин своего приложения, чтобы объяснить вам мою проблему. Это мое приложение, и, как вы видите, «Мой LO GO» находится ниже панели приложения: enter image description here

Проблема в том, что мне нужно, чтобы мой Lo go был сложен под текстом "Это моя панель приложений"

...