微信小程序自带的设置透明度只有setGlobalAlpha,但是CanvasContext.setGlobalAlpha设置透明度,是全局透明,整张图片都透明了.所以直接使用是不行的. 换种思路实现:就是把需要加水印的图片弄成拷贝成两张(大小尺寸一样),然后一张图片加水印字体并通过CanvasContext.setGlobalAlpha设置字体透明度,然后把两张图片合并就能实现照片不透明,字体透明. 微信扫一下小程序码可以查看实现的效果: 主要js代码逻辑: 1 var ctx= wx.crea

原文地址:http://design.yesky.com/photoshop/252/2427752.shtml 本文我们介绍用Photoshop为图片添加透明立体水印的方法和技巧. 原图: 打开原图新建立一个图层,并且输入文字,如图所示: 设置图层样式: 设置填充: 拼合图层:

在使用微信小程序canvas绘制文字时,时常会遇到这样的问题:因为canvasContext.fillText参数为 我们只能设置文本的最大宽度,这就产生一定的了问题.如果我们绘制的文本长度不确定或者我们希望文本超出自动换行或者用 ...我们只能设置文本的最大宽度,这就产生一定的了问题.如果我们绘制的文本长度不确定或者我们希望文本超出自动换行或者用省略号表示,光靠这个API是无法完成的.下面本人就讲下我在开发中是如何解决这个问题的.. 1 wxml代码. <canvas canvas-id=&quo

PS: CS2 本文我们介绍用Photoshop为图片添加透明立体水印的方法和技巧. 原图: Duplicate Layer,并输入文字: 设置Layer->Layer Style->Bevel and Emboss: 设置Fill(100%->0%): Merge Visiable:

微信小程序开发语音识别文字教程 现在后台 添加插件 微信同声传译 然后app.json 加入插件 "plugins": { "WechatSI": { "version": "0.0.7", "provider": "xxxxxxxxx" } } 前端页面 <image class="psearchsp_yuyinbtn" bindtouchstart='luy

微信为小程序提供客服消息能力,小程序用户可以方便快捷地与小程序服务提供方进行沟通,并且已经做成了组件的形式,直接就可以调用.客服会话按钮,用于在页面上显示一个客服会话按钮,用户点击该按钮后会进入客服会话.那么如何自定义成悬浮客服会话按钮呢?随Z5Win一起来看看 1.我们可以定义contact-button的样式,加一个class.这个客服组件可以放在一个固定模板里,方便每个页面都调用到. <view> <contact-button class="img-plus-style

图解微信小程序---添加tabBar底部菜单,添加已做好轮播图操作 什么是tabBar? 顶部或者底部tab栏如果小程序是一个多 tab 应用(客户端窗口的底部或顶部有 tab 栏可以切换页面),可以通过 tabBar 配置项指定 tab 栏的表现,以及 tab 切换时显示的对应页面. tabBar的基本属性 tabBar的list属性 tabBar的list属性介绍 参考代码 注意事项 list :接受一个数组,只能配置最少 2 个.最多 5 个 tab.tab 按数组的顺序排序,每个项都是一

先上效果: 缘起 使用微信小程序做地图相关功能的时候,有个需求是需要接入自己发布的地图服务.查看微信小程序地图组件文档,发现它对地图相关的支持很少,只有一些基础功能,比如添加点.线.面.气泡和一些常规的地图事件监听,并没有添加地图服务相关的支持. 不过有了需求,也要想办法解决呀. 图层查询 既然小程序不能直接添加地图服务,那就把图层数据查出来,然后通过添加点线面方式添加到地图,具体要怎么实现呢? 首先想到的是通过图层查询接口把所有数据查出来. 但是既然数据是按图层发布的,一般数据量都比较大,把所

小程序中经常会遇到要生成图片的需求,图片一般会加上用户的头像和昵称之类的,头像只需要把腾讯域名添加到request和download列表中,使用wx.getImageInfo()就可以缓存到本地,成功的回调再添加进canvas中生成图片. 如果要文字在某个位置居中,canvas中文字怎么根据文字长短不一实现锚点在文字中心位置呢? var txtWidth=canvas.measureText(this.nickName).width能获取到在canvas中文字的宽度,找到文字的居中x位置减去tx

丧失求生文字小游戏 编写原因: 我编写这个小程序是为了结合下我学习的知识并且做一个小游戏来看看我自己的能力,目前我已经学完了C语言的编程基础.马上就要学到指针,这个就是我的基础总结项目,希望大家可以都给意见和修改方法. 编程内容: 这里面有一些我目前学习的知识,比如数组,循环,判断和函数,之后运用到了一些清屏函数和暂停函数 小程序截图: 程序概况: 运行环境:Windows7 编写环境:Mac Xcode 与 Windows CodeBlocks 注意事项:如需在其他平台运行请删除<window

文字的多行处理在dom元素中很好办.但是canvas中没有提供方法,只有通过截取指定字符串来达到目的. 那么下面就介绍我自己处理的办法: wxml: <canvas canvas-id='word' id='test'></canvas> canvas肯定要一个画板容器啦,记得设置宽高哦,小程序中默认宽高是300px和150px js:在page中 //处理文字多出省略号显示 dealWords: function (options) { options.ctx.setFontSi

小程序开放激励视频是对小程序开发者一个福音,小程序开发者可以完成一些变现,以增加收入! 本文章针对已经有开发经验或者正在进行小程序开发的同学~ 官方文档:激励视频广告 定义页面变量,用于创建视频实例 const = { videoAd: null } 创建广告视频 /** * @method createVideoAd 创建广告视频 */ createVideoAd() { // 创建广告位 if (wx.createRewardedVideoAd) { // 加载激励视频广告 this.con

一.准备: 1.经微信认证过的微信公众号. 2.经微信认证过的微信小程序号. 先来看看微信小程序官方的文档,https://developers.weixin.qq.com/miniprogram/dev/api/wx.addCard.html 在看看微信介入卡券的流程,https://mp.weixin.qq.com/cgi-bin/announce?action=getannouncement&key=1490190158&version=1&lang=zh_CN&pl

终于等到公司开发小程序了,学习的时候不觉得有什么,实际开发就会出现各种问题. 今天第一天开发就遇到问题了. 项目需求,要一个平时的nav导航栏,这玩意用jQuery两行代码解决了,可是小程序不允许操作dom啊: 折腾一个多小时最终找到两种方法,分享给大家: 第一种比较直接但是,不适合多个操作: 1,第一种感觉比较傻 <view </view> <view </view> <view </view> 需要用到三目运算符,同时有多少个导航就要加多少事件.

//test.xml<canvas bindtap='showhaibao' canvas-id="myCanvas" style="width:{{canvasw}};height:{{canvash}};"/> //test.jsdata:{ canvasw: '', canvash: '' } //获取小程序码 wx.getSystemInfo({ success: function (res) { that.setData({ canvasw:

问题:  想在打开小程序时就自动播放背景音乐(循环) 解决方法: 1.思路:写一个函数,在 onLoad()中调用 2. //index.js //获取应用实例 const back = wx.getBackgroundAudioManager(); Page({ ...................... // 音乐播放函数 backmusic: function () { player(); function player() { back.title = "罗密欧与朱丽叶 ";

给微信小程序页面加载背景图片解决方案 直接附上原文地址: 给微信小程序页面加载背景图片解决方案 - YUSIR 完美CODING世界 - CSDN博客  https://blog.csdn.net/yusirxiaer/article/details/81116274 希望对大家有帮助!

问题描述:在scroll-view 中scroll-x="true"时控制文字超出显示省略号,要求如图: 但实际中会出现如文字不换行或样式错乱的问题. 横向滚动的实现如下: 超过两行显示省略号: .scroll_txt{ word-wrap: break-word; display:-webkit-box; overflow:hidden; text-overflow:ellipsis; word-wrap:break-word; -webkit-line-clamp:; -webki

demo效果图: wxml 代码: <view class="{{ellipsis?'ellipsis':'unellipsis'}}">五险一金五五险一金险险一金五五险一金险一险一金五五险一金险一险一金五五险一金险一一金五险一金五险一金险一金五五险一金险一金五险一金五险一金五险一金五五险一金险一金五险一金五险一金五险一金五五险一金险一金五险一金五险一金五五险一金五险一金 </view> <view bindtap='ellipsis'>{{elli

问题描述: input输入框输入一段文字后,将光标移到文字中间,接着输入文字后光标又自动跳到最后去了. 原因: input事件中,给input框绑定任何事件后,在处理事件时 setData之后就会让光标到最后.说白了就是数据发生更新导致光标跑到最后. <input bindinput="sendText" confirm-type="send" value='{{sendVal}}' bindconfirm="send" />  bi

仅供参考 1,wxml: <view bindlongtap="phoneNumTap">{{phoneNum}}</view> 2,js: data = { phoneNum: '123456789014' } methods = { // 长按号码响应函数 phoneNumTap: function() { var that = this; // 提示呼叫号码还是将号码添加到手机通讯录 wx.showActionSheet({ itemList: ['呼叫'