Commit 0f26777965539bdd9a2dd3a57a10a9126b1b895d

Authored by 后端研发-倪永富
1 parent 4642cf56

直播列表添加显示时间和主播,直播详情生成和保存海报图片

packageA/pages/liveStream/liveStream.wxml
... ... @@ -9,19 +9,18 @@
9 9 <block wx:for="{{live.toBegin}}">
10 10 <view class="list-item" data-id="{{item.id}}" data-live="toBegin" catchtap="clickItem">
11 11 <view class="list-item-left">
12   - <image src="{{item.cover_img}}" class="item-pic" mode="aspectFill"></image>
13   - <!-- <view class="item-desc">
14   - <view>{{item.name}}</view>
15   - <view>{{filter.format_time(item.start_time)}}</view>
16   - </view> -->
  12 + <image src="{{item.share_img}}" class="item-pic" mode="aspectFill"></image>
17 13 </view>
18 14 <view class="list-item-right">
19   - <view class="item-title">{{item.name}}</view>
  15 + <view>
  16 + <view class="item-title">{{item.name}}</view>
  17 + <view class="item-time">{{filter.format_time(item.start_time, 2)}} 开始</view>
  18 + <view></view>
  19 + </view>
20 20 <subscribe room-id="{{item.roomid}}" stopPropagation="{{true}}"></subscribe>
21 21 </view>
22   -
23 22 </view>
24   -
  23 +
25 24 </block>
26 25 </view>
27 26 </block>
... ... @@ -34,7 +33,7 @@
34 33 <block wx:for="{{live.ing}}">
35 34 <view class="list-item" catchtap="clickItem" data-id="{{item.id}}" data-live="ing">
36 35 <view class="list-item-left">
37   - <image src="{{item.cover_img}}" class="item-pic" mode="aspectFill"></image>
  36 + <image src="{{item.share_img}}" class="item-pic" mode="aspectFill"></image>
38 37 </view>
39 38 <view class="list-item-right">
40 39 <view class="item-title">{{item.name}}</view>
... ... @@ -53,10 +52,14 @@
53 52 <block wx:for="{{live.over}}">
54 53 <view class="list-item" bindtap="clickItem" data-id="{{item.id}}" data-live="over">
55 54 <view class="list-item-left">
56   - <image src="{{item.cover_img}}" class="item-pic" mode="aspectFill"></image>
  55 + <image src="{{item.share_img}}" class="item-pic" mode="aspectFill"></image>
57 56 </view>
58 57 <view class="list-item-right">
59   - <view class="item-title">{{item.name}}</view>
  58 + <view>
  59 + <view class="item-title">{{item.name}}</view>
  60 + <view class="item-time">{{filter.format_time(item.start_time, 2)}} 开始</view>
  61 + <view class="item-anchor">主播:{{item['anchor_name']}}</view>
  62 + </view>
60 63 <view class="item-btn" catchtap="clickLive" data-roomid="{{item.roomid}}">观看回放</view>
61 64 </view>
62 65 </view>
... ...
packageA/pages/liveStream/liveStream.wxss
... ... @@ -9,8 +9,8 @@
9 9 }
10 10 .list-item-left {
11 11 position: relative;
12   - width: 300rpx;
13   - height: 300rpx;
  12 + width: 340rpx;
  13 + height: 220rpx;
14 14 flex-shrink: 0;
15 15 }
16 16 .list-item-right {
... ... @@ -55,9 +55,18 @@
55 55  
56 56 display: -webkit-box;
57 57 -webkit-box-orient: vertical;
58   - -webkit-line-clamp: 4;
  58 + -webkit-line-clamp: 2;
59 59 overflow: hidden;
60 60 }
  61 +.item-time {
  62 + color: #999;
  63 + font-size: 22rpx;
  64 + padding-top: 10rpx;
  65 +}
  66 +.item-anchor {
  67 + color: #999;
  68 + font-size: 22rpx;
  69 +}
61 70  
62 71 .item-btn {
63 72 width: 172rpx;
... ...
packageA/pages/liveStreamDetails/liveStreamDetails.js
... ... @@ -29,7 +29,11 @@ Page({
29 29 nickName: '',
30 30 avatarUrl: '',
31 31 coverImg: '',
32   - canvasToImgPath: ''
  32 + canvasToImgPath: '',
  33 + screenWidth: 0,
  34 + canvasHidden: 1,
  35 + gid: '',
  36 + shareImgPath: ''
33 37 },
34 38  
35 39 // 点击商品
... ... @@ -64,16 +68,15 @@ Page({
64 68 //生成海报
65 69 createPlaybill: function () {
66 70 // 1.提示 “正在生成海报...”
67   - wx.showLoading({
68   - title: '正在生成海报...'
69   - });
  71 +
70 72 // 2.生成海报,如果生成完毕,关闭提示
71 73 this.drawPlaybill();
72 74 // 3.展示生成的海报
73 75 this.setData({
74   - showPlaybill: !this.data.showPlaybill,
75   - showActionSheet: 'false'
  76 + showActionSheet: 'false',
  77 + showPlaybill: !this.data.showPlaybill
76 78 });
  79 +
77 80 },
78 81  
79 82 // 获取设备信息
... ... @@ -84,150 +87,153 @@ Page({
84 87 that.setData({
85 88 windowWidth: res.windowWidth,
86 89 windowHeight: res.windowHeight,
  90 + screenWidth: res.screenWidth,
87 91 dpr: res.pixelRatio
88 92 })
89 93 }
90 94 });
  95 + console.log('宽度',this.data.windowWidth);
  96 + console.log('高度',this.data.windowHeight);
91 97 },
92 98  
93   - //文本换行 参数:1、canvas对象,2、文本 3、距离左侧的距离 4、距离顶部的距离 5、6、文本的宽度
94   - drawText: function(ctx, str, leftWidth, initHeight, titleHeight, canvasWidth, unit) {
95   - var lineWidth = 0;
96   - var lastSubStrIndex = 0; //每次开始截取的字符串的索引
97   - var han = 0;
98   - for (let i = 0; i < str.length; i++) {
99   - if (han == 2) return;
100   - //lineWidth += ctx.measureText(str[i]).width;
101   - lineWidth += ut.measureText(str[i], 21.3 * unit);
102   - if (lineWidth > canvasWidth) {
103   - han++;
104   -
105   - if (han == 2) {
106   - ctx.textAlign = 'justify';
107   - ctx.fillText(str.substring(lastSubStrIndex, i) + '...', leftWidth, initHeight); //绘制截取部分
108   - } else {
109   - ctx.textAlign = 'justify';
110   - ctx.fillText(str.substring(lastSubStrIndex, i), leftWidth, initHeight);
111   - }
112   - initHeight += 22; //22为字体的高度
113   - lineWidth = 0;
114   - lastSubStrIndex = i;
115   - titleHeight += 20;
116   - }
117   - if (i == str.length - 1) { //绘制剩余部分
118   - ctx.textAlign = 'justify';
119   - ctx.fillText(str.substring(lastSubStrIndex, i + 1), leftWidth, initHeight);
120   - }
  99 +//文本换行 参数:1、canvas对象,2、文本 3、距离左侧的距离 4、距离顶部的距离 5、6、文本的宽度
  100 +drawText: function(ctx, str, leftWidth, initHeight, titleHeight, canvasWidth, unit) {
  101 + var lineWidth = 0;
  102 + var lastSubStrIndex = 0; //每次开始截取的字符串的索引
  103 + var han = 0;
  104 + for (let i = 0; i < str.length; i++) {
  105 + if (han == 2) return;
  106 + //lineWidth += ctx.measureText(str[i]).width;
  107 + lineWidth += ut.measureText(str[i], 21.3 * unit);
  108 + if (lineWidth > canvasWidth) {
  109 + han++;
  110 +
  111 + if (han == 2) {
  112 + ctx.textAlign = 'justify';
  113 + ctx.fillText(str.substring(lastSubStrIndex, i) + '...', leftWidth, initHeight); //绘制截取部分
  114 + } else {
  115 + ctx.textAlign = 'justify';
  116 + ctx.fillText(str.substring(lastSubStrIndex, i), leftWidth, initHeight);
121 117 }
122   - },
  118 + initHeight += 22; //22为字体的高度
  119 + lineWidth = 0;
  120 + lastSubStrIndex = i;
  121 + titleHeight += 20;
  122 + }
  123 + if (i == str.length - 1) { //绘制剩余部分
  124 + ctx.textAlign = 'justify';
  125 + ctx.fillText(str.substring(lastSubStrIndex, i + 1), leftWidth, initHeight);
  126 + }
  127 + }
  128 +},
123 129  
124 130 // 生成海报
125 131 drawPlaybill: function () {
126   - var that = this
127   - // 适配屏get幕
128   - let scale = this.data.windowWidth / 375.0
129   -
130   - this.setData({ totalHeight: 667*scale})
131   - // 获取Canvas
132   - let ctx = wx.createCanvasContext('myCanvas')
133   -
134   - // 放大 因为不放大的话,生成的分享图会模糊。暂时先注释
135   - ctx.scale(this.data.canvasScale, this.data.canvasScale)
  132 + wx.showLoading({
  133 + title: '正在生成海报...'
  134 + });
136 135  
137   - // var path3 = os.url + "/api/wx/open/app/user/getWeAppEwm/" +
138   - // os.stoid;
  136 + // 数据准备
  137 + const title = this.data.details.name;
  138 + // const headImg = app.globalData.userInfo['head_pic'];
  139 + const that = this;
  140 +
  141 + // console.log('----------------v', headImg);
139 142  
140 143 var path3 = os.url + "/api/wx/open/app/user/getWeAppEwm/" +
141 144 os.stoid + "?sceneValue=1012" + "&pageValue=pages/goods/goodsInfo/goodsInfo";
142   - + "?sceneValue=1012" + "&pageValue=packageA/pages/liveStreamDetails/liveStreamDetails"
143   - // console.log('path3---->', path3);
  145 +
  146 + // 以iPhone6为例,375/750 = 0.5
  147 + // let scale = this.data.windowWidth / 375;
  148 + let scale = this.data.screenWidth / 750 * 1.35
144 149  
145 150  
146   - // 绘制主背景白色
147   - ctx.setFillStyle('#ffffff')
148   - ctx.fillRect(0, 0, this.data.windowWidth, this.data.totalHeight)
149   - ctx.draw(true);
  151 + // 适配屏get幕
  152 + // let scale = this.data.windowWidth / 375.0;
  153 + // this.setData({totalHeight: 667 * scale});
  154 +
  155 + // 获取Canvas
  156 + let ctx = wx.createCanvasContext('myCanvas');
150 157  
  158 + // 放大 因为不放大的话,生成的分享图会模糊。暂时先注释
  159 + // ctx.scale(this.data.canvasScale, this.data.canvasScale)
  160 +
151 161  
152   - const coverImag = this.data.details['cover_img'];
153   - const title = this.data.details.name;
154   - console.log('detail--->', this.data.details);
155 162  
  163 + // var path3 = os.url + "/api/wx/open/app/user/getWeAppEwm/" +
  164 + // os.stoid + "?sceneValue=1012" + "&pageValue=pages/goods/goodsInfo/goodsInfo";
  165 + // + "?sceneValue=1012" + "&pageValue=packageA/pages/liveStreamDetails/liveStreamDetails"
  166 + // console.log('path3---->', path3);
156 167  
157   - //绘制头像
158   - wx.getImageInfo({
159   - src: that.data.avatarUrl,
160   - success: function(res) {
161   - ctx.save();
162   - ctx.beginPath();
163   - ctx.arc(29*scale, 27*scale, 14*scale, 0, 2*Math.PI);
164   - ctx.clip();
165   - ctx.drawImage(res.path, 15*scale, 13*scale, 28*scale, 28*scale);
166   - ctx.restore()
167   - ctx.draw(true);
168   - }
169   - })
  168 +
  169 + // 绘制主背景白色
  170 + ctx.setFillStyle('#ffffff');
  171 + ctx.fillRect(0, 0, 480, 738);
  172 +
  173 + // 绘制头像
  174 + ctx.save();
  175 + ctx.beginPath();
  176 + ctx.arc(58, 63, 28, 0, 2*Math.PI);
  177 + ctx.clip();
  178 + // console.log('1__________________>',app.globalData.userInfo['head_pic']);
  179 + ctx.drawImage(this.data.avatarUrl, 30, 35, 56, 56);
  180 + ctx.restore();
170 181  
171 182 // 绘制昵称
172   - ctx.setFontSize(12*scale);
  183 + ctx.setFontSize(14);
173 184 ctx.setFillStyle('#ADADAD');
174   - ctx.fillText(this.data.nickName, 54*scale, 32*scale);
  185 + ctx.fillText(this.data.nickName, 106, 68);
175 186  
176   - //绘制主图
177   - wx.getImageInfo({
178   - src: coverImag,
179   - success: function(res) {
180   - ctx.drawImage(res.path, 0, 52*scale, 240*scale, 191*scale);
181   - ctx.draw(true);
182   - }
183   - })
  187 + // 绘制主图
  188 + ctx.drawImage(this.data.coverImg, 0, 104, 480, 382);
  189 + // ctx.draw(true);
184 190  
185   - //绘制文字
186   - ctx.setFontSize(14*scale);
  191 + // 绘制文字
  192 + ctx.setFontSize(24);
187 193 ctx.setFillStyle('#1E1E1E');
188   - // ctx.fillText(title, 10*scale, 281*scale, 97*scale);
189   - this.drawText(ctx, title, 10*scale, 281*scale, 130*scale, 130*scale, scale);
190   - // ctx.draw(true);
  194 + this.drawText(ctx, '发的电视剧覅是覅世界佛教阿松i范吉奥i是房间都是金佛ex哎', 51, 563, 300, 300, 2);
191 195  
192   - //绘制小程序码
193   - wx.getImageInfo({
194   - src: path3,
195   - success: function(res) {
196   - ctx.drawImage(res.path, 152*scale, 262*scale, 66*scale, 66*scale);
197   - ctx.draw(true);
198   - }
199   - })
  196 + // 绘制小程序码
  197 + ctx.drawImage(this.data.ewm, 310, 525, 132, 132);
  198 + // ctx.draw(true);
200 199  
201   - //绘制文字:常按识别
202   - ctx.setFontSize(14*scale);
  200 + //绘制文字:长按识别
  201 + ctx.setFontSize(20);
203 202 ctx.setFillStyle('#1E1E1E');
204   - ctx.fillText('长按识别小程序', 135*scale, 350*scale);
205   -
  203 + ctx.fillText('长按识别小程序', 309, 675);
206 204  
207   - //把画板内容绘制成图片,并回调 画板图片路径
208 205 ctx.draw(true, function() {
209 206 setTimeout(function() {
  207 + console.log("我进来了~~~~~");
210 208 wx.canvasToTempFilePath({
211 209 x: 0,
212 210 y: 0,
213   - destWidth: that.data.windowWidth*2,
214   - destHeight: that.data.windowHeight*2,
215   - fileType: 'jpg',
216   - quality: 1,
  211 + width: 750,
  212 + height: 1217,
  213 + destWidth: 750,
  214 + destHeight: 1217,
217 215 canvasId: 'myCanvas',
  216 + fileType: 'jpg',
218 217 success: function(res) {
219 218 wx.hideLoading();
220 219 that.setData({
221   - canvasToImgPath: res.tempFilePath,
  220 + canvasToImgPath: res.tempFilePath
222 221 });
223   - console.log(res.tempFilePath);
  222 + // that.saveImageToPhotosAlbum(res.tempFilePath);
  223 + console.log('截图陈宫:', that.data.canvasToImgPath);
  224 + // wx.previewImage({
  225 + // //将图片预览出来
  226 + // urls: [that.data.canvasToImgPath]
  227 + // });
224 228 }
225 229 })
226   - }, 3000)
  230 + }, 1000)
227 231 });
228   - },
229 232  
230   -
  233 +
  234 +
  235 + },
  236 +
231 237  
232 238 //点击观看直播
233 239 clickBtn: function () {
... ... @@ -240,17 +246,18 @@ Page({
240 246  
241 247 // 保存图片到手机
242 248 onSaveToPhone() {
  249 + var self = this;
243 250 // 获取用户的当前设置,返回值中有小程序已经向用户请求过的权限
244 251 this.getSetting().then((res) => {
245 252 // 判断用户是否授权了保存到相册的权限,如果没有发起授权
246 253 if (!res.authSetting['scope.writePhotosAlbum']) {
247 254 this.authorize().then(() => {
248 255 // 同意授权后保存下载文件
249   - this.savedownloadFile(this.data.canvasToImgPath)
  256 + this.saveImageToPhotosAlbum(self.data.canvasToImgPath)
250 257 })
251 258 } else {
252 259 // 如果已经授权,保存下载文件
253   - this.savedownloadFile(this.data.canvasToImgPath)
  260 + this.saveImageToPhotosAlbum(self.data.canvasToImgPath)
254 261 }
255 262 })
256 263 },
... ... @@ -259,7 +266,7 @@ Page({
259 266 onOpenSetting() {
260 267 wx.openSetting({
261 268 success:(res) => {
262   - console.log(res.authSetting)
  269 + // console.log(res.authSetting)
263 270 }
264 271 })
265 272 },
... ... @@ -269,7 +276,6 @@ Page({
269 276 return new Promise((resolve, reject) => {
270 277 wx.getSetting({
271 278 success: res => {
272   - console.log('getting---->', res);
273 279 resolve(res)
274 280 }
275 281 })
... ... @@ -286,7 +292,7 @@ Page({
286 292 scope: 'scope.writePhotosAlbum',
287 293 // 同意授权
288 294 success: () => {
289   - resolve()
  295 + resolve();
290 296 },
291 297 // 拒绝授权,这里是用户拒绝授权后的回调
292 298 fail: res => {
... ... @@ -298,10 +304,10 @@ Page({
298 304 duration: 1000
299 305 })
300 306 } else {
301   - this.showModal()
  307 + this.showModal();
302 308 }
303 309 console.log('拒绝授权');
304   - reject()
  310 + reject();
305 311 }
306 312 })
307 313 })
... ... @@ -311,12 +317,14 @@ Page({
311 317 savedownloadFile(img) {
312 318 this.downLoadFile(img).then((res) => {
313 319 return this.saveImageToPhotosAlbum(res.tempFilePath)
314   - }).then(() => {
  320 + }).then(() => {
  321 + // resolve()
315 322 })
316 323 },
317 324  
318 325 //单文件下载(下载文件资源到本地),客户端直接发起一个 HTTPS GET 请求,返回文件的本地临时路径。
319 326 downLoadFile(img) {
  327 + var self = this;
320 328 return new Promise((resolve, reject) => {
321 329 wx.showLoading({
322 330 title: '保存中...',
... ... @@ -325,8 +333,7 @@ Page({
325 333 wx.downloadFile({
326 334 url: img,
327 335 success: (res) => {
328   - console.log('downloadfile', res)
329   - resolve(res)
  336 + resolve(res);
330 337 }
331 338 })
332 339 })
... ... @@ -346,7 +353,13 @@ Page({
346 353 self.setData({
347 354 showPlaybill: 'true'
348 355 });
349   - resolve()
  356 + resolve();
  357 + },
  358 + fail: () => {
  359 + wx.showToast({
  360 + title: '保存失败',
  361 + duration: 1000,
  362 + });
350 363 }
351 364 })
352 365 })
... ... @@ -384,6 +397,34 @@ Page({
384 397 that.setData({
385 398 details: obj
386 399 })
  400 +
  401 +
  402 + // 请求主图
  403 + that.getImageInfo(that.data.details['cover_img']).then(res => {
  404 + that.setData({
  405 + coverImg: res.path
  406 + });
  407 + console.log('主图加载成功~')
  408 + });
  409 +
  410 + // 请求头像
  411 + that.getImageInfo(app.globalData.userInfo['head_pic']).then(res => {
  412 + that.setData({
  413 + avatarUrl: res.path
  414 + });
  415 + console.log('头像加载成功~')
  416 + });
  417 +
  418 + // 请求二维码
  419 + var path3 = os.url + "/api/wx/open/app/user/getWeAppEwm/" +
  420 + os.stoid + "?sceneValue=1012" + "&pageValue=pages/goods/goodsInfo/goodsInfo";
  421 + that.getImageInfo(path3).then(res => {
  422 + that.setData({
  423 + ewm: res.path
  424 + });
  425 + console.log('二维码加载成功~')
  426 + });
  427 +
387 428 }
388 429 })
389 430  
... ... @@ -409,22 +450,21 @@ Page({
409 450 }
410 451  
411 452 this.setData({
412   - nickName: app.globalData.userInfo.nickname,
413   - avatarUrl: app.globalData.userInfo.head_pic
  453 + nickName: app.globalData.userInfo.nickname
414 454 })
415 455  
416   - var path3 = os.url + "/api/wx/open/app/user/getWeAppEwm/" +
417   - os.stoid + "?sceneValue=1012" + "&pageValue=pages/goods/goodsInfo/goodsInfo";
418   - wx.getImageInfo({
419   - src: path3,
420   - success: function(res) {
  456 + // var path3 = os.url + "/api/wx/open/app/user/getWeAppEwm/" +
  457 + // os.stoid + "?sceneValue=1012" + "&pageValue=pages/goods/goodsInfo/goodsInfo";
  458 + // wx.getImageInfo({
  459 + // src: path3,
  460 + // success: function(res) {
421 461 // ctx.drawImage(res.path, 152*scale, 262*scale, 66*scale, 66*scale);
422 462 // ctx.draw(true);
423   - that.setData({
424   - ewm: res.path
425   - })
426   - }
427   - })
  463 + // that.setData({
  464 + // ewm: res.path
  465 + // })
  466 + // }
  467 + // })
428 468 },
429 469  
430 470 // 获取图片信息
... ...
packageA/pages/liveStreamDetails/liveStreamDetails.wxml
... ... @@ -5,7 +5,7 @@
5 5 <view class="content">
6 6 <!-- 封面标题 -->
7 7 <view class="cover-container">
8   - <image src="{{details.cover_img}}" class="cover-img" mode="aspectFill"></image>
  8 + <image src="{{details.cover_img}}" class="cover-img" mode="aspectFit"></image>
9 9 <!-- <view class="cover-desc">
10 10 <view>{{details.name}}</view>
11 11 <view>{{filter.format_time(details.start_time)}}</view>
... ... @@ -29,13 +29,13 @@
29 29 <block wx:for="{{details.goods}}">
30 30 <view class="list-item" bindtap="clickgoods" data-url="{{item.url}}">
31 31 <!-- {{item}} -->
32   - <image src="{{item.cover_img}}" class="item-pic"></image>
  32 + <image src="{{item.cover_img}}" class="item-pic" mode="aspectFit"></image>
33 33 <view class="item-desc-container">
34 34 <view class="item-desc">
35 35 <!-- <view>WEI</view> -->
36 36 <view>{{item.name}}</view>
37 37 </view>
38   - <view class="item-price">{{item.price}}</view>
  38 + <view class="item-price">{{filter.toFix(item.price, 2)}}</view>
39 39 </view>
40 40 </view>
41 41 </block>
... ... @@ -74,15 +74,20 @@
74 74  
75 75 <!-- 生成海报 -->
76 76 <view class="{{showPlaybill ? 'playbill':'playbill active'}}" hidden="{{showPlaybill}}">
77   - <!-- <image src="{{canvasToImgPath}}" class="playbill-pic"></image> -->
78   - <canvas canvas-id="myCanvas" class="playbill-pic" style="width:{{windowWidth*dpr}};height:width:{{windowHeight*dpr}}"></canvas>
79   - <view class="playbill-save" bindtap="onSaveToPhone">
80   - <image src="/packageA/images/liveStreamDetails/save.jpg"></image>保存至相册
81   - </view>
  77 + <!-- <view class="playbill-save" bindtap="onSaveToPhone">保存至相册</view> -->
  78 + <image src="{{canvasToImgPath}}" class="playbill-pic" mode="aspectFill"></image>
  79 + <canvas canvas-id="myCanvas" catchtouchmove="true" style="width:480px;height:738px;position:absolute;left:5000%;"></canvas>
  80 + <!-- style="width:{{windowWidth}}px;height:{{windowHeight}}px;" -->
  81 + <view class="playbill-save" bindtap="onSaveToPhone">保存至相册</view>
82 82 </view>
83 83  
  84 + <!-- <canvas canvas-id="myCanvas" class="" catchtouchmove="true" style="width:{{windowWidth}}px;height:{{windowHeight}}px;"></canvas> -->
  85 +
84 86 <!-- mask -->
85 87 <!-- 这里mask必须强制放在actionsheet和playbill的后面 -->
86   - <view class="mask" bindtap="hiddenActionSheet"></view>
  88 + <view class="mask" bindtap="hiddenActionSheet" catchtouchmove="true"></view>
87 89  
88 90 </view>
  91 +
  92 +<!-- <canvas canvas-id="myCanvas" class="" catchtouchmove="true" style="width:480px;height:738px;position:absolute;left:5000%"></canvas> -->
  93 +<!-- <canvas canvas-id='share' style='width:750rpx;height:1217rpx;' wx:if='{{!canvasHidden}}'></canvas> -->
... ...
packageA/pages/liveStreamDetails/liveStreamDetails.wxss
... ... @@ -6,6 +6,7 @@
6 6 .content {
7 7 background-color: white;
8 8 padding-bottom: 168rpx;
  9 + position: relative;
9 10 }
10 11 .cover-container {
11 12 height: 646rpx;
... ... @@ -103,8 +104,8 @@
103 104 }
104 105 .share-container image {
105 106 display: block;
106   - width: 60rpx;
107   - height: 60rpx;
  107 + width: 50rpx;
  108 + height: 50rpx;
108 109 padding-top: 14rpx;
109 110 padding-bottom: 11rpx;
110 111 }
... ... @@ -222,10 +223,13 @@
222 223 display: block;
223 224 width: 478rpx;
224 225 height: 737rpx;
225   - border-width: 31rpx 20rpx 51rpx;
  226 + /* border-width: 31rpx 20rpx 51rpx;
226 227 border-color: #f23030;
227   - border-style: solid;
  228 + border-style: solid; */
  229 + /* border: 4rpx solid #f23030; */
228 230 margin: 0 auto 26rpx;
  231 + border-radius: 10rpx;
  232 + overflow: hidden;
229 233 }
230 234  
231 235 .playbill-save {
... ...