Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix BrnBottomTabBar 底部文字在特定情况下无法展示的问题。 #145

Merged
merged 5 commits into from
Mar 30, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -81,11 +81,15 @@ const BrnBottomTabBarItem({
| icon | Widget | 未选中时的icon | 是 | 无 |
| activeIcon | Widget | 选中时的icon | 否 | 无 |
| title | Widget? | Tab标题名调 | 否 | 无 |
| selectedTextStyle | TextStyle? | tab 选中文本样式 | 否 | 否 |
| unSelectedTextStyle | TextStyle? | tab 未选中文本样式 | 否 | 否 |
| backgroundColor | Color? | 背景色 | 否 | 无 |
| badge | Widget? | 未读信息 | 否 | 无 |
| badgeNo | String? | 未读信息个数 | 否 | 无 |
| maxBadgeNo | int | 未读消息最大个数 | 否 | 99 |



## 四、代码演示

### 效果1
Expand Down
137 changes: 82 additions & 55 deletions example/lib/sample/components/bottom_tabbar/bottom_tabbar_example.dart
Original file line number Diff line number Diff line change
@@ -1,5 +1,3 @@


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

Expand All @@ -25,6 +23,9 @@ class BottomTabbarExampleState extends State<BottomTabbarExample>
/// test3
int _selectedIndexTest3 = 0;

/// test4
int _selectedIndexTest4 = 0;

/// 未读消息数量
String badgeNo1 = '100';

Expand Down Expand Up @@ -76,6 +77,14 @@ class BottomTabbarExampleState extends State<BottomTabbarExample>
});
}

/// test4
void _onItemSelectedTest4(int index) {
setState(() {
/// 置为当前选中item的索引值
_selectedIndexTest4 = index;
});
}

@override
Widget build(BuildContext context) {
return MaterialApp(
Expand All @@ -98,32 +107,47 @@ class BottomTabbarExampleState extends State<BottomTabbarExample>
items: <BrnBottomTabBarItem>[
// 定义每个BottomTabBarItem,子属性请看源码
BrnBottomTabBarItem(
icon:
Image(image: AssetImage("assets/icons/navbar_house.png")),
activeIcon:
Image(image: AssetImage("assets/icons/navbar_house.png")),
icon: Image(image: AssetImage("assets/icons/navbar_house.png")),
activeIcon: Image(
image: AssetImage("assets/icons/navbar_house.png"),
color: Colors.blue,
),
title: Text(titles[0])),
BrnBottomTabBarItem(
icon:
Image(image: AssetImage("assets/icons/navbar_house.png")),
icon: Image(image: AssetImage("assets/icons/navbar_house.png")),
activeIcon: Image(
image: AssetImage("assets/icons/navbar_house.png"),
color: Colors.blue,
),
title: Text(titles[1])),
BrnBottomTabBarItem(
icon:
Image(image: AssetImage("assets/icons/navbar_house.png")),
icon: Image(image: AssetImage("assets/icons/navbar_house.png")),
activeIcon: Image(
image: AssetImage("assets/icons/navbar_house.png"),
color: Colors.blue,
),
title: Text(titles[2])),
BrnBottomTabBarItem(
icon:
Image(image: AssetImage("assets/icons/navbar_house.png")),
activeIcon:
Image(image: AssetImage("assets/icons/navbar_house.png")),
icon: Image(image: AssetImage("assets/icons/navbar_house.png")),
activeIcon: Image(
image: AssetImage("assets/icons/navbar_house.png"),
color: Colors.blue,
),
title: Text(titles[3])),
BrnBottomTabBarItem(
icon:
Image(image: AssetImage("assets/icons/navbar_house.png")),
title: Text(titles[4])),
icon: Image(image: AssetImage("assets/icons/navbar_house.png")),
activeIcon: Image(
image: AssetImage("assets/icons/navbar_house.png"),
color: Colors.blue,
),
title: Text(titles[4]),
),
BrnBottomTabBarItem(
icon:
Image(image: AssetImage("assets/icons/navbar_house.png")),
icon: Image(image: AssetImage("assets/icons/navbar_house.png")),
activeIcon: Image(
image: AssetImage("assets/icons/navbar_house.png"),
color: Colors.blue,
),
title: Text(titles[5])),
],
),
Expand All @@ -138,66 +162,69 @@ class BottomTabbarExampleState extends State<BottomTabbarExample>
currentIndex: _selectedIndexTest1,
onTap: _onItemSelectedTest1,
items: <BrnBottomTabBarItem>[
BrnBottomTabBarItem(
icon: Icon(icons[0]), title: Text(titles[0])),
BrnBottomTabBarItem(icon: Icon(icons[0]), title: Text(titles[0])),
],
),
Padding(
padding: const EdgeInsets.all(12.0),
child: Text('极限条件测试2,有8个item'),
child: Text('有 2 个 item'),
),
BrnBottomTabBar(
fixedColor: Colors.blue,
currentIndex: _selectedIndexTest2,
onTap: _onItemSelectedTest2,
items: <BrnBottomTabBarItem>[
BrnBottomTabBarItem(
icon: Icon(icons[0]), title: Text(titles[0])),
BrnBottomTabBarItem(
icon: Icon(icons[0]), title: Text(titles[0])),
BrnBottomTabBarItem(
icon: Icon(icons[0]), title: Text(titles[0])),
BrnBottomTabBarItem(
icon: Icon(icons[0]), title: Text(titles[0])),
BrnBottomTabBarItem(
icon: Icon(icons[0]), title: Text(titles[0])),
BrnBottomTabBarItem(
icon: Icon(icons[0]), title: Text(titles[0])),
BrnBottomTabBarItem(
icon: Icon(icons[0]), title: Text(titles[0])),
BrnBottomTabBarItem(
icon: Icon(icons[0]), title: Text(titles[0])),
BrnBottomTabBarItem(icon: Icon(icons[0]), title: Text(titles[0])),
BrnBottomTabBarItem(icon: Icon(icons[0]), title: Text(titles[0])),
],
),
Padding(
padding: const EdgeInsets.all(12.0),
child: Text('极限条件测试3,text比较长的情况'),
child: Text('极限条件测试2,有8个item'),
),
BrnBottomTabBar(
fixedColor: Colors.blue,
currentIndex: _selectedIndexTest3,
onTap: _onItemSelectedTest3,
items: _getTabBarItems(count: 8),
),
Padding(
padding: const EdgeInsets.all(12.0),
child: Text('极限条件测试3,text比较长的情况'),
),
BrnBottomTabBar(
fixedColor: Colors.blue,
currentIndex: _selectedIndexTest4,
onTap: _onItemSelectedTest4,
items: <BrnBottomTabBarItem>[
BrnBottomTabBarItem(
icon: Icon(icons[0]), title: Text("1111111111")),
BrnBottomTabBarItem(
icon: Icon(icons[0]), title: Text("2222222222")),
BrnBottomTabBarItem(
icon: Icon(icons[0]), title: Text("3333333333")),
BrnBottomTabBarItem(
icon: Icon(icons[0]), title: Text("4444444444")),
BrnBottomTabBarItem(
icon: Icon(icons[0]), title: Text("5555555555")),
BrnBottomTabBarItem(
icon: Icon(icons[0]), title: Text("6666666666")),
BrnBottomTabBarItem(
icon: Icon(icons[0]), title: Text("7777777777")),
BrnBottomTabBarItem(
icon: Icon(icons[0]), title: Text("8888888888")),
BrnBottomTabBarItem(icon: Icon(icons[0]), title: Text("1111111111")),
BrnBottomTabBarItem(icon: Icon(icons[0]), title: Text("2222222222")),
BrnBottomTabBarItem(icon: Icon(icons[0]), title: Text("3333333333")),
BrnBottomTabBarItem(icon: Icon(icons[0]), title: Text("4444444444")),
BrnBottomTabBarItem(icon: Icon(icons[0]), title: Text("5555555555")),
BrnBottomTabBarItem(icon: Icon(icons[0]), title: Text("6666666666")),
BrnBottomTabBarItem(icon: Icon(icons[0]), title: Text("7777777777")),
BrnBottomTabBarItem(icon: Icon(icons[0]), title: Text("8888888888")),
],
),
],
)),
);
}

List<BrnBottomTabBarItem> _getTabBarItems({int count = 1}) {
return List<BrnBottomTabBarItem>.generate(
count,
(index) => BrnBottomTabBarItem(
icon: Icon(
icons[0],
color: Colors.grey,
),
title: Text(titles[0]),
activeIcon: Icon(
icons[0],
color: Colors.blue,
),
));
}
}
19 changes: 17 additions & 2 deletions example/lib/sample/components/navbar/nav_bar_example_page.dart
Original file line number Diff line number Diff line change
Expand Up @@ -245,7 +245,11 @@ class _NavBarPageState extends State<NavBarPage> with TickerProviderStateMixin {
key: actionKey,
iconPressed: () {
BrnPopupListWindow.showPopListWindow(context, actionKey,
offset: 10, data: ["aaaa", "bbbbb"]);
offset: 10, data: ["aaaa", "bbbbb"], onItemClick: (index, item){
BrnDialogManager.showConfirmDialog(context, cancel: 'cancel', confirm: 'confirm', message: 'message');
}, onDismiss: (){
BrnToast.show('onDismiss', context);
});
},
),
);
Expand Down Expand Up @@ -510,6 +514,12 @@ class _NavBarPageState extends State<NavBarPage> with TickerProviderStateMixin {
context,
keyLeading,
data: ["aaaa", "bbbbb"],
onItemClick: (index, data) {
BrnDialogManager.showConfirmDialog(context, cancel: 'cancel', confirm: 'confirm', message: 'message');
},
onDismiss: (){
BrnToast.show('onDismiss', context);
},
);
},
//输入框 文本内容变化的监听
Expand Down Expand Up @@ -568,7 +578,12 @@ class _NavBarPageState extends State<NavBarPage> with TickerProviderStateMixin {
leadClickCallback: (controller, update) {
//controller 是文本控制器,通过controller 可以拿到输入的内容 以及 对输入的内容更改
//update 是setState方法的方法命,update() 就可以刷新输入框
BrnPopupListWindow.showPopListWindow(context, keyLeading, data: ["aaaa", "bbbbb"], offset: 10);
BrnPopupListWindow.showPopListWindow(
context,
keyLeading,
data: ["aaaa", "bbbbb"],
offset: 10
);
},
//输入框 文本内容变化的监听
searchBarInputChangeCallback: (input) {
Expand Down
10 changes: 10 additions & 0 deletions example/web/assets/FontManifest.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
[
{
"family": "MaterialIcons",
"fonts": [
{
"asset": "fonts/MaterialIcons-Regular.otf"
}
]
}
]
Binary file not shown.
Binary file added example/web/favicon.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added example/web/icons/icon-192.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added example/web/icons/icon-512.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
10 changes: 10 additions & 0 deletions example/web/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<script defer src="main.dart.js" type="application/javascript"></script>
</head>
<body>
</body>
</html>
7 changes: 7 additions & 0 deletions example/web/main.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@

// TODO: change `my_app` to refer to your app package name.
import 'package:example/main.dart' as app;

main() async {
app.main();
}
23 changes: 23 additions & 0 deletions example/web/manifest.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
{
"name": "Bruno Demo",
"short_name": "Bruno",
"start_url": ".",
"display": "Bruno",
"background_color": "#FFFFFFFF",
"theme_color": "#0175C2",
"description": "Bruno 是基于一整套设计体系的 Flutter 组件库。An enterprise-class package of Flutter components for mobile applications.",
"orientation": "portrait-primary",
"prefer_related_applications": false,
"icons": [
{
"src": "icons/Icon-192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "icons/Icon-512.png",
"sizes": "512x512",
"type": "image/png"
}
]
}
17 changes: 9 additions & 8 deletions lib/src/components/button/collection/brn_button_panel.dart
Original file line number Diff line number Diff line change
Expand Up @@ -202,17 +202,18 @@ class _BrnButtonPanelState extends State<BrnButtonPanel> {
fontSize: 16));
},
popDirection: widget.popDirection,
onItemClick: (index, item) {
onItemClickInterceptor: (index, item) {
// 按钮不可用的时候,点击无响应;
if (_secondaryButtonList[index + 2].isEnable) {
return false;
} else {
return true;
}
},
onItemClick: (index, item) {
if (widget.secondaryButtonOnTap != null) {
if (_secondaryButtonList[index + 2].isEnable) {
widget.secondaryButtonOnTap!(index + 2);
return false;
} else {
return true;
}
widget.secondaryButtonOnTap!(index + 2);
}
return false;
});
},
);
Expand Down
Loading