Flutter高階實戰 8 9 20 保持頁面狀態

2021-09-25 13:23:03 字數 1643 閱讀 5284

實現效果:

一、with 關鍵字的使用

with是dart的關鍵字,意思是混入的意思,就是說可以將乙個或者多個類的功能新增到自己的類無需繼承這些類, 避免多重繼承導致的問題。

比如下面的**:

class _keepalivedemostate extends statewith singletickerproviderstatemixin
需要注意的是with後邊是mixin,而不是普通的widget,這個初學者比較愛犯錯誤。需要強調一下。

二、tabbar widget的使用

tabbar是切換元件,它需要設定兩個屬性。

bottom:tabbar(

controller: _controller,

tabs:[

tab(icon:icon(icons.directions_car)),

tab(icon:icon(icons.directions_transit)),

tab(icon:icon(icons.directions_bike)),],)

三、基本頁面布局我們先把入口頁面布局好,下節課我們再讓他保持狀態。學了上面兩個知識,你其實可以做出來布局了。全部**如下:

import 'package:flutter/material.dart';

import 'keep_alive_demo.dart';

@override

widget build(buildcontext context)

}class keepalivedemo extends statefulwidget

class _keepalivedemostate extends statewith singletickerproviderstatemixin

//重寫被釋放的方法,只釋放tabcontroller

@override

void dispose()

@override

widget build(buildcontext context)

}

四、主介面中實現保持狀態的功能,新建keep_alive_demo.dart檔案**如下:

import 'package:flutter/material.dart';

class myhomepage extends statefulwidget

//混入automatickeepaliveclientmixin,這是保持狀態的關鍵

class _myhomepagestate extends statewith automatickeepaliveclientmixin);

} @override

widget build(buildcontext context)

}

Flutter從入門到高階實戰攜程網App 彙總貼

賈鵬輝的技術部落格官網 包管理的 掘金上放出來的 1 1 課程導學 1 2 專案需求分析,技術分解.2 1 本章作業 2 2 開發系統與工具選擇 2 3 flutter開發環境與ios開發環境設定 mac 2 4 android開發環境設定與flutter外掛程式安裝 mac 2 5 flutter...

Flutter入門到高階

從dart基礎語法開始,領略flutter之美,輕鬆全面的掌握flutter開發核心技術。通過本課程的學習,可以讓你的flutter技術能力和專案經驗都得到前所未有的提公升!課程具體收穫 可直接看章節描述 flutter必備dart基礎,flutter入門,ai語音,網路程式設計,資料儲存,非同步程...

Flutter實戰入門系列 1

flutter是google力推的進行跨平台開發應用的工具。本系列文章的敘述環境為mac os 10.14.5,android studio 3.4.1,xcode 10.2.1 本系列將介紹開發環境的搭建和建立第乙個flutter應用。假設我們已經安裝了android studio和xcode。我...