flutter TabBar组件安卓与ios显示不同

最新推荐文章于 2024-07-21 08:32:40 发布
最新推荐文章于 2024-07-21 08:32:40 发布
阅读量427 收藏 8
点赞数 9
文章标签： flutter android ios
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_64482155/article/details/135412361
版权

在将安卓代码运行在ios上后，发现TabBar组件显示和安卓上显示的不一样，在ios上，TabBar组件前面会有很大一块“空隙”，如下图:

 查了很多方法，要不就是说改padding，要不就是说我的布局有问题，但经过仔细检查也测试过这些说法，完全没用。

之后便只能从TabBar属性下手看看，这时就发现了不同。在ios环境下，TabBar组件有tabAlignment属性，可这个属性在安卓环境下却没有！抱着尝试的心态，将tabAlignment属性设置为TabAlignment.center后，问题解决！

 不太清楚什么原因，仅此记录一下，希望能帮到有需要的人，当然同时也希望能有大佬为此解答~

以北Y
关注
  • 9
    点赞
  • 踩
  • 8
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
使用Toolbar/ActionBar自定义布局时，左侧/右侧有一段空白无法使用
阿飞的博客
05-22 1万+
解决方法： 1.给Toolbar加上app:contentInsetStart”="0dp"（左侧）或者“app:contentInsetEnd”="0dp"（右侧） <android.support.v7.widget.Toolbar android:layout_width="match_parent" android:layout_heig...
在Flutter中创建自定义的左对齐TabBar组件
爱喝水程序员的博客
03-15 1093
在某些情况下，我们希望TabBar的标签在水平方向上左对齐，而不是默认的居中对齐。例如，当我们有一个较宽的屏幕，并且希望标签从左侧开始排列时，这种需求就变得尤为重要。通过自定义TabBar组件，我们可以轻松地实现这一目标。
Flutter TabBar下方白条隐藏
qianxiamuxin的博客
11-05 2202
我们在设置AppBar的时候，常常用到TabBar做嵌套导航，但是由于tabbar自带下划线，会使得界面的设计不美观这是由于我们在 GetMaterialApp里面的theme主题管理中开启了，这会导致TabBar组件样式出现下划线。
Flutter底部Tabbar组件使用
僵小蛋的博客
04-29 703
APP都少不了底部tabbar导航，Flutter也提供了对应组件，上代码： TabsPage.dart: import 'package:flutter/material.dart'; import 'package:flutter_screenutil/flutter_screenutil.dart'; import 'package:flutter_svg/flutter_svg.dart'...
tabbar居中效果
09-17
在iOS和Android应用开发中，`TabBar`是常见的底部导航栏组件，用于展示多个主要功能模块，用户可以通过点击不同的按钮在这些模块间切换。在某些设计风格中，`TabBar`的按钮可能会被要求居中显示，以满足特定的视觉...
Buttons_tabbar：Flutter程序包，它实现一个TabBar，其中每个标签都是一个切换按钮
02-04
3. **跨平台兼容性**: 由于Flutter的跨平台特性，`Buttons_tabbar` 可以在Android和iOS上无缝运行，提供一致的用户体验，无需为每个平台编写不同的代码。 4. **UI设计**: 使用此包可以轻松实现美观且响应式的TabBar...
flutter_badges：用于创建徽章的flutter程序包
02-04
7. **与其他UI组件结合**：`flutter_badges`允许徽章与Flutter的其他UI组件（如`AppBar`、`TabBar`或`IconButton`）无缝结合，丰富了应用的交互性。 8. **兼容性**：`flutter_badges`库兼容Dart语言，并且适用于...
tap_water：【声明：未发布前，勿使用，勿用明星，预计于2020年11月底发布】Flutter tab_bar组件，支持中间带加号按钮的TabBar，支持Lottie动画。iTeaTime（技术清谈）团队出品。高度可定制的tabBar和Flutter的tabBarController
02-04
总结来说，tap_water是iTeaTime团队为Flutter开发的一个高级TabBar组件，它拥有独特的加号按钮和Lottie动画支持，提供高度自定义选项，以适应不同应用的需求。该组件适用于iOS平台，能够与Flutter的tabBarController...
flutter_wechat_ui:flutter实现微信简易UI
05-13
Flutter是Google推出的一个开源UI工具包，用于构建高性能、高保真度的原生移动应用程序，适用于Android和iOS平台。通过使用Dart编程语言，开发者可以快速地创建美观且交互丰富的应用。 首先，"flutter_wechat_ui...
Flutter中GetX的用法(超详细使用指南之路由依赖管理篇)
我叫柱子哥
07-19 780
今天这篇博客主要介绍Getx的三大功能之一的依赖管理。依赖管理是软件开发中的一个关键部分，尤其是在复杂应用中。它帮助开发者管理应用中的各种依赖，确保依赖的实例化和生命周期管理变得更加简单和高效。GetX 提供了一种简单且高效的依赖注入方式，通过少量代码即可实现依赖的注入、管理和访问。它主要通过Get.put、Get.lazyPut、Get.putAsync和Get.create等方法来实现依赖管理。
Shell 构建flutter + Navtive 生成IPA
21空间的博客
07-18 563
在build_iOS 文件夹配置打包的DEVELOPExportOptionsPlist.plist（dev 构建）或AppStoreExportOptionsPlist.plist（Release 构建）或ADHOCExportOptionsPlist.plist（adhoc 构建），plist文件先用Xcode打包，取出对应的plist，按以上重命名plist文件后，copy进build_iOS文件夹；"~~~~~~~~~~~~选择打包方式(输入序号)~~~~~~~~~~~~~~~"
Flutter 开源库学习
idaretobe的专栏
07-17 979
idaretobe/MTBBarcodeScanner Objective-Cidaretobe/qr.widget Dartidaretobe/qr.dart Dartidaretobe/wechat_scan Dartidaretobe/hms-flutter-plugin Javaidaretobe/mobile_scanner Dartidaretobe/flutter_staggered_grid_view DartCreated 4 repositoriesidaretobe/ApkEditor
LG 选择 Flutter 来增强其智能电视操作系统 webOS
恋猫de小郭的博客
07-17 1644
总的来说，LG 是 Flutter 在 TV 领域的一次新的尝试，并且它是在脱离了 Android 平台的场景下实现的支持，虽然 webOS 并不是什么流行的系统，但是这也体现出了 Flutter 的特点：可以用较低的成本实现较好性能的跨平台。后续，在 LG 的主导下，WebOS 经过进一步修改，转变为智能电视操作系统，于是 WebOS TV 就诞生了，此后 LG 的 TV 基本路线定为 webOS ，在应用层面，WebOS TV 以基于 Web 的技术为基础。然后 LG 为什么选择 webOS？
flutter app 技术需求规划 设计
idaretobe的专栏
07-17 968
典型的平台特异性，webview等问题。
Flutter热更新技术探索
idaretobe的专栏
07-17 839
原生 APP（例如：Android & IOS）的热更新需求已经比较成熟，但 Flutter 技术栈目前还缺少类似的技术方案，因此 Flutter 研发团队，也需要类似的热更新技术。根据以上的分析，我们知道了 Flutter 业务代码的数据结构，也知道了在运行时如何加载，因此我们只需要在编译时做更改，产生自己需要的代码段，和数据段文件。4， APP 启动时访问后端接口，根据参数（app 的版本号，补丁包版本号，md5，flutter SDK 版本号，Engine 版本号）拉取补丁包；2）页面动态组件框架；
深入探索Flutter中的状态管理：使用Provider库
WangQingLei0307的博客
07-18 703
当涉及Flutter状态管理时，provider是一个强大且灵活的解决方案，它提供了一种简单且高效的方式来管理应用程序状态。本文将详细介绍Flutter中provider插件的使用方法、示例代码、各种使用场景以及注意事项。
flutter pub 失败
qq_35469691的博客
07-18 283
因为我无论如何在android stduio的terminal中都是上面的报错，最后没办法，在电脑的命令行中执。当你瞎搞，搞出上面的问题后，代理、翻墙、等等的方式都用完了，有可能是缓存出了问题。
谷粒商城实战笔记-41-前端基础-Vue-组件化基础
最新发布
epitomizelu的专栏
07-21 554
你点了我 {{ count }} 次，我记住了.
Flutter TabBar导航
10-10
首先，需要在Scaffold的appBar属性中添加一个TabBar，然后在Scaffold的body属性中添加一个TabBarView来显示与选定选项卡对应的内容。具体实现代码如下： ``` class MyTabbedPage extends StatefulWidget { const ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值