Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
CoderSmallfan
uni-app
提交
2a4f7467
U
uni-app
项目概览
CoderSmallfan
/
uni-app
与 Fork 源项目一致
Fork自
DCloud / uni-app
通知
1
Star
1
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
1
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
U
uni-app
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
1
Issue
1
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
2a4f7467
编写于
12月 17, 2018
作者:
郭
郭胜强
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
feat: 实现API:uni.canvasToTempFilePath
上级
53c6a2a9
变更
3
显示空白变更内容
内联
并排
Showing
3 changed file
with
122 addition
and
7 deletion
+122
-7
src/core/helpers/protocol/canvas.js
src/core/helpers/protocol/canvas.js
+46
-1
src/core/service/api/context/canvas.js
src/core/service/api/context/canvas.js
+68
-5
src/core/view/components/canvas/index.vue
src/core/view/components/canvas/index.vue
+8
-1
未找到文件。
src/core/helpers/protocol/canvas.js
浏览文件 @
2a4f7467
...
...
@@ -43,7 +43,52 @@ export const canvasPutImageData = {
required
:
true
},
height
:
{
type
:
Number
}
}
const
fileType
=
{
PNG
:
'
PNG
'
,
JPG
:
'
JPG
'
}
export
const
canvasToTempFilePath
=
{
x
:
{
type
:
Number
,
default
:
0
},
y
:
{
type
:
Number
,
default
:
0
},
width
:
{
type
:
Number
},
height
:
{
type
:
Number
},
destWidth
:
{
type
:
Number
},
destHeight
:
{
type
:
Number
},
canvasId
:
{
type
:
String
,
require
:
true
},
fileType
:
{
type
:
String
,
validator
(
value
,
params
)
{
value
=
(
value
||
''
).
toUpperCase
()
params
.
fileType
=
Object
.
values
(
fileType
).
indexOf
(
value
)
<
0
?
fileType
.
PNG
:
value
}
},
quality
:
{
type
:
Number
,
required
:
false
validator
(
value
,
params
)
{
value
=
Math
.
floor
(
value
)
params
.
quality
=
value
>
0
&&
value
<
1
?
value
:
1
}
}
}
src/core/service/api/context/canvas.js
浏览文件 @
2a4f7467
...
...
@@ -252,7 +252,15 @@ var methods3 = ['setFillStyle', 'setTextAlign', 'setStrokeStyle', 'setGlobalAlph
'
setFontSize
'
,
'
setLineCap
'
,
'
setLineJoin
'
,
'
setLineWidth
'
,
'
setMiterLimit
'
,
'
setTextBaseline
'
,
'
setLineDash
'
]
var
c2d
var
tempCanvas
function
getTempCanvas
()
{
if
(
!
tempCanvas
)
{
tempCanvas
=
document
.
createElement
(
'
canvas
'
)
}
return
tempCanvas
}
class
CanvasContext
{
constructor
(
id
,
pageId
)
{
this
.
id
=
id
...
...
@@ -306,10 +314,7 @@ class CanvasContext {
}
}
measureText
(
text
)
{
if
(
!
c2d
)
{
let
canvas
=
document
.
createElement
(
'
canvas
'
)
c2d
=
canvas
.
getContext
(
'
2d
'
)
}
var
c2d
=
getTempCanvas
().
getContext
(
'
2d
'
)
c2d
.
font
=
this
.
state
.
font
return
new
TextMetrics
(
c2d
.
measureText
(
text
).
width
||
0
)
}
...
...
@@ -637,3 +642,61 @@ export function canvasPutImageData ({
callbackId
:
cId
})
}
export
function
canvasToTempFilePath
({
x
,
y
,
width
,
height
,
destWidth
,
destHeight
,
canvasId
,
fileType
,
qualit
},
callbackId
)
{
var
pageId
const
app
=
getApp
()
if
(
app
.
$route
&&
app
.
$route
.
params
.
__id__
)
{
pageId
=
app
.
$route
.
params
.
__id__
}
else
{
invoke
(
callbackId
,
{
errMsg
:
'
canvasPutImageData:fail
'
})
return
}
var
cId
=
canvasEventCallbacks
.
push
(
function
(
data
)
{
var
imgData
=
data
.
data
if
(
!
imgData
||
!
imgData
.
length
)
{
invoke
(
callbackId
,
{
errMsg
:
'
canvasToTempFilePath:fail
'
})
return
}
imgData
=
new
ImageData
(
new
Uint8ClampedArray
(
imgData
),
data
.
width
,
data
.
height
)
var
canvas
=
getTempCanvas
()
canvas
.
width
=
data
.
width
canvas
.
height
=
data
.
height
var
c2d
=
canvas
.
getContext
(
'
2d
'
)
c2d
.
putImageData
(
imgData
,
0
,
0
)
var
base64
=
canvas
.
toDataURL
(
'
image/png
'
)
var
img
=
new
Image
()
img
.
onload
=
function
()
{
canvas
.
width
=
destWidth
||
imgData
.
width
canvas
.
height
=
destHeight
||
imgData
.
height
c2d
.
drawImage
(
img
,
0
,
0
)
base64
=
canvas
.
toDataURL
(
`image/
${
fileType
.
toLowerCase
()}
`
,
qualit
)
invoke
(
callbackId
,
{
errMsg
:
'
canvasToTempFilePath:ok
'
,
tempFilePath
:
base64
})
}
img
.
src
=
base64
})
operateCanvas
(
canvasId
,
pageId
,
'
getImageData
'
,
{
x
,
y
,
width
,
height
,
callbackId
:
cId
})
}
src/core/view/components/canvas/index.vue
浏览文件 @
2a4f7467
...
...
@@ -327,8 +327,15 @@ export default {
callbackId
})
{
var
imgData
var
canvas
=
this
.
$refs
.
canvas
if
(
!
width
)
{
width
=
canvas
.
width
}
if
(
!
height
)
{
height
=
canvas
.
height
}
try
{
imgData
=
this
.
$refs
.
canvas
.
getContext
(
'
2d
'
).
getImageData
(
x
,
y
,
width
,
height
)
imgData
=
canvas
.
getContext
(
'
2d
'
).
getImageData
(
x
,
y
,
width
,
height
)
}
catch
(
error
)
{
UniViewJSBridge
.
publishHandler
(
'
onCanvasMethodCallback
'
,
{
callbackId
,
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录