Recommandations d'apprentissage associées : Tutoriel de développement de mini-programmes
Mini programme WeChat wxcanvas
Le téléphone de test est IPHONE6, version 0.10.102800 des outils de développement. Il en va de même pour la version 0.11.112301 des outils de développement
Le canevas du mini-programme WeChat et le canevas non-h5 présentent de nombreuses différences. Ci-dessous, le canevas du mini-programme WeChat s'appelle wxcanvas
<.>ci-dessous Voici toutes les informations utiles que j'ai testées petit à petit, veuillez lire patiemment :
1.wxcanvas n'a pas d'attributs de largeur et de hauteur ni de styles de largeur et de hauteur comme h5canvas. Il n'a que du style, qui peut être compris comme une boîte ; 2 Ne considérez pas wxcanvas comme un vrai H5canvas, considérez-le simplement comme un p. Les choses qui dessinent des plages existent également. et la hauteur. Il est affiché, ou il y a un redessin ici, mais je ne sais pas comment l'implémenter 3. Changer la largeur et la hauteur du style de wxcanvas ne change pas la taille du ; les éléments sur le canevas d'origine ; 4. L'agrandissement et la réduction de la transformation CSS ne peuvent pas changer la taille des éléments sur le canevas d'origine 5. enregistre les appels de méthode, utilisés pour générer et enregistrer le tableau d'actions de dessin. Il n'existe aucune relation correspondante entre le contexte et . Le tableau d'actions de dessin d'un canevas généré par le contexte peut être appliqué à plusieurs . En fait, après context.getActions(), les informations dans le contexte seront effacées. Si vous souhaitez les réutiliser, vous avez besoin de var temp=context.getActions() pour enregistrer le tableau d'opération avant de pouvoir le faire. être réutilisé dans wx .drawcanvas6. Notez que
wx.drawCanvas({ canvasId: 'target', actions: context.getActions() });
wx.drawCanvas({ canvasId: 'target', actions: context.getActions(), reserve:true });
7.《Points clés》
<canvas disable-scroll="true" catchtouchmove="ccvsMove" bindtouchmove="cvsMove" canvas-id="target" id="target" style='width:{{width}}px;height:{{height}}px'></canvas>
wx.drawCanvas({ canvasId: 'target', actions: [], reserve:false });
wx.canvasToTempFilePath({ canvasId: 'target', success: function success(res) { wx.saveFile({ tempFilePath: res.tempFilePath, success: function success(res) { console.log('saved::' + res.savedFilePath); }, complete: function fail(e) { console.log(e.errMsg); } }); }, complete: function complete(e) { console.log(e.errMsg); } });
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!