前言 :
各位同学大家好 有段时间没有给大家更文章了 ,在安卓和IOS 我们常用接口回调来进行界面和方法调用的时候进行通信,写法也比较直接明了 今天我们就分享flutter里面怎么使用 。
准备工作:
需要安装flutter的开发环境:大家可以去看看之前的教程:
1 win系统flutter开发环境安装教程: //www.greatytc.com/p/152447bc8718
2 mac系统flutter开发环境安装教程://www.greatytc.com/p/bad2c35b41e3
效果图:
具体实现:
我们从日志里面可以看到我们点击listview里面item就是在回调方法里面把下标和item里面 text显示内容打印出来的 :
import 'package:flutter/material.dart';
typedef _CallBack = void Function(int selectIndex, String selectStr);
class TextList extends StatefulWidget {
final List dataArr;
final _CallBack callback;
TextList({Key key, this.dataArr,this.callback }) : super(key: key);
@override
_TextListState createState() {
return _TextListState();
}
}
class _TextListState extends State<TextList> {
@override
void initState() {
super.initState();
}
@override
void dispose() {
super.dispose();
}
@override
Widget build(BuildContext context) {
// TODO: implement build
return Scaffold(
appBar: AppBar(
title: Text("接口回调列表 "),
),
body: ListView.builder(
itemCount: widget.dataArr.length,
itemBuilder: (BuildContext context, int position){
return _itemWidget(context, position);
},
),
);
}
Widget _itemWidget(BuildContext context, int index){
return GestureDetector(
child: Center(
child:Padding(
padding: EdgeInsets.fromLTRB(0, 10, 0, 10),
child: Text(widget.dataArr[index]),
)
),
onTap: (){
if(widget.callback!=null){
widget.callback(index,widget.dataArr[index]);
}
},
);
}
}
我们在TextList 类中定义 dataArr 数组 和 callback 方法要在TextList 实例化的从构造方法传入
final List dataArr;
final _CallBack callback;
然后定义一个全局CallBack接口属性 :
typedef _CallBack = void Function(int selectIndex, String selectStr);
在listview item 点击事件ontap方法中 调用 :
onTap: (){
if(widget.callback!=null){
widget.callback(index,widget.dataArr[index]);
}
},
TextList 具体实例化调用:
@override
Widget build(BuildContext context) {
// TODO: implement build
return TextList(
dataArr: datalist,
callback: (index, str){
print("indexe ----- > "+index.toString());
print("str---- > "+str);
},
);
}
假数据:
List datalist= new List();
@override
void initState() {
super.initState();
for(var i=0 ; i<20 ;i++){
datalist.add("第几$i条数据");
}
}
完整homepage 代码:
import 'package:flutter/material.dart';
import 'text_list.dart';
/**
* 创建人:xuqing
* 创建时间:2020年12月7日10:03:31
* 类是说明:data 接口回调测试类
*
*/
class HomePage extends StatefulWidget {
HomePage({Key key}) : super(key: key);
@override
_HomePageState createState() {
return _HomePageState();
}
}
class _HomePageState extends State<HomePage> {
List datalist= new List();
@override
void initState() {
super.initState();
for(var i=0 ; i<20 ;i++){
datalist.add("第几$i条数据");
}
}
@override
void dispose() {
super.dispose();
}
@override
Widget build(BuildContext context) {
// TODO: implement build
return TextList(
dataArr: datalist,
callback: (index, str){
print("indexe ----- > "+index.toString());
print("str---- > "+str);
},
);
}
}
到此flutter的接口回调就讲完了:
最后总结:
flutter的接口回调和java 还是很类似 只有flutter 中没有用 interface这个关键字来定义 转而用了 typedef 属性来处理 我们需要注意一下 ,这篇文章只是简单讲解写 还有很多其他更加灵活的用户我这边就不展开讲了 同学们有兴趣可以字私下研究, 最后希望我的文章能帮助到各位解决问题 ,以后我还会贡献更多有用的代码分享给大家。各位同学如果觉得文章还不错 ,麻烦给关注和star,小弟在这里谢过啦