分类归档

小程序

FWQ
小程序
一个微信小程序版知乎实例分享
本文主要和大家分享从零开始一个微信小程序版知乎,希望能帮助大家开发一个微信版知乎,从中也有更多思路。 展示效果(界面样式设计与交互来自iOS 4.8.0版本知乎App): 动态效果请移步到GitHub查看。 一、开始前的准备 申请账号:根据小程序注册文档,填写信息和提交相应的资料,就可以拥有自己的小程序帐号。 开发工具:微信开发者工具 数据来源: Easy Mock: 一个数据模拟神器,可以根据自己需要的格式自己编写返回数据,而且所有的数据都是随机生成的。 Mock.js: Easy Mock引入了Mock.js,但是文档中仅提供了部分语法,要想自己的mock数据写的更精简,可以在Mock.js中查看更多具体语法。 二、初始化一个小程序 新建一个空文件夹 打开微信开发者工具,按照“你的第一个小程序”文档中的步骤即可创建一个自己的小程序。 目录结构 weChatApp |___client | |___assets // 存储图片 | |___pages   // 页面 | | |___index // 首页…
2024-11-25 阅读全文 →
FWQ
小程序
微信小程序中如何实现动态改变view标签宽度和高度
这篇文章主要介绍了微信小程序实现动态改变view标签宽度和高度的方法,涉及微信小程序事件响应及使用setdata针对data数据动态操作相关实现技巧,需要的朋友可以参考下 本文实例讲述了微信小程序实现动态改变view标签宽度和高度的方法。分享给大家供大家参考,具体如下: 1、效果展示 2、关键代码 index.wxml文件 <view>我是view标签,我现在的宽度是{{view.Width}}px,高度是{{view.Height}}px</view><input><input> 登录后复制 此处设置的style=”width:{{view.Width}}px;height:{{view.Height}}px;”可通过事件响应动态改变数值,进而改变view组件的宽高样式。 index.js文件 var pageData={} pageData.data={   view:{     Width:100,     Height:100   } } pageData['viewWidth']=function(e){ console.log(e);   this.setData({     view:{       Width:e.detail.value,       Height:this.data.view.Height     }   }) } pageData['viewHeight']=function(e){   this.setData({     view:{…
2024-11-25 阅读全文 →
FWQ
小程序
有关UI组件的课程推荐10篇
小程序在520节日前夜,让程序员们又躁动了一把,更新了一些很诱人的功能,如内容转发API,iBeacon API,振动API,屏幕亮度调节API等,也增强了地图组件的功能。此次的更新中,也新增了一个UI组件,它就是视图组件movable-view,它需要配合movable-area来一起使用。简单来说,它就是一个支持在指定区域内可以拖动内容的容器。我们来看一个简单的示例:    1. 简介:小程序在520节日前夜,让程序员们又躁动了一把,更新了一些很诱人的功能,如内容转发API,iBeacon API,振动API,屏幕亮度调节API等,也增强了地图组件的功能。 此次的更新中,也新增了一个UI组件,它就是视图组件movableview,它需要配合movablearea来一起使用。简单来说,它就是一个支持在指定区域内可以拖动内容的容器。 2. 简介:Magic是一款基于JavaScript的UI组件,Magic框架的代码量很少,运行效率非常出色。同时Magic包含了很多常用的网页应用组件,包括图片轮播、日历、对话框、分页、选项卡Tab等UI组件。   Magic的特点   底层库基于百度的Tangram,Tangram是一款类似于jQuery的JavaScript框架,最新的Magic可以选择使用Tangram作为底层库,同时也可以选择jQuery作为底层库,非常灵活。 Magi.. 3. 简介:HTML5开源引擎lufylegend-1.7.1版的下载包内包含了lufylegend.ui-0.1.0.js文件,它是一个lufylegend.js引擎的专用UI组件,我在api的介绍里也说了,这个UI组件是专门为懒人准备的,包含按钮,单选框,多选框,组合框,滚动条等UI。下面我来具体说一说这些UI的绘制过程,也方便大家更好的理解和扩展新的UI组件。1,矩形按钮LButtonSample1首先 4. 简介:Android开发是有趣的——这毫无疑问。然而,还是有很多平台迫使我们编写重复的样板代码。很多时候这都与需要你处理的UI组件相关。有一些确实是你需要的,当你希望你的应用程序架构能够干干净净的时候。有很多操作在后台异步执行;事实上,最后很容易成为一堆意大利面条似的代码,不可读或者就是让人感觉不正确。 5. 简介:CJuiSliderInput 显示一滑动条,它也封装了 JUI slider插件,可以用在Form中作为用户输入UI组件。 6. 简介:Zii组件中包含了一些基于JQuery的UI组件,这些UI组件定义在包zii.widgets.jui中,包括CJuiAccordion , CJuiAutoComplete,CJuiDatePicker等。本篇介绍CJuiAccordion,显示一个Accordion组件(类似手风琴可以折叠的UI组件)。 这个控件封装了…
2024-11-25 阅读全文 →
FWQ
小程序
微信网页获取用户基本信息的方法
本文主要和大家分享微信网页获取用户基本信息的方法,之前写过文章微信网页授权获取用户基本信息讲网页开发的时候,有时候需要获取用户的昵称头像等个人基本信息,获取用户的基本信息,可以通过网页授权,用户同意之后,获取到,如图所示: 但是,这样就多了一个步骤,有的用户可能看到多一个步骤,就随手点击回退,就这么失掉了一个宝贵的用户,很是遗憾,那么今天我们就使用另一种方式来获取用户信息,就是通过OpenID来获取用户基本信息。这种方式可就简单多了,在用户不知不觉的情况下,我们就拿到了他的个人信息,而且这样获取的信息比授权获取的还要多,比如这样还可以知道该用户是否关注以及关注时间。 前期准备:获取到用户的openid,这个在上一篇文章讲过了,详见:微信公众号获取用户的openid 话不多说,直接上代码: //获取令牌 public function getAccessToken(){ //指定保存文件位置 if(!is_dir('./access_token/')){ mkdir(iconv("GBK","UTF-8",'./access_token/'),0777,true);  } $file = './access_token/token'; if(file_exists($file)){ $content = file_get_contents($file); $cont = json_decode($content); if( (time()-filemtime($file)) expires_in){   //当前时间-文件创建时间<token return>access_token; } } $curl = 'https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&amp;appid='.$this-&gt;appid.'&amp;secret='.$this-&gt;appsecret; $content = $this-&gt;_request($curl); file_put_contents($file,$content); $cont = json_decode($content); return $cont-&gt;access_token; } /**  * 通过openid拉取用户信息  * @param  string $openid [description]  * @return [type]         [description]…
2024-11-25 阅读全文 →
FWQ
小程序
微信开发入门(十一)更新上一页数据
小程序开发过程中经常有这种需求,需要把当前页面数据传递给上一个页面,但是wx.navigateback()无法传递数据。 一般的办法是把当前页面数据放入本地缓存,上一个页面再从缓存中取出。 除此之外还有一种办法,巧妙利用页面栈。 getCurrentPages() 函数用于获取当前页面栈的实例,以数组形式按栈的顺序给出,第一个元素为首页,最后一个元素为当前页面。 重点就在这里,在当前页面拿到上一个页面的实例对象,然后调用该对象的方法完成数据传递。 页面A Page({      data: {         name: ''      },      ...     ,      //更新name      changeData: function(name){         this.setData({             name: name                     })                    }}) 登录后复制 页面B,假设有一个文本框用于输入姓名,点击返回按钮后更新页面A的name Page({     //此方法用于文本框输入回调     inputTyping: function (e) {         //获取页面栈         var pages = getCurrentPages();         if(pages.length &gt; 1){             //上一个页面实例对象             var prePage = pages[pages.length - 2];…
2024-11-25 阅读全文 →
FWQ
小程序
微信小程序数据绑定及运算详解
本文主要和大家介绍微信小程序 数据绑定的简单实例的相关资料,希望通过本文能帮助到大家,需要的朋友可以参考下,希望能帮助到大家。 微信小程序 数据绑定的简单实例 简单用法: Page({  data: {   message: '张三'  } })  /**   * 生命周期函数--监听页面加载   */  onLoad: function (options) {    var content1={      date: "2020年 10月 8日 ",       title:"时间群" ,      nameData:{        name1:"张三李四",        name2:"人五人六",      },      fade:true/false     }    this.setData(content);  }, 登录后复制 数据绑定使用 Mustache…
2024-11-25 阅读全文 →
FWQ
小程序
微信扫码支付的Asp.Net MVC开发
这次给大家带来微信扫码支付的 MVC开发,微信扫码支付Asp.Net MVC开发的有哪些,下面就是实战案例,一起来看一下。 这里的扫码支付指的是PC网站上面使用微信支付,也就是官方的模式二,网站是Asp.net MVC,整理如下。(demo在最下方) 一、 使用的微信API中的统一下单方法,关键的参数是‘公众账号ID(appid)’,‘商户号(mch_id)’和’商户支付密钥(KEY)‘,所以首先要有一个审核过的公众号,并开通支付功能,然后申请商户,通过审核后得到商户号,也就是商户平台的登录名。商户支付密钥是用来签名的,确保url不被篡改。进入商户平台后在API安全中设置,是一个32位的。 有这三个参数后,还有一点要注意的是交易起始时间和交易结束时间的间隔应该在五分钟以上2小时以内。不然获取支付url的时候回报错。 二、生成支付二维码 有了上面的参数,接下来就是下载SDK: .net SDK及示例 。 可惜官方的这个示例一开始并不能运行正确。把相关dll引用MVC目录下。并创建一个WxPayAPI文件夹把相关类复制过来。    然后将WxPayConfig中的相关参数设置成自己的参数,再修改GetPayUrl方法, public string GetPayUrl(Order order,string ip) { if (order == null) { throw new…
2024-11-25 阅读全文 →
FWQ
小程序
使用scss开发微信小程序
微信小程序的wxss、阿里旗下淘宝、支付宝小程序的acss等等语法很类似原生css,但是在web开发里用惯了动态css语言,再写回原生css很不习惯,尤其是父子样式的嵌套写法非常繁琐。因此,我希望能有一个自动化构建方案,能够简单地将scss转换成小程序的样式语言。 方案1 以前写微信小程序的依赖库时用过,使用gulp编译,将源码和编译后的代码分别放到src和dist两个目录。gulp会处理src下面的所有文件,将其中的scss转换成css,并将其他所有文件原封不动挪到dist下相应位置。 这里就不详细说了,代码参考。 方案2 非常简单直接,使用Webstorm/IDEA的File Watchers功能实时转换。 安装Ruby和sass 确保命令行输入sass -v能出现版本号,安装过程略。 立即学习“”; 安装File Watchers 到插件市场上搜索并安装(已安装则跳过) 添加scss的转换脚本 现在安装完插件打开项目会自动弹出scss转css的向导,方便了很多。但还需要做一些修改,配置如下: 首先要将生成文件的后缀名改掉,比如这里我的淘宝小程序就得是acss。 其次,将Arguments改为: $FileName$:$FileNameWithoutExtension$.acss --no-cache --sourcemap=none --default-encoding utf-8 --style expanded 登录后复制 如果不加–no-cache,scss文件同目录下会出现一个.sass-cache目录。 如果不加–sourcemap=none, scss文件同目录下会出现一个.map文件。 如果不加–default-encoding utf-8, scss文件如果有中文注释转换就会报错。 style可不加,这里用的是无缩进和压缩的风格,反正小程序打包发布时还会压,这里保持可读性。 现在这个scss转换是单独作用于项目的,如果新建一个小程序项目,就需要重新添加(不建议设置成global,容易误伤)。…
2024-11-25 阅读全文 →
FWQ
小程序
微信小程序的MINA文件结构的介绍
这篇文章主要介绍了微信小程序 mina文件结构的相关资料,这里详细介绍了微信小程序的文件目录及文件作用,需要的朋友可以参考下 文件结构 框架程序包含一个描述整体程序的 app 和多个描述各自页面的 page。 一个框架程序主体部分由三个文件组成,必须放在项目的根目录,如下: 文件 必填 作用 app.js 是 小程序逻辑 app.json 是 小程序公共设置 app.wxss 否 小程序公共样式表 一个框架页面由四个文件组成,分别是: 文件类型 必填 作用 js 是 页面逻辑 wxml…
2024-11-25 阅读全文 →
FWQ
小程序
有关微信朋友圈的文章推荐10篇
这篇文章主要介绍了.Net语言Smobiler开发平台如何仿微信朋友圈的消息样式?本文为大家揭晓答案最前面的话:Smobiler是一个在VS环境中使用.Net语言来开发APP的开发平台,也许比Xamarin更方便一、目标样式我们要实现上图中的效果,需要如下的操作:1.从工具栏上的”Smobiler Components”拖动一个MicroBlog控件到窗体界面上2.用代码添加手机界面上显示的内容Load事件代码:VB: Private Sub TestMicroBlog_Load(sender As Object, e As EventArgs) Handles MyBase.Load   Try    Me.MicroBlog1.Def 1. 简介:这篇文章主要介绍了.Net语言Smobiler开发平台如何仿微信朋友圈的消息样式?本文为大家揭晓答案 2. 简介:这篇文章主要介绍了.Net语言Smobiler开发平台如何仿微信朋友圈的消息样式?本文为大家揭晓答案 3. 简介:做微商最火爆的一年应该是2013年,注册用户量已经突破6亿,如果那个时候的你就已经从事微商,直至今天你还在坚持,我相信你已经赚到了一笔丰厚的资金。因为微商是一种新的营销模式,大家对扫一扫、附近的人、微信加好友都有一种好奇和新鲜感,只要你花点精力做了就可以加到很多的粉丝,他们对微信朋友圈的内容都感到新鲜都想尝试或购买。 4. 简介: 可能你已经发现了,一个好玩有趣的 HTML5 页面在微信朋友圈里获得的用户关注度会远超过那些普通的独立应用。在移动应用越来越多,推广越来越难做的情况下,你的产品是不是也应该有一个 HTML5 页面? 5. 简介:微信朋友圈怎么只发文字:微信朋友圈怎么只发文字 php写的微信朋友圈:初学php,代码还应该重构,放一个纪念一下吧源码 6. 简介:一个类似于发布微信朋友圈的功能! 7. 简介:关于PHP模拟微信朋友圈数据的问题 8. 简介:一个类似于发布微信朋友圈的功能!就是在当前页面,先选择上传一张照片后,页面跳转到朋友圈发布页,然后再提交。我的问题是我打算在当前页写一个js,选择完照片后跳转,然后把照片的url保存到session中,然后在跳转后的页面把session里的图片url取出来跟表单一起提交到添加算法里,可是我在取照片地址的时候是取得file框的value值结果类似“c:pa 9. 简介:php  伪静态问题把网页分享到 微信朋友圈之后,发现有一个问题,就是现在网址在 html 后面会自带一串参数。。这样子在伪静态的网站会导致找不到页面的问题。请问高手要如何正则处理,谢谢。——解决方案——————–找到.html那行 在替换前正则串后面加个.*就好了吧…
2024-11-25 阅读全文 →