2020-03-20flutter 交互通信

把這幾天了解學(xué)習(xí)的知識(shí)匯總了一下,掌握flutter以下幾種方式即可應(yīng)對(duì)各種場(chǎng)景了厂镇。


一纤壁、監(jiān)聽回調(diào)

場(chǎng)景,A頁(yè)面實(shí)現(xiàn)回調(diào)方法并綁定自定義抽象類捺信,在B頁(yè)面觸發(fā)回調(diào)A頁(yè)面的回調(diào)方法酌媒。

import 'package:flutter/material.dart';

import 'package:scoped_model/scoped_model.dart';

void main() {

? runApp(new RootLayout());

}

class RootLayout extends StatefulWidget {

? @override

? State<StatefulWidget> createState() {

? ? return new RootLayoutM();

? }

}

class RootLayoutM extends State<RootLayout> implements OnDialogClickListener {

? String str = "show simple dialog";

? String showMsg = "show simple dialog";

? @override

? void onOk() {

? ? print('onOK');

? ? setState(() {

? ? ? showMsg = str + " onOK Click";

? ? });

? }

? @override

? void onCancel() {

? ? print('onCancel');

? ? setState(() {

? ? ? showMsg = str + " onCancel Click";

? ? });

? }

? @override

? Widget build(BuildContext context) {

? ? return new MaterialApp(

? ? ? ? home: new Scaffold(

? ? ? body: new Center(

? ? ? ? child:

? ? ? ? ? ? new Text(showMsg, style: new TextStyle(color: Color(0xFF00FF00))),

? ? ? ),

? ? ? floatingActionButton: new MyFloat(this),

? ? ));

? }

}

//定義一個(gè)抽象類

abstract class OnDialogClickListener {

? void onOk();

? void onCancel();

}

class MyFloat extends StatelessWidget {

? final OnDialogClickListener callback;

? MyFloat(this.callback);

? _showMyMaterialDialog(BuildContext context) {

? ? print("_showMyMaterialDialog");

? ? showDialog(

? ? ? ? context: context,

? ? ? ? builder: (context) {

? ? ? ? ? return new AlertDialog(

? ? ? ? ? ? title: new Text("title"),

? ? ? ? ? ? content: new Text("內(nèi)容內(nèi)容內(nèi)容內(nèi)容內(nèi)容內(nèi)容內(nèi)容內(nèi)容內(nèi)容內(nèi)容內(nèi)容"),

? ? ? ? ? ? actions: <Widget>[

? ? ? ? ? ? ? new FlatButton(

? ? ? ? ? ? ? ? onPressed: () {

? ? ? ? ? ? ? ? ? callback.onOk();

? ? ? ? ? ? ? ? ? Navigator.of(context).pop();

? ? ? ? ? ? ? ? },

? ? ? ? ? ? ? ? child: new Text("確認(rèn)"),

? ? ? ? ? ? ? ),

? ? ? ? ? ? ? new FlatButton(

? ? ? ? ? ? ? ? onPressed: () {

? ? ? ? ? ? ? ? ? callback.onCancel();

? ? ? ? ? ? ? ? ? Navigator.of(context).pop();

? ? ? ? ? ? ? ? },

? ? ? ? ? ? ? ? child: new Text("取消"),

? ? ? ? ? ? ? ),

? ? ? ? ? ? ],

? ? ? ? ? );

? ? ? ? });

? }

? @override

? Widget build(BuildContext context) {

? ? // TODO: implement build

? ? return new FloatingActionButton(

? ? ? ? child: new Text("showDialog"),

? ? ? ? onPressed: () {

? ? ? ? ? _showMyMaterialDialog(context);

? ? ? ? });

? }

}


二、父頁(yè)面調(diào)用子頁(yè)面

這里使用全局key>GlobalKey來調(diào)用子頁(yè)的方法或者公共屬性.全局key比較耗能。謹(jǐn)慎使用馍佑。GlobalKey每個(gè)globalkey都是一個(gè)在整個(gè)應(yīng)用內(nèi)唯一的key斋否。globalkey相對(duì)而言是比較昂貴的,如果你并不需要globalkey的某些特性拭荤,那么可以考慮使用Key茵臭、ValueKey、ObjectKey或UniqueKey舅世。

注意:該場(chǎng)景是全局key旦委,意思可以在任意地方使用。

用法:1.在即將被調(diào)用的頁(yè)面聲明接收構(gòu)造方法,接收參數(shù)Globalkey。

????????????2.在使用的頁(yè)面芋簿,new一個(gè)有即將被調(diào)用頁(yè)面狀態(tài)的Globalkey,在生成被調(diào)用頁(yè)面時(shí)傳入這個(gè)globalkey,即可在使用頁(yè)面隨意調(diào)用被調(diào)用頁(yè)的公共屬性查辩、方法!

其它key擴(kuò)展网持,參考

ValueKey:以一個(gè)值為key宜岛。

????????ObjectKey:以一個(gè)對(duì)象為key。

????????UniqueKey:生成唯一的隨機(jī)數(shù)作為key功舀。

????????PageStorageKey:專用于存儲(chǔ)頁(yè)面滾動(dòng)位置的key萍倡。


父頁(yè)面.

class ParentScreen extends StatefulWidget {

? ? @override

? ? _ParentScreenState createState() => _ParentScreenState();

}

class _ParentScreenState extends State<ParentScreen> {

GlobalKey<_ChildScreenState> childKey = GlobalKey();

? ? @override

? ? Widget build(BuildContext context) {

? ? ? ? return Column(

? ? ? ? ? ? children: <Widget>[

? ? ? ? ? ? ? ? ChildScreen(

? ? ? ? ? ? ? ? ? ? key: childKey

? ? ? ? ? ? ? ? ),

? ? ? ? ? ? ? ? RaisedButton(

? ? ? ? ? ? ? ? ? ? onPressed: (){

? ? ? ? ? ? ? ? ? ? ? ? childKey.currentState.childFunction();

? ? ? ? ? ? ? ? ? ? },

? ? ? ? ? ? ? ? ? ? child: Text('點(diǎn)擊我調(diào)用子組件方法'),

? ? ? ? ? ? ? ? )

? ? ? ? ? ? ],

? ? ? ? );

? ? }

}

子頁(yè)面.

class ChildScreen extends StatefulWidget {

? ? ChildScreen({

? ? ? ? Key key,

? ? }) : super(key: key);

? ? @override

? ? _ChildScreenState createState() => _ChildScreenState();

}

class _ChildScreenState extends State<ChildScreen> {

? ? @override

? ? Widget build(BuildContext context) {

? ? ? ? return Container(


? ? ? ? );

? ? }

? ? childFunction(){

? ? ? ? print('this is a childFunction');

? ? }

}


三、數(shù)據(jù)監(jiān)聽

ValueListenableBuilder,監(jiān)聽數(shù)據(jù)變化(單個(gè)數(shù)值或者對(duì)象)辟汰,比較適合組件的局部刷新列敲。

使用場(chǎng)景,A頁(yè)面點(diǎn)擊item后刷新復(fù)選框帖汞,復(fù)選按鈕等戴而。還有收藏一件商品刷新購(gòu)物車的右上角的件數(shù)。

也有人弄成多個(gè)地方的刷新翩蘸,但個(gè)人覺得不適合填硕,如果多地方還是考慮使用setstate,不能本末倒置鹿鳖,還是應(yīng)該恰到好處。

class MyHomePage extends StatefulWidget {

? MyHomePage({Key key, this.title}) : super(key: key);

? final String title;

? @override

? _MyHomePageState createState() => _MyHomePageState();

}

class _MyHomePageState extends State<MyHomePage> {

? final ValueNotifier<int> _counter = ValueNotifier<int>(0);

? final Widget goodJob = const Text('Good job!');

? @override

? Widget build(BuildContext context) {

? ? return Scaffold(

? ? ? appBar: AppBar(

? ? ? ? title: Text(widget.title)

? ? ? ),

? ? ? body: Center(

? ? ? ? child: Column(

? ? ? ? ? mainAxisAlignment: MainAxisAlignment.center,

? ? ? ? ? children: <Widget>[

? ? ? ? ? ? Text('You have pushed the button this many times:'),

? ? ? ? ? ? ValueListenableBuilder(

? ? ? ? ? ? ? builder: (BuildContext context, int value, Widget child) {

? ? ? ? ? ? ? ? // This builder will only get called when the _counter

? ? ? ? ? ? ? ? // is updated.

? ? ? ? ? ? ? ? return Row(

? ? ? ? ? ? ? ? ? mainAxisAlignment: MainAxisAlignment.spaceEvenly,

? ? ? ? ? ? ? ? ? children: <Widget>[

? ? ? ? ? ? ? ? ? ? Text('$value'),

? ? ? ? ? ? ? ? ? ? child,

? ? ? ? ? ? ? ? ? ],

? ? ? ? ? ? ? ? );

? ? ? ? ? ? ? },

? ? ? ? ? ? ? valueListenable: _counter,

? ? ? ? ? ? ? // The child parameter is most helpful if the child is

? ? ? ? ? ? ? // expensive to build and does not depend on the value from

? ? ? ? ? ? ? // the notifier.

? ? ? ? ? ? ? child: goodJob,

? ? ? ? ? ? )

? ? ? ? ? ],

? ? ? ? ),

? ? ? ),

? ? ? floatingActionButton: FloatingActionButton(

? ? ? ? child: Icon(Icons.plus_one),

? ? ? ? onPressed: () => _counter.value += 1,

? ? ? ),

? ? );

? }

}

四壮莹、正常傳參


場(chǎng)景翅帜,A頁(yè)面?zhèn)髦到oB頁(yè)面,B頁(yè)面返回?cái)?shù)值命满。例如涝滴,選擇日期,返回選中值

這類比較普通就放最后了

如果單純A傳B,只需要在A頁(yè)面構(gòu)造函數(shù)中聲明參數(shù)歼疮,q

且:

Navigator.push(context, new MaterialPageRoute<void> (

? ? ? ? return A(name:xxx);

));

如果需要B返回值杂抽,既可以

await Navigator.pushNamed(context,'/router/文件名').then((value){print(value);// --> abc});



目前大致就是A\B頁(yè)面之間的通信問題,如果還有其它的方法再做總結(jié)歸納韩脏。謝謝各位看官

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末缩麸,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子赡矢,更是在濱河造成了極大的恐慌杭朱,老刑警劉巖,帶你破解...
    沈念sama閱讀 221,273評(píng)論 6 515
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件吹散,死亡現(xiàn)場(chǎng)離奇詭異弧械,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)空民,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,349評(píng)論 3 398
  • 文/潘曉璐 我一進(jìn)店門刃唐,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人界轩,你說我怎么就攤上這事画饥。” “怎么了耸棒?”我有些...
    開封第一講書人閱讀 167,709評(píng)論 0 360
  • 文/不壞的土叔 我叫張陵荒澡,是天一觀的道長(zhǎng)。 經(jīng)常有香客問我与殃,道長(zhǎng)单山,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 59,520評(píng)論 1 296
  • 正文 為了忘掉前任幅疼,我火速辦了婚禮米奸,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘爽篷。我一直安慰自己悴晰,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 68,515評(píng)論 6 397
  • 文/花漫 我一把揭開白布逐工。 她就那樣靜靜地躺著铡溪,像睡著了一般。 火紅的嫁衣襯著肌膚如雪泪喊。 梳的紋絲不亂的頭發(fā)上棕硫,一...
    開封第一講書人閱讀 52,158評(píng)論 1 308
  • 那天,我揣著相機(jī)與錄音袒啼,去河邊找鬼哈扮。 笑死纬纪,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的滑肉。 我是一名探鬼主播包各,決...
    沈念sama閱讀 40,755評(píng)論 3 421
  • 文/蒼蘭香墨 我猛地睜開眼,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼靶庙!你這毒婦竟也來了问畅?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,660評(píng)論 0 276
  • 序言:老撾萬榮一對(duì)情侶失蹤惶洲,失蹤者是張志新(化名)和其女友劉穎按声,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體恬吕,經(jīng)...
    沈念sama閱讀 46,203評(píng)論 1 319
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡签则,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,287評(píng)論 3 340
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了铐料。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片渐裂。...
    茶點(diǎn)故事閱讀 40,427評(píng)論 1 352
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖钠惩,靈堂內(nèi)的尸體忽然破棺而出柒凉,到底是詐尸還是另有隱情,我是刑警寧澤篓跛,帶...
    沈念sama閱讀 36,122評(píng)論 5 349
  • 正文 年R本政府宣布膝捞,位于F島的核電站,受9級(jí)特大地震影響愧沟,放射性物質(zhì)發(fā)生泄漏蔬咬。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,801評(píng)論 3 333
  • 文/蒙蒙 一沐寺、第九天 我趴在偏房一處隱蔽的房頂上張望林艘。 院中可真熱鬧,春花似錦混坞、人聲如沸狐援。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,272評(píng)論 0 23
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)啥酱。三九已至,卻和暖如春厨诸,著一層夾襖步出監(jiān)牢的瞬間懈涛,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,393評(píng)論 1 272
  • 我被黑心中介騙來泰國(guó)打工泳猬, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留批钠,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 48,808評(píng)論 3 376
  • 正文 我出身青樓得封,卻偏偏與公主長(zhǎng)得像埋心,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子忙上,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,440評(píng)論 2 359

推薦閱讀更多精彩內(nèi)容