Flutter:为什么我的 DraggableScrollableSheet 不会向上滑动?

问题描述 投票:0回答:1

我正在尝试创建一个股票摘要样式小部件。它应该在发生时一次显示一个新闻项目,但是用户可以打开 DraggableScrollableSheet 并滚动浏览所有新闻项目的较长列表。

我的第一部分正在工作(在事件进入时一次滚动浏览一个事件),但我无法向上滑动工作表以查看其他项目。

List<NewsEvent> newsList = [];

class NewsEvent {
  final int id;
  final String event;
  final String timestamp;
  final Icon icon;

  NewsEvent({
    required this.id,
    required this.event,
    required this.timestamp,
    required this.icon,
  });
}

class NewsHandler {

  ScrollController scrollController = ScrollController();

  Widget newsFeed() {

    return DraggableScrollableSheet(
      initialChildSize: 0.1,
      minChildSize: 0.1,
      maxChildSize: 0.66,
      snap: true,
      expand: true,
      builder: (context, ScrollController sheetScrollController) {
        return Container(
          decoration: BoxDecoration(
            borderRadius: const BorderRadius.only(
              topLeft: Radius.circular(12),
              topRight: Radius.circular(12),
            ),
            color: isLightMode ? colourOnPrimary : colourPrimaryLeastDark,
          ),
          child: Column(
            children: [
              Padding(
                padding: const EdgeInsets.all(4.0),
                //This container is for the 'handle' to indicate to the user that it can be pulled up
                child: Container( 
                  width: 50,
                  height: 3,
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(12),
                    color: Colors.grey,
                  ),
                ),
              ),
              Expanded(
                  child: ListView.builder(
                    physics: const ClampingScrollPhysics(),
                    controller: scrollController,
                    itemCount: newsList.length,
                    itemBuilder: (BuildContext context, int index) {
                      NewsEvent newsEvent = newsList[index];
                      TextStyle eventStyle = const TextStyle(fontSize: 16, color: Colors.black);
                      TextStyle timestampStyle = const TextStyle(fontSize: 12, fontStyle: FontStyle.italic, color: Colors.black);
                  
                      return Column(
                        children: [
                          const SizedBox(height: 5, width: 300, child: Divider(color: Color.fromARGB(123, 158, 158, 158))),
                          ListTile(
                            leading: newsEvent.icon, // News icon
                            title: Row(
                              children: [
                                Expanded(
                                  child: Text(newsEvent.event, style: eventStyle),
                                ),
                                Text(newsEvent.timestamp, style: timestampStyle),
                              ],
                            ),
                          ),
                          
                        ],
                      );
                      
                    },
                  ),
                ),
              //),
            ],
          ),
        );
      },
    );
  }
  //Call this to add a news item
  void addNews(String event, Icon icon) {
    String timestamp = DateFormat.jm().format(DateTime.now());
    newsList.add(NewsEvent(id: newsID, event: event, timestamp: timestamp, icon: icon));
    newsID++;

    MapPageState? mapPageState = mapPageKey.currentState;
    mapPageState?.mapPageSetState();
  }

  //Call this after adding a news item to scroll the list down.
  void scrollDown(){
    scrollController.animateTo(
      scrollController.position.maxScrollExtent,
      duration: const Duration(milliseconds: 500),
      curve: Curves.easeInOut,
    );
  }
}
android flutter dart gesture-recognition news-ticker
1个回答
0
投票
                padding: const EdgeInsets.all(4.0),
                //This container is for the 'handle' to indicate to the user that it can be pulled up
                child: Container( 
                  width: 50,
                  height: 3,
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(12),
                    color: Colors.grey,
                  ),
                ),
              ),

如果其他人正在为此苦苦挣扎,您需要用 singlechildscrollview 包装它并给它sheetscrollcontroller。

© www.soinside.com 2019 - 2024. All rights reserved.