首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Flutter: Android:如何创建不可移动的本地通知工具栏,上面有一些操作按钮,如截图所示

Flutter 是一种跨平台的移动应用开发框架,可以同时为 Android 和 iOS 平台开发应用程序。要创建一个不可移动的本地通知工具栏并添加一些操作按钮,可以使用 Flutter 提供的 flutter_local_notifications 插件。

以下是一些步骤可以实现这个功能:

  1. pubspec.yaml 文件中添加 flutter_local_notifications 插件的依赖:
代码语言:txt
复制
dependencies:
  flutter_local_notifications: ^5.3.0
  1. 运行 flutter pub get 命令来获取依赖包。
  2. 在需要使用通知工具栏的页面中导入相关库:
代码语言:txt
复制
import 'package:flutter_local_notifications/flutter_local_notifications.dart';
  1. 在页面的 initState() 方法中初始化通知插件:
代码语言:txt
复制
FlutterLocalNotificationsPlugin flutterLocalNotificationsPlugin =
    FlutterLocalNotificationsPlugin();

@override
void initState() {
  super.initState();

  var initializationSettingsAndroid =
      AndroidInitializationSettings('app_icon');
  var initializationSettings =
      InitializationSettings(android: initializationSettingsAndroid);

  flutterLocalNotificationsPlugin.initialize(initializationSettings);
}

这里的 'app_icon' 是应用程序中作为通知图标显示的图标资源。需要将该图标资源放置在 android/app/src/main/res/drawable 目录下。

  1. 创建一个方法来展示通知工具栏:
代码语言:txt
复制
Future<void> showNotificationToolbar() async {
  var androidPlatformChannelSpecifics = AndroidNotificationDetails(
    'channel_id',
    'channel_name',
    'channel_description',
    importance: Importance.defaultImportance,
    priority: Priority.defaultPriority,
    showProgress: false,
    ongoing: true,
    styleInformation: DefaultStyleInformation(true, true),
    channelAction: AndroidNotificationChannelAction.createIfNotExists,
    importance: Importance.max,
  );

  var platformChannelSpecifics =
      NotificationDetails(android: androidPlatformChannelSpecifics);

  await flutterLocalNotificationsPlugin.show(
    0,
    '通知标题',
    '通知内容',
    platformChannelSpecifics,
    payload: 'notification_payload',
  );
}

这里需要注意设置 ongoing: true 来确保通知工具栏不可移动。

  1. 在需要展示通知工具栏的地方调用 showNotificationToolbar() 方法:
代码语言:txt
复制
FlatButton(
  onPressed: () {
    showNotificationToolbar();
  },
  child: Text('展示通知工具栏'),
),

在按钮的 onPressed 回调函数中调用 showNotificationToolbar() 方法。

通过以上步骤,你可以创建一个不可移动的本地通知工具栏,上面有一些操作按钮。当用户点击按钮时,你可以通过相应的回调函数执行相应的操作。

腾讯云相关产品中,云函数 SCF 提供了可用于创建本地通知的后端服务。你可以使用 云函数 SCF 配合 flutter_local_notifications 插件来实现一个完整的解决方案。你可以了解更多关于 云函数 SCF 的信息和相关文档:云函数 SCF

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

使用 Android Studio 进行 Flutter 开发

本文将与你一起回顾如何Android Studio 里进行 Flutter 工具配置。 创建项目 你可以通过多种方式来创建新项目。 ?...⚠️ 关于设置公司域名 “在创建新应用时,一些 Flutter IDE 插件需要一个逆序域名,比如 com.example。...在主工具栏,可以运行和调试代码: ? IntelliJ 工具栏 选择目标设备 在 IDE 中打开 Flutter 项目时,你会在工具栏右侧看到一组 Flutter 特定按钮。...“如果 Run 和 Debug 按钮不可用且未显示目标设备,则意味着 Flutter 未发现任何已连接 iOS 、Android 设备或模拟器。你需要连接设备或启动模拟器才能继续。...确保选择和 Flutter 使用相匹配 Android SDK( flutter doctor 中所示)。 点击 OK。

6.3K30

如何使用 Flutter 创建桌面应用程序

如何使用 Flutter 创建桌面应用程序 介绍 开发人员可以选择编写多种类型应用程序:控制台应用程序、移动应用程序、Web 应用程序和桌面应用程序。...Flutter 设备命令屏幕截图 Flutter 设备命令屏幕截图 创建一个新 Flutter 应用 像任何其他典型 CLI 一样,我们可以使用create如下所示命令创建一个新应用程序:...TextPad 有一个大多行文本字段,我们可以在其中输入我们笔记。它还有一个操作按钮,可以将当前笔记保存到文件中。TextPad 屏幕截图如下所示。...示例应用程序屏幕截图 如上所述,右上角保存按钮会将当前笔记写入文本文件。保存文件后,TextPad 将显示有关任务完成通知消息。...Flutter 性能比 Electron 好,因为它不在 Web 浏览器执行应用程序 GUI 逻辑。 Flutter 确实给开发者带来了一些痛点。

4.5K20
  • 老司机带你快速上手调试Flutter项目

    下面就详细讲解一下如何使用Flutter调试工具。...Run控制台在工程创建时候是没有的,当我们运行项目的时候,Run控制台就会出现在底部菜单栏,如图所示: ?...这里面有几个工具,我简单描述一下每个工具作用: 首先我们看左边第一列4个工具作用,如图所示: ? 左边第一列4个工具作用 然后再看看第二列2个工具作用,如图所示: ?...具体功能如图2.6.3.1所示: ? 具体截图 这里主要讲一下上方并排7个工具功能,以及右边那个漏斗形状蓝色图标的作用。 图标 描述 添加一个Center组件。...将组件向上移动。 将组件向下移动。 移除组件。 点击它,就会只显示组件,再次点击就显示完整代码结构。

    3K30

    Flutter从配置安装到填坑指南详解

    在 Google I/O ’17 ,Google 向我们介绍了 Flutter —— 一款新用于创建移动应用开源库。 Flutter是什么呢?...(具体这里面有标记[X]那些项如何安装后文有详细讲解,这里简单提一下。) 这里面有四项内容: (1)Flutter 这是Flutter工具,就是刚才git下载那个。...screenshot 从一个连接设备截图。 stop 停止在附加设备Flutter应用。 test 对当前项目的Flutter单元测试。...后来我想是不是BITS传输服务未开启,于是我一顿操作虎,操作如下,打开BITS: 计算机 --> 右键 “管理” --> 服务和应用程序里面,点击“服务”,然后如下图所示:...有3点需要特别注意: 1) Flutter,这里面有4个工具,缺一不可Flutter本身安装包,Framework(这是flutter核心代码部分),Engine(flutter引擎

    8K50

    Flutter从配置安装到填坑指南详解

    在 Google I/O ’17 ,Google 向我们介绍了 Flutter —— 一款新用于创建移动应用开源库。 Flutter是什么呢?...(具体这里面有标记[X]那些项如何安装后文有详细讲解,这里简单提一下。) 这里面有四项内容: (1)Flutter 这是Flutter工具,就是刚才git下载那个。...screenshot 从一个连接设备截图。 stop 停止在附加设备Flutter应用。 test 对当前项目的Flutter单元测试。...后来我想是不是BITS传输服务未开启,于是我一顿操作虎,操作如下,打开BITS: 计算机 --> 右键 “管理” --> 服务和应用程序里面,点击“服务”,然后如下图所示: 然后选中图中标记这个...有3点需要特别注意Flutter,这里面有4个工具,缺一不可Flutter本身安装包,Framework(这是flutter核心代码部分),Engine(flutter引擎),Dart sdk

    3.6K40

    开发工具总结(10)之Flutter从配置安装到填坑指南详解

    ---- 在 Google I/O ’17 ,Google 向我们介绍了 Flutter —— 一款新用于创建移动应用开源库。...(具体这里面有标记[X]那些项如何安装后文有详细讲解,这里简单提一下。) 这里面有四项内容: (1)Flutter 这是Flutter工具,就是刚才git下载那个。...screenshot 从一个连接设备截图。 stop 停止在附加设备Flutter应用。 test 对当前项目的Flutter单元测试。...后来我想是不是BITS传输服务未开启,于是我一顿操作虎,操作如下,打开BITS: 计算机 --> 右键 “管理” --> 服务和应用程序里面,点击“服务”,然后如下图所示:...有3点需要特别注意Flutter,这里面有4个工具,缺一不可Flutter本身安装包,Framework(这是flutter核心代码部分),Engine(flutter引擎)

    1.9K10

    浅谈跨平台框架Flutter搭建与运行

    作者:个推iOS开发工程师 伊泽瑞尔 Flutter是Google推出跨平台解决方案,用以帮助开发者在 Android 和 iOS 两个平台开发高质量原生应用全新移动 UI 框架。... myapp),点击 Next; 点击 Finish; 等待Android Studio安装SDK并创建项目。...如果没有列出可用,请选择 Tools>Android>AVD Manager 创建; 在工具栏中点击 Run图标; 如果一切正常,在设备或模拟器上会看到启动应用程序 4.体验热重载:Flutter可以通过热重载实现快速开发周期...下面将分别介绍如何连接Android和iOS设备来运行flutter应用。...一、连接Android模拟器 在Android模拟器运行并测试Flutter应用,请按照以下步骤操作: 启动 Android Studio>Tools>Android>AVD Manager 并选择

    3.3K20

    浅谈跨平台框架 Flutter 搭建与运行

    [封面.png] 作者:个推iOS开发工程师 伊泽瑞尔 Flutter是Google推出跨平台解决方案,用以帮助开发者在 Android 和 iOS 两个平台开发高质量原生应用全新移动 UI 框架... myapp),点击 Next; 点击 Finish; 等待Android Studio安装SDK并创建项目。...如果没有列出可用,请选择 Tools>Android>AVD Manager 创建; 在工具栏中点击 Run图标; 如果一切正常,在设备或模拟器上会看到启动应用程序,如下图所示: [kny4ty1ip8...下面将分别介绍如何连接Android和iOS设备来运行flutter应用。...一、连接Android模拟器 在Android模拟器运行并测试Flutter应用,请按照以下步骤操作: 启动 Android Studio>Tools>Android>AVD Manager 并选择

    3.6K40

    吐血教程:搭建Flutter开发环境

    不要将Flutter安装到需要一些高权限路径,C:\Program Files\。...2)打开终端并运行一些命令,安装工具,用于将Flutter应用安装到iOS设备,命令如下所示: brew update brew install --HEAD libimobiledevice...登录界面如图1-18所示。 步骤5 当你第一次添加真机设备进行iOS开发时,需要设置同时信任你Mac和该设备开发证书。点击Trust按钮即可,如图1-19所示。...图1-23 设置包名界面 步骤4 点击Finish按钮开始创建第一个工程,等待几分钟,会创建如图1-24所示工程。...步骤5 工程创建好后,可以先运行一下官方创建示例,看一看运行效果,点击Open iOS Simulator打开iOS模拟器,具体操作如图1-25所示

    5.1K20

    Flutter 在鸿蒙系统跑起来

    鸿蒙系统 (HarmonyOS)是华为推出一款分布式操作系统,那么如何在保证开发迭代效率前提下,以相对低成本将移动应用快速移植到鸿蒙平台上呢?...由于鸿蒙业务开发语言仍然可用 Java,在很多基础概念Android 也有相似之处(如下表所示),我们可以从 Android 实现入手,完成对鸿蒙移植。 ?...这个流程大部分工作都由框架层和引擎层完成,对于鸿蒙适配,我们主要关注是与设备自身能力相关问题,即: (1)如何监听设备 VSync 信号并通知 Flutter 引擎?...抛开复杂注册及调用细节,本质整个流程主要做了三件事: 创建了一个视图对象,提供可用于直接绘制 Surface,将它通过 JNI 传递给原生侧; 在原生侧获取 Surface 关联本地窗口对象,并交给...以下是通过 DevEco Studio 运行官方 Flutter Gallery 应用截图截图Flutter 引擎已经使用鸿蒙系统平台能力进行了重写: ?

    2.5K41

    关于Flutter 2.5稳定版你知道多少?

    该版本进行了一些性能上改进:首先是一项用于从离线训练运行中连接 Metal 着色器预编译 PR (#25644),这将最坏情况下光栅化时间减少了 2/3 (如我们基准测试所示),将第 99 百分位帧时间减少了一半...如果你想让 Ctrl - A 做一些自定义操作,而不是选择所有文本,你可以自行定义。...如上图所示,你可以看到以下变化: 更好地传达调试切换按钮作用 —— 这些按钮有新图标、面向任务标签,以及丰富工具提示 (用于描述它们功能和何时使用它们)。...您可以通过「debug」按钮旁边工具栏按钮来访问这个信息: 覆盖率信息将以红色和绿色矩形显示在编辑窗口左侧空隙中。...在插件设置 / 偏好页面有一个新文本字段。 注意,这对定义为类中静态常量图标有效,屏幕截图示例代码所示

    3.7K20

    Flutter简介

    Flutter是Google开源移动应用框架,一套代码能完成跨平台(Android和IOS)移动应用开发,对于Flutter而言,其有以下特点: 现代响应式框架 高速2D渲染引擎 方便快捷开发工具...在Android Studio中新建一个Flutter项目并运行,运行完成后我们会发现在Android Studio右侧工具栏出现了Flutter Inspector选项,在该选项卡内,我们可以更深层级理解上面这段话...上图为Flutter Inspector中Widgets面板中内容(左侧为当前页面的截图),在这里我们可以看到页面上所有元素都是Widget。...Widget边界),同时也会在面板显示当前Widget属性信息,这里就印证了我们前面说Flutter中,几乎都是用Dart编写Widget组件,在界面发生变化时,我们可以通过图中刷新按钮,...Flutter应用目录结构 我们在Android studio或者cmd( 通过flutter create方式)创建Flutter应用一般会生成四个目录 android Android平台原生代码目录

    49310

    Flutter 开发实战与前景展望 - RTC Dev Meetup

    四大版本,目前总 star 在 17 k+ 左右,主要活跃在掘金社区,id 是恋猫小郭,主要专栏有《Flutter完整开发实战详解》系列等,平时工作负责移动端项目的开发,工作经历从 Android...宇宙中万物皆 Widget ,它们都是不可变一帧,同时也是被人吐槽很多嵌套模式,当然换个角度,事实你把他当作 Widget 配置文件来写或者就好理解了。...image 那如果 Flutter 项目插件带有本地代码呢?...4.1 AndroidView AndroidView -> TextureLayer,利用Android 副屏显示与虚拟内存显示原理。 共享内存,实时截图渲染技术。...(我在开发过程中几乎无知觉) 在 flutter_web 中 UI 层面与渲染逻辑和 Flutter 几乎没有什么区别,底层一些区别flutter_web 中 Canvas 是 EngineCanvas

    1.9K20

    Widget中state到底是什么

    下述代码分别展示了在Android、iOS和原生JavaScript中,如何将一个文本控件展示文案更改为Hello World: // Android 设置某文本控件展示文案为 Hello World...下面有两个简单小例子,来帮助理解这个判断规则。 第一个例子是,我需要创建一个自定义弹窗控件,把使用App过程中出现一些错误信息提示给用户。...(比如,用户点击按钮)或者其内部数据变化(比如,网络数据回包),并体现在UI。...这里有一张StatefulWidget示意图,如下所示: ? 看到这里你可能有点困惑了。因为,之前我们提到,Widget是不可,发生变化时需要销毁重建,所以谈不状态。...如果某个子Widget重建涉及到一些耗时操作,那页面的渲染性能将会急剧下降。

    2.9K20

    Flutter 1.22 正式发布

    由于这是新移动操作系统版本发布季节,因此此发行版侧重于确保Android 11和iOS 14与Flutter兼容。...除了对新移动操作系统版本支持外,还有很多其他要分享新闻,包括预览Android最重要功能之一:状态恢复,新“Material 风格按钮“,新国际化和本地化支持(与热重载一起使用),一个新Navigator...您可以将旧按钮与新按钮混合使用。 新国际化和本地化支持 自Flutter创立以来,Flutter已提供您应用程序国际化(i18n)和本地化(l10n)所需核心功能。...该软件包有助于解决诸如如何正确地将字符串(“ A in text in English”)缩写为前15个字符问题。使用String类,该缩写为“ A??...Flutter惊人发展速度意味着我们能够为iOS和Android实施屡获殊荣设计,并且还可以发布到Web—及时锁定!通常,这实际不可

    7.5K20

    Flutter应用集成极光推送

    概述 在移动应用开发中,消息推送可以说是一项非常重要功能,它能够起到提醒或者唤醒用户作用,同时也是产品运营人员更高效地实现运营目标的重要手段,比如将新架一个商品或者最新一条新闻推送给用户。...事实,消息推送是一个横跨业务服务器、第三方推送服务托管厂商、操作系统长连接推送服务、用户终端以及移动手机应用等五方面的复杂业务应用场景。...在极光开发者平台中创建推送应用程序,然后填写build.gradle脚本所需参数,如下图所示。 然后,在Android手机上运行项目,会有 Running Gradle task ......,选择需要推送平台,然后点击【立即发送】按钮,如下图所示。...等待消息推送成功后,就可以在对应移动设备看到推送消息,如下图所示

    22410

    Flutter应用集成极光推送实现示例

    概述 在移动应用开发中,消息推送可以说是一项非常重要功能,它能够起到提醒或者唤醒用户作用,同时也是产品运营人员更高效地实现运营目标的重要手段,比如将新架一个商品或者最新一条新闻推送给用户。...事实,消息推送是一个横跨业务服务器、第三方推送服务托管厂商、操作系统长连接推送服务、用户终端以及移动手机应用等五方面的复杂业务应用场景。...在极光开发者平台中创建推送应用程序,然后填写build.gradle脚本所需参数,如下图所示。 ?...,然后点击【立即发送】按钮,如下图所示。...等待消息推送成功后,就可以在对应移动设备看到推送消息,如下图所示。 ?

    2.8K20

    TensorFlow Lite,ML Kit 和 Flutter 移动深度学习:1~5

    这对用户和开发人员都是有利。 让我们简要概述一下移动设备 AI 如何影响我们与智能手机交互方式。 在移动设备使用 AI 改善用户体验 人工智能使用极大地增强了移动设备用户体验。...在本节中,我们将简要讨论移动应用领域中一些最大参与者如何利用 AI 优势来促进其业务发展。 Netflix Netflix 是移动应用中机器学习最佳和最受欢迎例子。...深度学习基本知识以及如何将其与移动应用集成对于接下来章节非常重要,在这些章节中,我们将广泛使用该知识来创建一些实际应用。 在下一章中,我们将学习使用设备模型进行面部检测知识。...处理图像 在本节中,我们将讨论如何对图像进行一些常见操作以帮助图像处理。 通常,对图像进行一些简单操作可以导致更快,更好预测。 旋转 假设我们希望将示例中图像旋转 90 度。...该文件将包含用于创建应用第一个屏幕代码,其中包含带有一些文本和两个凸起按钮列,如以下屏幕截图所示创建应用第一个屏幕步骤如下: 首先,我们将定义一些全局字符串变量,这些变量稍后将在创建用于选择模型按钮以及保存用户选择模型时使用

    18.6K10

    Flutter 第一个程序Hello World!

    变量名:FLUTTER_STORAGE_BASE_URL 变量值:https://storage.flutter-io.cn 如下图所示操作。   ...四、运行hello_world项目   我们之前下载Flutter SDK里面有一个examples文件夹,里面是一些flutter项目,这些项目有什么作用呢?...Android Studio中配置FlutterSDK,如图所示。   ...通过运行sdk中自带项目我们解决了一些问题,同时还发现这个项目比较老旧了,没有做更新,它里面还是基于Android 10去写Android11运行应该没有问题,而到了Android12就不行了...项目创建完成,如下图所示创建完成之后我们直接运行这个项目在模拟器或者真机上。 这是一个计数器,点击右下角浮动按钮,屏幕中间数字会加1。

    1K20
    领券