在线带壳截图工具

您所在的位置:网站首页 带壳截屏有什么用 在线带壳截图工具

在线带壳截图工具

2024-01-16 09:58| 来源: 网络整理| 查看: 265

在线制作带壳截图,支持多品牌手机、平板、智能手表。支持炫酷的带壳截图功能,无论你是什么机型基本都支持,只需提前设置好手机型号,即可即可开始你的截图之旅。

代码片段

methods: { onloadimg: function(width, height, image, image_path) { this.setData({ userImage: image_path, userImageWidth: width, userImageHeight: height, userImageK: image }); var that = this; image > 2 ? (this.selectedBgItem =this.bgSrc[3]): (this.selectedBgItem= this.bgSrc[0]); uni.getSystemInfo({ success: function(e) { that.setData({ screenWidth: e.screenWidth, screenHeight: e.screenHeight, windowHeight: e.windowHeight, pixelRatio: e.pixelRatio }), that.findPosition(0); } }) }, //变更手机壳 changeBg: function(e) { this.findPosition(e.detail.value[0]), this.radioChange(e.detail.value[1]); }, radioChange: function(e) { var a = e; if (a != this.selectedBgItem.selectedSrcIndex) { for (var t = 0; t < this.selectedBgItem.srcs.length; ++t) { var c = this.selectedBgItem.srcs[t]; t == a ? (c.checked = !0, this.selectedBgItem.selectedSrcIndex = a, this.selectedBgItem.selectedSrc = c.src) : c.checked = !1; } this.setData({ selectedBgItem: this.selectedBgItem }); } }, bindMultiPickerColumnChange: function(a) { var t = a.detail.column, c = a.detail.value; 0 == t && this.getcolor(c), this.multiIndex[t]=c; }, createPic: function() { uni.showLoading({ title: "图片保存中" }); var e = this.selectedBgItem, a = e.selectedSrcIndex; // if (e.srcs[a].isCDN) { var t = this; uni.getImageInfo({ src: e.srcs[a].src, success: function(a) { uni.saveFile({ tempFilePath: a.path, success: function(a) { e.selectedSrc = a.savedFilePath, t.redrawCanvas(); } }); } }); // } else this.redrawCanvas(); //this.redrawCanvas(); }, redrawCanvas: function() { var e = this; new Promise(function(a) { e.setUpCanvas(); var t = e; var c = t.selectedBgItem.originBgFrame, i = t.selectedBgItem.originPicFrame, n = t.selectedBgItem.originBgOffset, s = i[3] / i[2], r = 0, l = 0, o = i[2], g = i[3]; s > t.userImageK ? (g = t.userImageHeight * i[2] / t.userImageWidth, l = (i[3] - g) / 2) : (o = t.userImageWidth * i[3] / t.userImageHeight, r = (i[2] - o) / 2); var u = uni.createCanvasContext("myCanvas"); u.clearRect(0, 0, c[2] + 2 * n[0], c[3] + 2 * n[1]), u.fillStyle = "#ffffff", u.fillRect(0, 0, c[2] + 2 * n[0], c[3] + 2 * n[1]), u.fillStyle = "#000000", u.fillRect(n[0] + i[0], n[1] + i[1], i[2], i[3]), u.drawImage(t.userImage, n[0] + i[0] + r, n[1] + i[1] + l, o, g), u.drawImage(t.selectedBgItem.selectedSrc, 0, 0, c[2], c[3], n[0], n[1], c[2], c[3]), u.draw(), setTimeout(function() { return a(); }, 1e3); }).then(function() { uni.hideLoading(), uni.canvasToTempFilePath({ canvasId: "myCanvas", success: function(a) { var t = a.tempFilePath; FK.Utils.USaveImage(t); } }); }, this); }, //设置画布宽和高 setUpCanvas: function() { var e = this.selectedBgItem; this.canvasWidth = e.originBgFrame[2] + 2 * e.originBgOffset[0]; this.canvasHeight = e.originBgFrame[3] + 2 * e.originBgOffset[1]; }, findPosition: function(e) { var a = this.bgSrc[e], t = a.originBgFrame[2], c = a.originBgFrame[3], i = a.originPicFrame[2], n = a.originPicFrame[3], s = a.originPicFrame[0], r = a.originPicFrame[1], l = this.windowHeight - 220 / this.pixelRatio, o = (.6 * this.screenWidth - this.bgMarginLeft) / t, g = l / c; g < o && (o = g); var u = s * o - Math.floor(s * o), h = r * o - Math.floor(r * o), d = Math.round(i * o) - i * o, m = Math.round(n * o) - n * o; t = Math.round(t * o), c = Math.round(c * o), i = Math.round(i * o), n = Math.round(n * o), s = Math.floor(s * o), r = Math.floor(r * o), u >= d && i++, h >= m && n++; var p = (l - c) / 2; this.setData({ selectedBgItem: a, bgWidth: t, bgHeight: c, picWidth: i, picHeight: n, marginLeft: s, marginTop: r, bgMarginTop: p, cus_left:a.marginLeft || "0px" }); console.log("bgMarginTop = "+p+", marginTop = "+r+" ,marginLeft = "+s); }, goAlbum: function() { var e = this; uni.chooseImage({ count: 1, sourceType: [ "album" ], sizeType: [ "original" ], success: function(res) { let path = res.tempFilePaths[0]; FK.AApi.A_CHECK_IMG(path,function(){ uni.getImageInfo({ src: path, success: function(a) { var t = a.height / a.width; e.onloadimg(a.width, a.height, t, a.path); } }); }); } }); }, }

 带壳截图在线生成器 - 一刀工具箱APP在线制作带壳截图,支持多品牌手机、平板、智能手表。支持炫酷的带壳截图功能,无论你是什么机型基本都支持,只需提前设置好手机型号,即可即可开始你的截图之旅。icon-default.png?t=M666https://tools.yidaotool.com/phones



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3