Flutter多個頁面廣播通知傳值

xiaotianyi 發布于2019-05-23 16:23 / 823人閱讀

摘要：在第一頁添加一個通知監聽者，第三頁發送通知告知第一頁。在需要發送通知的頁面也繼續創建這個單例類，通過回調的方式傳遞值。

Flutter查閱了很多資料，暫時沒有發現類似Android/iOS的頁面廣播通知傳值，如有歡迎評論告知～

為何需要廣播通知傳值？

假如有一個需求是這樣的，導航有三個頁面，第一頁有一個按鈕跳到第二頁，第二頁有一個按鈕跳到第三頁，第三頁有個按鈕來改變第一頁的背景色。這時候就可以通過通知傳值的方式。在第一頁添加一個通知監聽者，第三頁發送通知告知第一頁。

效果如下gif：

思路

我的思路是創建一個單例類，在你需要監聽的頁面創建這個監聽者。在需要發送通知的頁面也繼續創建這個單例類，通過回調的方式傳遞值。

代碼 創建一個單例類

typedef GetObject = Function(dynamic object);

class NotificationCenter {
  // 工廠模式
  factory NotificationCenter() => _getInstance();

  static NotificationCenter get instance => _getInstance();
  static NotificationCenter _instance;

  NotificationCenter._internal() {
    // 初始化
  }

  static NotificationCenter _getInstance() {
    if (_instance == null) {
      _instance = new NotificationCenter._internal();
    }
    return _instance;
  }

  //創建Map來記錄名稱
  Map postNameMap = Map();

  GetObject getObject;

  //添加監聽者方法
  addObserver(String postName, object(dynamic object)) {

    postNameMap[postName] = null;
    getObject = object;
  }

  //發送通知傳值
  postNotification(String postName, dynamic object) {
    //檢索Map是否含有postName
    if (postNameMap.containsKey(postName)) {

      postNameMap[postName] = object;
      getObject(postNameMap[postName]);
    }

  }
}

在首頁添加一個監聽

//添加監聽者
NotificationCenter.instance.addObserver("changColor", (object){

  setState(() {

    backColor = object;
  });
});

在第三頁發送通知

//通知將第一頁背景色變成紅色
NotificationCenter.instance.postNotification("changColor", Colors.red);

最后

代碼可能寫的不好，只是提供一個自己的想法。

GPU云服務器云服務器頁面間傳值頁面之間傳值 jsp頁面傳值 js頁面傳值

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/7203.html

加推Weex實踐之路（上）

摘要：我們參考小程序的設計思路進行了優化升級，為每一個需要特有化配置的頁面添加一個格式的配置文件，配置文件包括導航欄的配置頁面級別的配置跳轉的配置等，將配置工程化標準化。設置導航欄按鈕包含按鈕樣式的數組通過完成按鈕事件的回調。一、背景1.為什么是Weex在公司快速發展的大環境下，App的更新迭代高速、高頻，技術團隊平均兩周便可誕生一款中型App，但App團隊只有6個人（iOS 、Android各3...

shuibo 2019-05-22 19:43 評論0 收藏0
跨平臺技術演進

摘要：接下來，我將從原理優缺點等方面為大家分享跨平臺技術演進。小程序年是微信小程序飛速發展的一年，年，各大廠商快速跟進，已經有了很大的影響力。下面，我們以微信小程序為例，分析小程序的技術架構。前言大家好，我是simbawu ，@BooheeFE Team Leader，關于這篇文章，有問題歡迎來這里討論。隨著移動互聯網的普及和快速發展，手機成了互聯網行業最大的流量分發入口。以及隨著5G...

魏憲會 2019-08-30 15:43 評論0 收藏0
跨平臺技術演進

摘要：接下來，我將從原理優缺點等方面為大家分享跨平臺技術演進。小程序年是微信小程序飛速發展的一年，年，各大廠商快速跟進，已經有了很大的影響力。下面，我們以微信小程序為例，分析小程序的技術架構。前言大家好，我是simbawu ，@BooheeFE Team Leader，關于這篇文章，有問題歡迎來這里討論。隨著移動互聯網的普及和快速發展，手機成了互聯網行業最大的流量分發入口。以及隨著5G...

MasonEast 2019-08-26 13:39 評論0 收藏0