Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
DCloud
uni-app
提交
b3e514c2
U
uni-app
项目概览
DCloud
/
uni-app
2 个月 前同步成功
通知
716
Star
38705
Fork
3642
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
7
列表
看板
标记
里程碑
合并请求
1
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
U
uni-app
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
7
Issue
7
列表
看板
标记
里程碑
合并请求
1
合并请求
1
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
b3e514c2
编写于
4月 29, 2022
作者:
d-u-a
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
feat: H5 tabbar iconfont
上级
b7feb489
变更
2
隐藏空白更改
内联
并排
Showing
2 changed file
with
32 addition
and
6 deletion
+32
-6
src/platforms/h5/components/app/tabBar.vue
src/platforms/h5/components/app/tabBar.vue
+31
-5
src/platforms/h5/service/api/ui/tab-bar.js
src/platforms/h5/service/api/ui/tab-bar.js
+1
-1
未找到文件。
src/platforms/h5/components/app/tabBar.vue
浏览文件 @
b3e514c2
...
...
@@ -36,13 +36,23 @@
:style=
"
{height:height}"
>
<div
v-if=
"getIconPath(item,index) || item.iconPath || item.isMidButton"
v-if=
"getIconPath(item,index) || item.icon
font || item.icon
Path || item.isMidButton"
:class=
"
{'uni-tabbar__icon__diff':!item.text}"
class="uni-tabbar__icon"
:style="{width: iconWidth,height:iconWidth}"
>
>
<div
v-if=
"item.iconfont"
:style=
"
{
color:selectedIndex === index ? selectedColor : color,
fontSize: item.iconfont.fontSize || fontSize
}"
class="uni-tabbar__iconfont"
>
{{
selectedIndex
===
index
?
item
.
iconfont
.
selectedText
:
item
.
iconfont
.
text
}}
</div>
<img
v-if=
"!item.isMidButton"
v-
else-
if=
"!item.isMidButton"
:src=
"_getRealPath(getIconPath(item,index))"
>
<div
...
...
@@ -166,6 +176,10 @@
uni-tabbar
.uni-tabbar__icon
img
{
width
:
100%
;
height
:
100%
;
}
uni-tabbar
.uni-tabbar__iconfont
{
font-family
:
'UniTabbarIconFont'
;
}
uni-tabbar
.uni-tabbar__label
{
...
...
@@ -219,10 +233,12 @@
<
script
>
import
getRealPath
from
'
uni-platform/helpers/get-real-path
'
import
{
isPlainObject
}
from
'
uni-shared
'
import
{
publish
}
from
'
uni-platform/service/bridge
'
import
{
publish
}
from
'
uni-platform/service/bridge
'
import
{
loadFontFace
}
from
'
uni-core/view/bridge/subscribe/font
'
function
cssSupports
(
css
)
{
return
window
.
CSS
&&
CSS
.
supports
&&
(
CSS
.
supports
(
css
)
||
CSS
.
supports
.
apply
(
CSS
,
css
.
split
(
'
:
'
)))
}
}
const
UNI_TABBAR_ICON_FONT
=
'
UniTabbarIconFont
'
export
default
{
name
:
'
TabBar
'
,
props
:
{
...
...
@@ -247,6 +263,10 @@ export default {
borderStyle
:
{
type
:
String
,
default
:
'
black
'
},
iconfontSrc
:
{
type
:
String
,
default
:
''
},
list
:
{
type
:
Array
,
...
...
@@ -339,6 +359,12 @@ export default {
if
(
item
.
visible
===
undefined
)
{
this
.
$set
(
item
,
'
visible
'
,
true
)
}
})
loadFontFace
({
options
:
{
family
:
UNI_TABBAR_ICON_FONT
,
source
:
`url("
${
this
.
iconfontSrc
}
")`
}
})
},
beforeCreate
()
{
...
...
src/platforms/h5/service/api/ui/tab-bar.js
浏览文件 @
b3e514c2
...
...
@@ -2,7 +2,7 @@ import {
setProperties
}
from
'
uni-shared
'
const
setTabBarItemProps
=
[
'
text
'
,
'
iconPath
'
,
'
selectedIconPath
'
,
'
visible
'
]
const
setTabBarItemProps
=
[
'
text
'
,
'
iconPath
'
,
'
iconfont
'
,
'
selectedIconPath
'
,
'
visible
'
]
const
setTabBarStyleProps
=
[
'
color
'
,
'
selectedColor
'
,
'
backgroundColor
'
,
'
borderStyle
'
]
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录