flutter 上拉加载和下拉刷新

上拉加载
	1、定义ScrollController控制器
		ScrollController scroll=new ScrollController();
		
	2、使用控制器监听滚动事件
		scroll.addListener((){
	      if(scroll.position.pixels==scroll.position.maxScrollExtent){
	        			...
	        	第一个为当前滚动距离
	        	第二个为组件可滚动的最大距离
	      }
    	});
    	
   3、在ListView添加controller参数,并赋值控制器
   		controller: scroll,

   4、组件销毁的生命周期函数中销毁该方法,避免内存泄漏
   		
   		void dispose(){
			scroll.dispose();
		}
	
下拉刷新:
	1、将容器包裹在RefreshIndicator组件内
		RefreshIndicator(
		      onRefresh: xx,   触顶回调
		      child: 组件
		  );
		  
	2、设置onRefresh参数的回调函数
		返回类型和异步固定,设置后自带加载动图
		
		  Future xx() async{
					...
		  }
		  
	3、引入异步函数库
		import 'dart:async';

代码示例:
上拉加载:

import 'package:flutter/material.dart';
import 'txl/textItem-wl.dart';
import 'txl/txlHeader.dart';
import 'package:flutter/rendering.dart';
class Txl extends StatefulWidget {


  @override
  _AppsState createState() => _AppsState();
}

class _AppsState extends State<Txl> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar:AppBar(
        centerTitle: true,
        title: Text('通讯录'),
        actions: <Widget>[
          Padding(
            padding: EdgeInsets.only(right: 10),
            child:Icon(Icons.person_add) ,
          )
        ]
      ),
      body: Home(),
    );
  }
}

class Home extends StatefulWidget {
  Home({Key key}) : super(key: key);

  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
	
	//定义控制器
  ScrollController scroll=new ScrollController();
  
  @override
  void initState() {
    // TODO: implement initState
    super.initState();
 		
 	//监听控制器   
    scroll.addListener((){
     if(scroll.position.pixels==scroll.position.maxScrollExtent){
        print("到底了");
      }
    });

  }


  @override
  Widget build(BuildContext context) {
    return Container(
       child: Container(
       
        child: ListView(
        //设置控制器
          controller: scroll,
          children: <Widget>[
			,,,

        
         ],
       ),
      ),
    );
  }


下拉刷新:

import 'package:flutter/material.dart';
import 'dart:async';

class Fx extends StatefulWidget {


  @override
  _AppsState createState() => _AppsState();
}

class _AppsState extends State<Fx> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar:AppBar(
        centerTitle: true,
        title: Text('发现'),
      ),
      body: Home()
    );
  }
}

class Home extends StatefulWidget {
  Home({Key key}) : super(key: key);

  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {

	//下拉刷新回调
  Future<void> refresh() async{
    print('下拉刷新');
  }

  @override
  Widget build(BuildContext context) {
  	
  	//触发下拉刷新的组件
    return RefreshIndicator(
      onRefresh: refresh,
      child:  Container(
       child: ListView(
        //  controller: scroll,
         children: <Widget>[

          Text('bb',style: TextStyle(fontSize: 80),),
          Text('bb',style: TextStyle(fontSize: 80),),
          Text('bb',style: TextStyle(fontSize: 80),),
          Text('bb',style: TextStyle(fontSize: 80),),
          Text('bb',style: TextStyle(fontSize: 80),),
          Text('bb',style: TextStyle(fontSize: 80),),
          Text('bb',style: TextStyle(fontSize: 80),),
         ],
       ),
    ),
    );

  }
}

你可能感兴趣的:(flutter)