开门见山,先上效果吧!感觉可以的用的上的再往下看. 心动吗?那就继续往下看! 先上页面结构吧,也就是wxml文件,其实可以理解成微信自己封装过的html,这个不多说了,不懂也没必要往下看了. <scroll-view class="scroll-view_H" scroll-x scroll-with-animation style="width: 100%;height:{{windowHeight}}px" bindscroll="getSele

 <Android SwipeToDismiss:左右滑动删除ListView条目Item> Android的SwipeToDismiss是github上一个第三方开源框架(github上的项目链接地址:https://github.com/romannurik/Android-SwipeToDismiss ).该开源项目旨在:使得一个ListView的item在用户的手指在屏幕上左滑或者右滑时候,删除当前的这个ListView Item. 此种特效在新版的Android中应用不少.比方在

关于微信小程序不显示图片 通病可能有以下几个可能性: 非本地图片:确定图片资源存在,copy 图片url再浏览器打开,确定图片资源存在且能正常访问 本地图片:确定相对路径或者绝对路径正确 微信小程序图片路径,不可以存在中文,使用英文做路径和文件名 文件后缀文,小写.且保证正确 网络图片,必须确保域名已经备案 关于微信小程序安卓手机访问不到图片,而苹果手机正常 排除以上通病5点之后,出现安卓手机访问不到图片,而苹果手机正常访问的情况,大概率是图片地址做了CDN转发,多数CDN会默认开启防盗链, 需

锲子 微信小程序自定义左滑功能加上跳转,换成以往,左滑功能的逻辑一般是在js中实现,但在拖动方面,性能并不是那么的流畅.如今,官方新扩展了一套脚本语言wxs,在IOS设备上运行,性能会比JS快2~20倍,至于安卓上运行效率无差异. 构思 结合wxs,做左滑功能主要分为三个步骤:拖动开始=>拖动中=>拖动结束 让我们看看,这三个步骤需要做好哪些工作? 拖动开始 获取触发事件点的坐标数据 将坐标数据存到组件中,“拖动中”和“拖动结束”这两步骤要用上 拖动中 拿到拖动开始时存储的坐标数据 获取每一个

效果图如下: wxml代码: <view class="container"> <view class="touch-item {{item.isTouchMove ? 'touch-move-active' : ''}}" data-index="{{index}}" bindtouchstart="touchstart" bindtouchmove="touchmove" wx:for

<view class="touch-item {{item.isTouchMove ? 'touch-move-active' : ''}}" data-index="{{index}}" wx:for="{{list}}" wx:key> <view class="content"> <view style="{{item.txtStyle}}" class='item'

做项目的时候,会碰到用viewpager + fragments去实现多页滑动.有些时候需要完成:界面在滑动到一半或是一半以上的时候,需要把title之类的切换到下一个页面.这个时候仅仅依赖Viewpager的接口是不能判断,这里提供一个方法:判断viewpager是左滑还是右滑,同时对滑过一半的时候(这个参数可以调),进行相关操作. //定义两个变量,这个两个变量是表示滑动时候,positionOffset 是从大到 //小的变化,还是从小到大的变化.用于在滑动时候,避免多次调用一个方法 pr

最近有个项目是保存为名片(图片),让用户发送给朋友或朋友圈,找了很多方案都不适用,绞尽脑汁之后还是选了使用canvas,但是用这玩意儿生成图片最大的缺点就是,如果你的内容中有图片,并且这个图片是通过外链链接进来的,那么很容易造成跨域而无法生成图片的问题,以下就是我解决该问题的办法: *提前说一句,在做这个功能的时候,我发现跨域的问题没法解决,唯一能做的就是把图片放到和canvas相同的域里 1,以下是微信小程序的wxml文件部分 <canvas canvas-id='share' width=&qu

https://www.jianshu.com/p/11eb5b0bfe1a 注意 博客介绍的  在 wxss  backgroung-image 中引入小程序内图片是不可的,传到cdn上才实现

本文转自:http://blog.csdn.net/qq_31383345/article/details/53014610 今天遇到微信小程序的用户头像设置功能,做笔记. 先上gif: 再上代码: 小demo,代码很简单. 1.index.wxml <!--index.wxml--> <button style="margin:30rpx;" bindtap="chooseimage">获取图片</button> <ima

在开发微信小程序时,开发人员会参考着小程序api来开发小程序,但有的时候根据情况不同很容易出现bug,以下是我在开发小程序时出现的各种bug,在开发时有需要预览图片. 1.xml <view class='detail_img'> <view class='view_img' wx:for="{{imglist}}" wx:for-item="image"> <image src='{{image}}' data-src="{

一 . 效果 这是借用女神照生成的分享的海报,图片来自网络. 新增了poster组件和更新图片自适应 二 . 准备 准备两张图片连接,最好是自己开发账号验证的https图片链接. 三 . 实现思路 其实就是canvas实现方式,首先要就是定义一个canvas容器,把容器放在中间,图片也要动态计算大小居中,显示下面的文字和二维码也是要根据容器动态去改变,这就是大概的实现思路. 四 . 实现代码 利用微信小程序canvas生成海报分享图片,这个生成图片排版和适配不同尺寸的手机是一个难点,特别是图片适

小程序的二维码分为小程序码和二维码: 生成小程序二维码文档中说后端来生成. 参考 小程序开发文档资料:https://developers.weixin.qq.com/miniprogram/dev/api/getWXACodeUnlimit.html 文档的参数介绍还是蛮详细的,但是没有具体的demo,对于请求的接口的返回值是进制流(也就是在浏览器显示一堆乱码)也是很令人懊恼,这里贴一下我的代码: //获取小程序码,这里调用的是小程序码的A接口类型 public function getQRC

1.wxml <!--pages/test/test.wxml--> <view class="page"> <movable-area class="m_a" wx:for="{{plist}}" wx:key="*this" wx:for-index="id" > <movable-view class="data_list" directi

wxml结构(删除部分代码): <view class="chapter-item" wx:for="{{klgData}}" data-index="{{index}}" bind:touchstart="touchS" bind:touchmove="touchM" bind:touchend="touchE" wx:key="item.id"><

在项目运行过程中发现,用户在有左右滑动前进后退的功能的浏览器上签字时,偶然触发了前进后退会导致canvas像是重置了一样内容消失,所以需要在代码中处理这种情况. 基本原理就是在touchmove事件中阻止默认事件,使浏览器不会触发前进后退事件,但是也会无法触发scroll事件让页面正常滚动,后续如何让页面能正常滚动就会有多种思路. 参考https://www.cnblogs.com/Miracle-ZLZ/p/7852421.html文中第5点推荐使用IScroll,但看了一下github发现太

wx.chooseImage(OBJECT) 从本地相册选择图片或使用相机拍照. OBJECT参数说明: 示例代码: wx.chooseImage({ count: 1, // 默认9 sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有 sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有 success: function (res) { // 返回选定照片的本地文

1:生成临时图片,保证画布被加载以及渲染(即本身不可以 hidden 或是 上级元素不可以 hidden 或是 wx:if 隐藏等) == > 建议:因为 canvas 的组件层级(z-index)是最高的,无法通过层级改变,如自定义的弹框类似的组件总会被挡住 == > 若不想给挡住,便要控制 canvas 隐藏(hidden . wx:if) 但是利用 API ctx.setGlobalAlpha = 0(只是变成不透明,视觉上给隐藏,但是还是还在,若是那位置有 tap 等事件就尴尬了) =

1.index.wxml <!--index.wxml--> <button style="margin:30rpx;" bindtap="chooseimage">获取图片</button> <image src="{{tempFilePaths }}" mode="aspecFill" style="width: 100%; height: 450rpx"/&g

直奔代码主题wxml: <view class="test_box"> <swiper indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}" > <swiper-item> <view class='ceng

转载请注明出处:http://blog.csdn.net/droyon/article/details/37564419 非常多人有如标题所述的需求,并且大多数人採用了自己定义组件攻克了需求,事实上还能够有更"懒"的方法. 1.先附效果图: 2.方案. 首先,Activity.java public class MainActivityTest extends Activity{ @Override protected void onCreate(Bundle savedInstanc