CustomScrollView не обнаруживает прокрутку

Я новичок в трепетании и задаюсь вопросом, может ли кто-нибудь помочь мне с механикой свитка. Я пробуюSliverAppBarвпервые и правильно работает с движениями самой штанги. Однако у меня естьListView.builderкоторый создает виджеты, которые я поместил в оставшуюся полоску, и не обнаруживает движения списка. Любая помощь будет принята с благодарностью.

    return Scaffold(
      body: CustomScrollView(
        slivers: <Widget>[
          SliverAppBar(
            title: Row(
          children: <Widget>[
            Text('appName')],),
            expandedHeight: 110,
            floating: true,
            pinned: true,
            flexibleSpace: FlexibleSpaceBar(
              background: Container(
                child: Padding(
                  padding: const EdgeInsets.all(20.0),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    mainAxisAlignment: MainAxisAlignment.end,
                    children: <Widget>[
                      Text('my text 1', style: TextStyle(
                        fontFamily: 'OpenSans',
                      ),
                      softWrap: true,),
                      Text('my Text', style: TextStyle(
                        fontFamily: 'OpenSans',
                         ),),],),),),),),

          SliverFillRemaining(
            hasScrollBody: true,
            child: Container(
              child: NoteList(
                  items: items,
                ),
            ),
          )
        ],
      ),

Список заметок

class NoteList extends StatelessWidget {

  const NoteList({
    @required this.items, 
  });

  final List<Note> items;

  Future _navigateToNote(BuildContext context, Note note) => Navigator.push(
    context,
    MaterialPageRoute(builder: (context) => NoteScreen(note)),
  );

  Widget _itemBuilder(BuildContext context, int position) {
    final cardShape = const RoundedRectangleBorder(
      borderRadius: BorderRadius.all(Radius.circular(0)),
    );
    return Padding(
      padding: const EdgeInsets.only(top:0, bottom: 0),
      child: Card(
        shape: cardShape,
        child: InkWell(
          onTap: () => _navigateToNote(context, items[position]),
          customBorder: cardShape,
       child: Padding(
            padding: const EdgeInsets.all(2.0),
            child: Column(
              children: <Widget>[
                ListTile(
                  title: Text('${items[position].theItem}',             
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scrollbar(
      child: ListView.builder(
        itemCount: items.length,
        padding: const EdgeInsets.only(left: 2, right: 2),
        itemBuilder: _itemBuilder,
      ),
    );
  }
}

1 ответ

Решение

Ты используешь ListView внутри CustomScrollView. Оба прокручиваются, поэтому возникает конфликт.

Для решения проблемы замените ListView с участием SliverList - специальный виджет для отображения списка предметов внутри CustomScrollView.

SliverFillRemaining здесь не нужен, поэтому код будет:

Scaffold(
  body: CustomScrollView(
    slivers: [
      SliverAppBar(
        ...
      ),
      SliverList(
        delegate: SliverChildBuilderDelegate(
          (context, index) => Card(
            // any nested widgets
            child: ListTile(
              title: Text(items[index].name),
            ),
          ),
          childCount: items.length,
        ),
      ),
    ],
  ),
);
Другие вопросы по тегам