Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
京东前端
nutui-react
提交
a5df2d9e
N
nutui-react
项目概览
京东前端
/
nutui-react
通知
0
Star
2
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
N
nutui-react
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
未验证
提交
a5df2d9e
编写于
1月 05, 2023
作者:
J
junjun666
提交者:
GitHub
1月 05, 2023
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
feat: watermark水印组件taro编译h5环境下适配 (#570)
上级
951e3640
变更
15
隐藏空白更改
内联
并排
Showing
15 changed file
with
82 addition
and
66 deletion
+82
-66
src/packages/barrage/barrage.taro.tsx
src/packages/barrage/barrage.taro.tsx
+1
-1
src/packages/barrage/barrage.tsx
src/packages/barrage/barrage.tsx
+1
-1
src/packages/calendaritem/calendaritem.taro.tsx
src/packages/calendaritem/calendaritem.taro.tsx
+1
-1
src/packages/circleprogress/circleprogress.taro.tsx
src/packages/circleprogress/circleprogress.taro.tsx
+2
-2
src/packages/countdown/demo.taro.tsx
src/packages/countdown/demo.taro.tsx
+1
-1
src/packages/countdown/demo.tsx
src/packages/countdown/demo.tsx
+1
-1
src/packages/drag/drag.taro.tsx
src/packages/drag/drag.taro.tsx
+1
-1
src/packages/noticebar/noticebar.taro.tsx
src/packages/noticebar/noticebar.taro.tsx
+5
-2
src/packages/noticebar/noticebar.tsx
src/packages/noticebar/noticebar.tsx
+5
-2
src/packages/notify/notify.taro.tsx
src/packages/notify/notify.taro.tsx
+1
-1
src/packages/overlay/overlay.taro.tsx
src/packages/overlay/overlay.taro.tsx
+1
-1
src/packages/overlay/overlay.tsx
src/packages/overlay/overlay.tsx
+1
-1
src/packages/toast/toast.taro.tsx
src/packages/toast/toast.taro.tsx
+1
-1
src/packages/watermark/watermark.taro.tsx
src/packages/watermark/watermark.taro.tsx
+59
-49
tsconfig.json
tsconfig.json
+1
-1
未找到文件。
src/packages/barrage/barrage.taro.tsx
浏览文件 @
a5df2d9e
...
...
@@ -67,7 +67,7 @@ const InternalBarrage: ForwardRefRenderFunction<
const
run
=
()
=>
{
clearInterval
(
timer
.
current
)
timer
.
current
=
setInterval
(()
=>
{
timer
.
current
=
window
.
setInterval
(()
=>
{
play
()
run
()
},
frequency
)
...
...
src/packages/barrage/barrage.tsx
浏览文件 @
a5df2d9e
...
...
@@ -70,7 +70,7 @@ const InternalBarrage: ForwardRefRenderFunction<
const
run
=
()
=>
{
clearInterval
(
timer
.
current
)
timer
.
current
=
setInterval
(()
=>
{
timer
.
current
=
window
.
setInterval
(()
=>
{
play
()
run
()
},
frequency
)
...
...
src/packages/calendaritem/calendaritem.taro.tsx
浏览文件 @
a5df2d9e
...
...
@@ -377,7 +377,7 @@ export const CalendarItem: FunctionComponent<
if
(
type
===
'
end
'
)
{
monthsPanel
.
current
.
style
.
webkitTransition
=
`transform
${
time
}
ms cubic-bezier(0.19, 1, 0.22, 1)`
clearTimeout
(
state
.
timer
)
state
.
timer
=
setTimeout
(()
=>
{
state
.
timer
=
window
.
setTimeout
(()
=>
{
loadScroll
()
},
time
)
}
else
{
...
...
src/packages/circleprogress/circleprogress.taro.tsx
浏览文件 @
a5df2d9e
...
...
@@ -69,13 +69,13 @@ export const CircleProgress: FunctionComponent<
const
rate
=
progress
*
(
endRate
-
startRate
)
+
startRate
setOldValue
(
Math
.
min
(
Math
.
max
(
+
rate
,
0
),
100
))
if
(
endRate
>
startRate
?
rate
<
endRate
:
rate
>
endRate
)
{
rafId
=
requestAnimationFrame
(
animate
)
rafId
=
window
.
requestAnimationFrame
(
animate
)
}
}
if
(
rafId
)
{
cancelAnimationFrame
(
rafId
)
}
rafId
=
requestAnimationFrame
(
animate
)
rafId
=
window
.
requestAnimationFrame
(
animate
)
},
[
progress
])
const
requestAnimationFrame
=
function
(
callback
:
Function
)
{
...
...
src/packages/countdown/demo.taro.tsx
浏览文件 @
a5df2d9e
...
...
@@ -35,7 +35,7 @@ const CountDownDemo = () => {
}
useEffect
(()
=>
{
stateRef
.
current
.
timer
=
setTimeout
(()
=>
{
stateRef
.
current
.
timer
=
window
.
setTimeout
(()
=>
{
setAsyncEnd
(
Date
.
now
()
+
30
*
1000
)
},
3000
)
return
()
=>
{
...
...
src/packages/countdown/demo.tsx
浏览文件 @
a5df2d9e
...
...
@@ -117,7 +117,7 @@ const CountDownDemo = () => {
}
useEffect
(()
=>
{
stateRef
.
current
.
timer
=
setTimeout
(()
=>
{
stateRef
.
current
.
timer
=
window
.
setTimeout
(()
=>
{
setAsyncEnd
(
Date
.
now
()
+
30
*
1000
)
},
3000
)
return
()
=>
{
...
...
src/packages/drag/drag.taro.tsx
浏览文件 @
a5df2d9e
...
...
@@ -123,7 +123,7 @@ export const Drag: FunctionComponent<
useEffect
(()
=>
{
eventCenter
.
once
((
getCurrentInstance
()
as
any
).
router
.
onReady
,
()
=>
{
timer
.
current
=
setTimeout
(()
=>
{
timer
.
current
=
window
.
setTimeout
(()
=>
{
getInfo
()
},
200
)
})
...
...
src/packages/noticebar/noticebar.taro.tsx
浏览文件 @
a5df2d9e
...
...
@@ -205,7 +205,10 @@ export const NoticeBar: FunctionComponent<
height
/
speed
/
4
<
1
?
Number
((
height
/
speed
/
4
).
toFixed
(
1
))
*
1000
:
~~
(
height
/
speed
/
4
)
*
1000
const
timerCurr
=
setInterval
(
showhorseLamp
,
time
+
Number
(
standTime
))
const
timerCurr
=
window
.
setInterval
(
showhorseLamp
,
time
+
Number
(
standTime
)
)
SetTimer
(
timerCurr
)
}
const
showhorseLamp
=
()
=>
{
...
...
@@ -222,7 +225,7 @@ export const NoticeBar: FunctionComponent<
}
const
startRoll
=
()
=>
{
const
timerCurr
=
setInterval
(()
=>
{
const
timerCurr
=
window
.
setInterval
(()
=>
{
const
chunk
=
100
for
(
let
i
=
0
;
i
<
chunk
;
i
++
)
{
scroll
(
i
,
!
(
i
<
chunk
-
1
))
...
...
src/packages/noticebar/noticebar.tsx
浏览文件 @
a5df2d9e
...
...
@@ -202,7 +202,10 @@ export const NoticeBar: FunctionComponent<
height
/
speed
/
4
<
1
?
Number
((
height
/
speed
/
4
).
toFixed
(
1
))
*
1000
:
~~
(
height
/
speed
/
4
)
*
1000
const
timerCurr
=
setInterval
(
showhorseLamp
,
time
+
Number
(
standTime
))
const
timerCurr
=
window
.
setInterval
(
showhorseLamp
,
time
+
Number
(
standTime
)
)
SetTimer
(
timerCurr
)
}
const
showhorseLamp
=
()
=>
{
...
...
@@ -219,7 +222,7 @@ export const NoticeBar: FunctionComponent<
}
const
startRoll
=
()
=>
{
const
timerCurr
=
setInterval
(()
=>
{
const
timerCurr
=
window
.
setInterval
(()
=>
{
const
chunk
=
100
for
(
let
i
=
0
;
i
<
chunk
;
i
++
)
{
scroll
(
i
,
!
(
i
<
chunk
-
1
))
...
...
src/packages/notify/notify.taro.tsx
浏览文件 @
a5df2d9e
...
...
@@ -74,7 +74,7 @@ export const Notify: FunctionComponent<
const
show
=
()
=>
{
clearTimer
()
if
(
duration
)
{
timer
=
setTimeout
(()
=>
{
timer
=
window
.
setTimeout
(()
=>
{
hide
()
},
duration
)
}
...
...
src/packages/overlay/overlay.taro.tsx
浏览文件 @
a5df2d9e
...
...
@@ -90,7 +90,7 @@ export const Overlay: FunctionComponent<
if
(
closeOnClickOverlay
)
{
props
.
onClick
&&
props
.
onClick
(
e
)
renderRef
.
current
=
false
const
id
=
setTimeout
(()
=>
{
const
id
=
window
.
setTimeout
(()
=>
{
setShow
(
!
visible
)
},
duration
*
1000
*
0.8
)
intervalRef
.
current
=
id
...
...
src/packages/overlay/overlay.tsx
浏览文件 @
a5df2d9e
...
...
@@ -90,7 +90,7 @@ export const Overlay: FunctionComponent<
if
(
closeOnClickOverlay
)
{
props
.
onClick
&&
props
.
onClick
(
e
)
renderRef
.
current
=
false
const
id
=
setTimeout
(()
=>
{
const
id
=
window
.
setTimeout
(()
=>
{
setShow
(
!
visible
)
},
duration
*
1000
*
0.8
)
intervalRef
.
current
=
id
...
...
src/packages/toast/toast.taro.tsx
浏览文件 @
a5df2d9e
...
...
@@ -102,7 +102,7 @@ export const Toast: FunctionComponent<
const
show
=
()
=>
{
clearTimer
()
if
(
duration
)
{
timer
=
setTimeout
(()
=>
{
timer
=
window
.
setTimeout
(()
=>
{
hide
()
},
duration
*
1000
)
}
...
...
src/packages/watermark/watermark.taro.tsx
浏览文件 @
a5df2d9e
...
...
@@ -86,60 +86,70 @@ export const WaterMark: FunctionComponent<
const
init
=
()
=>
{
let
ratio
=
1
Taro
.
getSystemInfo
({
success
(
res
)
{
ratio
=
res
.
pixelRatio
},
})
const
canvasWidth
=
`
${(
gapX
+
width
)
*
ratio
}
px`
const
canvasHeight
=
`
${(
gapY
+
height
)
*
ratio
}
px`
const
markWidth
=
width
*
ratio
const
markHeight
=
height
*
ratio
const
canvas
:
any
=
Taro
.
createOffscreenCanvas
({
type
:
'
2d
'
,
width
:
Number
(
canvasWidth
),
height
:
Number
(
canvasHeight
),
})
const
ctx
:
any
=
canvas
.
getContext
(
'
2d
'
)
Taro
.
getSystemInfo
().
then
((
res
)
=>
{
ratio
=
res
.
pixelRatio
const
canvasWidth
=
`
${(
gapX
+
width
)
*
ratio
}
px`
const
canvasHeight
=
`
${(
gapY
+
height
)
*
ratio
}
px`
const
markWidth
=
width
*
ratio
const
markHeight
=
height
*
ratio
let
ctx
:
any
let
canvas
:
any
if
(
process
.
env
.
TARO_ENV
===
'
h5
'
)
{
canvas
=
document
.
createElement
(
'
canvas
'
)
ctx
=
canvas
.
getContext
(
'
2d
'
)
canvas
.
setAttribute
(
'
width
'
,
canvasWidth
)
canvas
.
setAttribute
(
'
height
'
,
canvasHeight
)
}
else
{
canvas
=
Taro
.
createOffscreenCanvas
({
type
:
'
2d
'
,
width
:
Number
(
canvasWidth
),
height
:
Number
(
canvasHeight
),
})
ctx
=
canvas
.
getContext
(
'
2d
'
)
}
if
(
ctx
)
{
if
(
image
)
{
ctx
.
translate
(
markWidth
/
2
,
markHeight
/
2
)
ctx
.
rotate
((
Math
.
PI
/
180
)
*
Number
(
rotate
))
if
(
ctx
)
{
if
(
image
)
{
ctx
.
translate
(
markWidth
/
2
,
markHeight
/
2
)
ctx
.
rotate
((
Math
.
PI
/
180
)
*
Number
(
rotate
))
const
img
=
canvas
.
createImage
()
img
.
crossOrigin
=
'
anonymous
'
img
.
referrerPolicy
=
'
no-referrer
'
img
.
src
=
image
img
.
onload
=
()
=>
{
ctx
.
drawImage
(
img
,
(
-
imageWidth
*
ratio
)
/
2
,
(
-
imageHeight
*
ratio
)
/
2
,
imageWidth
*
ratio
,
imageHeight
*
ratio
)
ctx
.
restore
()
let
img
:
any
if
(
process
.
env
.
TARO_ENV
===
'
h5
'
)
{
img
=
new
Image
()
}
else
{
img
=
canvas
.
createImage
()
}
img
.
crossOrigin
=
'
anonymous
'
img
.
referrerPolicy
=
'
no-referrer
'
img
.
src
=
image
img
.
onload
=
()
=>
{
ctx
.
drawImage
(
img
,
(
-
imageWidth
*
ratio
)
/
2
,
(
-
imageHeight
*
ratio
)
/
2
,
imageWidth
*
ratio
,
imageHeight
*
ratio
)
ctx
.
restore
()
setBase64Url
(
canvas
.
toDataURL
())
}
}
else
if
(
content
)
{
ctx
.
textBaseline
=
'
middle
'
// 设置或返回在绘制文本时使用的当前文本基线。(正中)
ctx
.
textAlign
=
'
center
'
// 设置或返回文本内容的当前对齐方式。
// 文字绕中间旋转
ctx
.
translate
(
markWidth
/
2
,
markHeight
/
2
)
ctx
.
rotate
((
Math
.
PI
/
180
)
*
Number
(
rotate
))
const
markSize
=
Number
(
fontSize
)
*
ratio
ctx
.
font
=
`
${
fontStyle
}
normal
${
fontWeight
}
${
markSize
}
px/
${
markHeight
}
px
${
fontFamily
}
`
ctx
.
fillStyle
=
fontColor
ctx
.
fillText
(
content
,
0
,
0
)
// 在画布上绘制"被填充的"文本。
ctx
.
restore
()
// 返回之前保存过的路径状态和属性。
setBase64Url
(
canvas
.
toDataURL
())
}
}
else
if
(
content
)
{
ctx
.
textBaseline
=
'
middle
'
// 设置或返回在绘制文本时使用的当前文本基线。(正中)
ctx
.
textAlign
=
'
center
'
// 设置或返回文本内容的当前对齐方式。
// 文字绕中间旋转
ctx
.
translate
(
markWidth
/
2
,
markHeight
/
2
)
ctx
.
rotate
((
Math
.
PI
/
180
)
*
Number
(
rotate
))
const
markSize
=
Number
(
fontSize
)
*
ratio
ctx
.
font
=
`
${
fontStyle
}
normal
${
fontWeight
}
${
markSize
}
px/
${
markHeight
}
px
${
fontFamily
}
`
ctx
.
fillStyle
=
fontColor
ctx
.
fillText
(
content
,
0
,
0
)
// 在画布上绘制"被填充的"文本。
ctx
.
restore
()
// 返回之前保存过的路径状态和属性。
setBase64Url
(
canvas
.
toDataURL
())
}
else
{
throw
new
Error
(
locale
.
watermark
.
errorCanvasTips
)
}
}
else
{
throw
new
Error
(
locale
.
watermark
.
errorCanvasTips
)
}
})
}
return
(
...
...
tsconfig.json
浏览文件 @
a5df2d9e
...
...
@@ -3,7 +3,7 @@
"baseUrl"
:
"."
,
"rootDir"
:
"."
,
"target"
:
"ESNext"
,
"types"
:
[
"vite/client"
,
"jest"
],
"types"
:
[
"vite/client"
,
"jest"
,
"node"
],
"allowJs"
:
false
,
"declaration"
:
true
,
"declarationDir"
:
"./dist/esm/types"
,
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录