프로그래밍 방식으로 ListView 끝으로 스크롤

Question

항목 수가 동적으로 변경되는 스크롤 가능한 ListView이 있습니다. 새 항목이 목록 끝에 추가 될 때마다 프로그래밍 방식으로 ListView을 끝까지 스크롤하고 싶습니다. (예를 들면, 새 메시지가 마지막에 추가 할 수있는 채팅 메시지 목록과 같은)은

내 생각 엔 내 State 객체에 ScrollController를 만들고 ListView 생성자에 직접 전달해야합니다, 그래서 내가 할 수있는 것입니다 나중에 컨트롤러에서 animateTo()/jumpTo() 메서드를 호출하십시오. 그러나 최대 스크롤 오프셋을 쉽게 결정할 수 없으므로 scrollToEnd() 유형의 작업을 수행하는 것은 불가능합니다 (반면에 0.0을 전달하면 초기 위치로 스크롤 할 수 있습니다).

쉬운 방법이 있나요?

reverse: true을 사용하면 ListView 뷰포트 내에 들어갈 수있는 항목 수가 적을 때 항목을 맨 위에 정렬하고 싶기 때문에 완벽한 솔루션이 아닙니다.

Answer 1

ListView을 reverse: true과 함께 사용하는 경우 0.0으로 스크롤하면 원하는대로 처리됩니다.

import 'dart:collection'; 

import 'package:flutter/material.dart'; 

void main() { 
    runApp(new MyApp()); 
} 

class MyApp extends StatelessWidget { 
    @override 
    Widget build(BuildContext context) { 
    return new MaterialApp(
     title: 'Example', 
     home: new MyHomePage(), 
    ); 
    } 
} 

class MyHomePage extends StatefulWidget { 
    @override 
    _MyHomePageState createState() => new _MyHomePageState(); 
} 

class _MyHomePageState extends State<MyHomePage> { 
    List<Widget> _messages = <Widget>[new Text('hello'), new Text('world')]; 
    ScrollController _scrollController = new ScrollController(); 

    @override 
    Widget build(BuildContext context) { 
    return new Scaffold(
     body: new Center(
     child: new Container(
      decoration: new BoxDecoration(backgroundColor: Colors.blueGrey.shade100), 
      width: 100.0, 
      height: 100.0, 
      child: new Column(
      children: [ 
       new Flexible(
       child: new ListView(
        controller: _scrollController, 
        reverse: true, 
        shrinkWrap: true, 
        children: new UnmodifiableListView(_messages), 
       ), 
      ), 
      ], 
     ), 
     ), 
    ), 
     floatingActionButton: new FloatingActionButton(
     child: new Icon(Icons.add), 
     onPressed:() { 
      setState(() { 
      _messages.insert(0, new Text("message ${_messages.length}")); 
      }); 
      _scrollController.animateTo(
      0.0, 
      curve: Curves.easeOut, 
      duration: const Duration(milliseconds: 300), 
     ); 
     } 
    ), 
    ); 
    } 
}