Flutter 最好的导航插件

最新推荐文章于 2024-05-17 10:09:01 发布
最新推荐文章于 2024-05-17 10:09:01 发布
阅读量1.4k 收藏
点赞数 1
文章标签： flutter android studio css
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_42320543/article/details/122208513
版权

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-tIKyVD8K-1640740976927)(https://ducafecat.tech/2021/12/29/translation/best-nav-bar-packages-for-flutter/2021-12-29-09-10-00.png)]

前言

一个好的导航对 APP 是很重要的，以下这些导航插件也许对你一开始有帮助。

不过好的体验还是要自己写。

原文

https://tomicriedel.medium.com/best-nav-bar-packages-for-flutter-3ea86aed1e65

正文

Curved Navigation Bar

有了这个包，你可以很容易地创建一个非常漂亮的导航栏，这是一个真正的吸引注意的方式。有一个非常好的动画和许多定制选项，这是一个非常好的扩展为您的下一个应用程序！

Bottom Bar with Sheet

是一个普通的底部栏，但是它提供了一个非常有用的功能。有时候你想在屏幕上有更多的空间，但是你是怎么做到的呢？嗯，非常简单: 有了这个导航条，你可以拉出一个“第二屏幕”/表，通过这样做，你得到更多的空间。下面是一个小例子:

Convex Bottom Bar

使用 Convex Bottom Bar，你可以创建令人印象深刻的底部栏，一定会吸引用户的眼球！

Sliding Clipped Nav Bar

提供了一个很好的方式，让你的应用程序对用户来说更有趣。由于其令人难以置信的简单的执行和美丽的设计，它是最好的导航 Pub 包之一。

但是… … 说够了，导航栏和这个包装看起来怎么样？

我想你很清楚我为什么这么喜欢这个包裹。有这么多的定制可能性和实现非常简单。

Custom Navigation Bar

这个导航栏为你提供了一个美丽的动画底部 Pub ，它的灵感来自于一个关于运球的帖子。看看这些美丽的动画吧:

Persistent Bottom Navigation Bar

使用这个包，你可以创建一个底部导航栏，它可以遍历多个子屏幕:

© 猫哥

订阅号

独立开发者_猫哥
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
flutter_custom_tabs:Flutter插件以使用Chrome自定义标签
04-30
flutter_custom_tabs Flutter插件，可使用。 只有Android版Chrome支持“自定义标签”。 因此，界面相同，但是行为如下： 安卓如果安装了Chrome，请在自定义标签中打开已自定义外观的Web URL。 如果尚未安装，请在其他浏览器中打开。 的iOS 使用打开SFSafariViewController，并且启动时的所有选项都将被忽略。 入门 将flutter_custom_tabs添加到flutter_custom_tabs的依赖pubspec.yaml 。 dependencies : flutter_custom_tabs : ^0.6.0 用法 打开url_launcher类的Web URL。 例子 import 'package:flutter/material.dart' ; import 'package:flutter_cust
flutter 高德地图插件demo
12-28
在本文中，我们将深入探讨如何在Flutter应用中集成和使用高德地图插件，以便为用户提供地图功能。Flutter是一款由Google开发的开源UI工具包，用于构建高性能、高保真度的跨平台移动应用。而高德地图是中国领先的数字...
Flutter 基础控件 顶部导航栏 TabBar
小小熊的博客
10-08 647
Flutter 基础控件 顶部导航栏 TabBar /// 顶部导航栏 demo class TabBarDemo extends StatefulWidget { @override State<StatefulWidget> createState() { return _TabBarDemoState(); } } /// 混入 SingleTickerP...
推荐：ConvexBottomBar - 创新的底部导航栏组件
最新发布
gitblog_00087的博客
05-17 426
推荐：ConvexBottomBar - 创新的底部导航栏组件 convex_bottom_barA Flutter package which implements a ConvexAppBar to show a convex tab in the bottom bar. Theming supported.项目地址:https://gitcode.com/gh_mirrors/co/con...
flutter 底部导航栏组件BottomNavigationBar
weixin_43294560的博客
04-14 526
底部导航栏组件 (1)在Scaffold组件中与body同级设置 bottomNavigationBar: BottomNavigationBar(...) (2)实现点击改变效果需要在有状态组件中根据索引实现，不同的页面根据不同的组件内容来设置,放进数值里,根据索引选择 参数: BottomNavigationBar( items:[ 配置导航栏每个bar内...
Flutter底部导航栏插件persistent_bottom_nav_bar的使用
廖若星辰-LTY
01-23 885
flutter 框架中的persistent_bottom_nav_bar 插件可以让我们快速实现页面底部导航栏（也就是 bottomNavigationBar ）的布局且能拥有多样的切换效果（包括但不限于：动画切换效果、中间凸起按钮效果等）
Flutter实现顶部导航栏功能
明知山
03-17 3128
import 'package:flutter/material.dart'; class AppBarDemoPage extends StatelessWidget { const AppBarDemoPage({Key key}) : super(key: key); @override Widget build(BuildContext context) { ret...
flutter 常用插件整理附加使用实例
03-27
本文将深入探讨一些常用的Flutter插件，并提供实际的使用示例，帮助你提升Flutter应用的开发效率。 1. **网络请求库：http** `http`插件是Flutter中进行HTTP请求的标准库，支持GET、POST等多种HTTP方法。例如，...
Flutter和Dart插件.zip
05-16
Flutter和Dart插件是开发跨平台移动应用的重要工具，主要针对谷歌的Flutter框架。Flutter是一种开放源代码的UI工具包，它允许开发者使用单一代码库构建高性能、高保真度的应用程序，不仅适用于Android和iOS，还可以...
Flutter图片视频文件选择插件
01-08
【Flutter图片视频文件选择插件】是一个专门为Flutter开发者设计的扩展库，旨在简化在Flutter应用中选择图片和视频文件的过程。这个插件由作者独立开发，欢迎社区成员使用并提供反馈，以帮助改进功能和用户体验。它...
Android Studio的Flutter插件
05-18
5. **选择文件**: 弹出的文件选择对话框中，导航到你之前解压的Flutter插件文件夹，选择包含插件的`.zip`或`.jar`文件，然后点击`Open`。 6. **完成安装**: 安装过程可能需要一些时间，完成后，Android Studio会...
一个Flutter中3D底部导航栏
08-10
一个Flutter中3D底部导航栏
Flutter 自定义底部导航栏
01-07
文件结构： main.dart import 'package:flutter/material.dart'; import 'pages/tabs.dart'; void main() => runApp(new MyApp()); class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( home: Tabs(), ); } } tabs.dart import 'package:flutte
Flutter 通过TabController 定义TabBar
10-06
语法使用 页面必须继承StatefulWidget 页面必须实现SingleTickerProviderStateMixin 页面初始化时，实例化TabController 在TabBar组件中指定controller为我们实例化的TabController 在TabBarView组件中指定controller为我们实例化的TabController
Flutter 底部导航栏示例
03-04
Flutter 底部导航栏（BottomNavigationBar）demo。 详情请看博客：https://yuzhiqiang.blog.csdn.net/article/details/88118902
js-左侧导航插件-导航栏
03-10
左侧导航插件
Jquery导航栏插件
vistang的博客
05-08 2402
前几天，要实现一个导航栏插件，其实就是几行代码的事。作为程序员，都有一个特色，就是懒，有时候也觉得别人实现的效果可能好一些。知道网上有很多jquery插件，所以baidu了一番，找了个效果还不错的jquery.megamenu，相信有很多朋友用过了。贴个图看看哈：         使用起来也很简单的，引入了脚本和样式后，加上这个就ok了：   jQuery(function() {      jQuery(".megamenu").megamenu();   });         用着觉得效果不是很好，但
flutter之底部导航栏制作
chunchun1230的博客
03-12 614
在lib目录下新建pages文件夹，并新建dart文件，效果如图所示 2.在main.dart文件中写代码，效果如图所示 3.在index_page.dart文件中写代码，效果如图所示 4.在home_page.dart文件中写代码，效果如图所示 5.在cateory_page.dart文件中写代码，效果如图所示 6.在cart_page.dart...
TinyNav.js - 简单易用的导航栏插件
gitblog_00015的博客
03-15 400
TinyNav.js - 简单易用的导航栏插件 TinyNav.js 是一个轻量级的 jQuery 插件，用于将大的水平导航栏转换为垂直移动设备友好的菜单。 项目简介 TinyNav.js 的目标是解决响应式网页设计中常见的问题——如何在有限的空间内显示大量的导航选项。此插件通过自动创建一个基于给定类名的下拉菜单，使您可以轻松地将大的桌面导航栏转换为适用于手机和平板电脑的小型垂直菜单。 功能特性 ...
flutter 获取安卓 导航栏高度
09-07
要获取安卓导航栏的高度，可以使用Flutter的系统调用和平台通道来实现。以下是一种方法： 1. 创建一个Flutter插件：首先，创建一个Flutter插件，用于与安卓平台进行通信。在Flutter插件的代码中，需要定义一个方法来获取导航栏的高度。 2. 实现方法：在插件的实现代码中，使用安卓的系统调用来获取导航栏的高度。可以使用Android的WindowManager类来获取屏幕尺寸和导航栏高度。 3. 注册方法：在插件的代码中，将获取导航栏高度的方法注册到Flutter的通道中，以便在Dart代码中调用。 4. 在Flutter代码中使用：在Flutter项目的Dart代码中，使用插件的方法来获取导航栏的高度。可以在需要获取导航栏高度的地方调用该方法，并使用返回的值进行相关的逻辑处理。 需要注意的是，获取导航栏高度的操作涉及到与安卓平台的交互，因此需要在使用前确保安卓平台上的插件已经正确安装和配置。另外，由于每个安卓设备的导航栏高度可能不同，所以在使用获取到的高度时要谨慎处理。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值