flutter android 原生浮窗組件 android_window 介紹

倉庫地址:https://github.com/qiuxiang/flutter-android-window
pub 地址:https://pub.dartlang.org/packages/android_window

功能

  • 使用 android 原生接口實現(xiàn),可以讓 flutter app 覆蓋在其他 app 上面
  • 浮窗作為 android 前臺服務(wù)運行硬爆,可完全脫離主應(yīng)用
  • 默認(rèn)支持拖拽移動浮窗,且可以與 flutter 手勢共存
  • 提供浮窗大小牵舱、位置控制接口
  • 提供主應(yīng)用與浮窗應(yīng)用相互通信接口

安裝與配置

flutter pub add android_window

修改 MainActivity.ktMainActivity 繼承 qiuxiang.android_window.AndroidWindowActivity

class MainActivity : qiuxiang.android_window.AndroidWindowActivity()

創(chuàng)建 MainApplication.kt

package your_package // 和 MainActivity.kt 保持一致即可

class MainApplication : qiuxiang.android_window.AndroidWindowApplication()

修改 AndroidManifest.xml<application> 新增屬性 android:name=".MainApplication"

<application
  android:name=".MainApplication"
  ...
>

用法

main.dart:

import 'package:android_window/main.dart' as android_window;
import 'package:flutter/material.dart';

import 'android_window.dart';

@pragma('vm:entry-point')
void androidWindow() {
  runApp(const AndroidWindowApp());
}

void main() {
  runApp(const App());
}

class App extends StatelessWidget {
  const App({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(title: 'Flutter Demo', home: HomePage());
  }
}

class HomePage extends StatelessWidget {
  const HomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      floatingActionButton: FloatingActionButton(
        onPressed: () => android_window.open(size: const Size(300, 200)),
        child: const Icon(Icons.add),
      ),
    );
  }
}

我們需要用 @pragma('vm:entry-point') 聲明一個入口函數(shù)震捣,默認(rèn)函數(shù)名是 androidWindow缘挽,當(dāng)然你可以隨意指定一個胞四,只是調(diào)用 open 的時候需要同時指定參數(shù) entryPoint:井赌。

android_window.dart:

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

class AndroidWindowApp extends StatelessWidget {
  const AndroidWindowApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      home: HomePage(),
      debugShowCheckedModeBanner: false,
    );
  }
}

class HomePage extends StatelessWidget {
  const HomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return AndroidWindow(
      child: Scaffold(
        backgroundColor: Colors.lightGreen.withOpacity(0.9),
        body: const Padding(
          padding: EdgeInsets.all(8),
          child: Text('Hello android window'),
        ),
      ),
    );
  }
}

浮窗 app 的寫法就和我們平時寫的 app 沒什么區(qū)別了蜀细,如果需要支持窗口拖拽移動舟铜,則要在最外層使用 AndroidWindow

最終效果:

image

更完整的示例請參考:https://github.com/qiuxiang/flutter-android-window/tree/main/example

浮窗與主應(yīng)用的通信

主應(yīng)用和浮窗都有 postsetHandler 方法用于發(fā)送消息以及設(shè)置監(jiān)聽處理函數(shù)奠衔。用法舉例:

主應(yīng)用發(fā)送消息到浮窗:

final response = await android_window.post('message_name', 'data');

浮窗監(jiān)聽并處理主應(yīng)用消息:

AndroidWindow.setHandler((name, data) async {
  switch(name) {
    case 'bar':
      return 'data';
  }
});

反過來同理谆刨。

聊聊這個庫的一些實現(xiàn)細(xì)節(jié)

  • 核心功能參考了官方文檔 Adding a Flutter View to an Android app
  • 為了讓主應(yīng)用與浮窗進(jìn)行通信归斤,需要自定義 Application痊夭,并存儲兩個互通的 channel。
  • 這個庫并沒有直接用 MethodChannel脏里,而是實驗性地用了 pigeon她我,總的來說,MethodChannel 更靈活高效,而 pigeon 更規(guī)范且類型安全番舆,之后我應(yīng)該都會考慮用 pigeon 而不是 MethodChannel酝碳。
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市恨狈,隨后出現(xiàn)的幾起案子疏哗,更是在濱河造成了極大的恐慌,老刑警劉巖禾怠,帶你破解...
    沈念sama閱讀 221,548評論 6 515
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件返奉,死亡現(xiàn)場離奇詭異,居然都是意外死亡吗氏,警方通過查閱死者的電腦和手機(jī)芽偏,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,497評論 3 399
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來牲证,“玉大人哮针,你說我怎么就攤上這事√古郏” “怎么了十厢?”我有些...
    開封第一講書人閱讀 167,990評論 0 360
  • 文/不壞的土叔 我叫張陵,是天一觀的道長捂齐。 經(jīng)常有香客問我蛮放,道長,這世上最難降的妖魔是什么奠宜? 我笑而不...
    開封第一講書人閱讀 59,618評論 1 296
  • 正文 為了忘掉前任包颁,我火速辦了婚禮,結(jié)果婚禮上压真,老公的妹妹穿的比我還像新娘娩嚼。我一直安慰自己,他們只是感情好滴肿,可當(dāng)我...
    茶點故事閱讀 68,618評論 6 397
  • 文/花漫 我一把揭開白布岳悟。 她就那樣靜靜地躺著,像睡著了一般泼差。 火紅的嫁衣襯著肌膚如雪贵少。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 52,246評論 1 308
  • 那天堆缘,我揣著相機(jī)與錄音滔灶,去河邊找鬼。 笑死吼肥,一個胖子當(dāng)著我的面吹牛录平,可吹牛的內(nèi)容都是我干的麻车。 我是一名探鬼主播,決...
    沈念sama閱讀 40,819評論 3 421
  • 文/蒼蘭香墨 我猛地睜開眼萄涯,長吁一口氣:“原來是場噩夢啊……” “哼绪氛!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起涝影,我...
    開封第一講書人閱讀 39,725評論 0 276
  • 序言:老撾萬榮一對情侶失蹤枣察,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后燃逻,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體序目,經(jīng)...
    沈念sama閱讀 46,268評論 1 320
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,356評論 3 340
  • 正文 我和宋清朗相戀三年伯襟,在試婚紗的時候發(fā)現(xiàn)自己被綠了猿涨。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 40,488評論 1 352
  • 序言:一個原本活蹦亂跳的男人離奇死亡姆怪,死狀恐怖叛赚,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情稽揭,我是刑警寧澤俺附,帶...
    沈念sama閱讀 36,181評論 5 350
  • 正文 年R本政府宣布,位于F島的核電站溪掀,受9級特大地震影響事镣,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜揪胃,卻給世界環(huán)境...
    茶點故事閱讀 41,862評論 3 333
  • 文/蒙蒙 一璃哟、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧喊递,春花似錦随闪、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,331評論 0 24
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至调鲸,卻和暖如春盛杰,著一層夾襖步出監(jiān)牢的瞬間挽荡,已是汗流浹背藐石。 一陣腳步聲響...
    開封第一講書人閱讀 33,445評論 1 272
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機(jī)就差點兒被人妖公主榨干…… 1. 我叫王不留定拟,地道東北人于微。 一個月前我還...
    沈念sama閱讀 48,897評論 3 376
  • 正文 我出身青樓逗嫡,卻偏偏與公主長得像,于是被迫代替她去往敵國和親株依。 傳聞我的和親對象是個殘疾皇子驱证,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 45,500評論 2 359

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