自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(16)
  • 收藏
  • 关注

原创 微信小程序云存储中调用fileid作为图片路径,无法正常显示解决方法

教同学们写一个图片瀑布流的微信小程序,图片是放到云存储中的,大多数同学都没有问题,有个别同学出现了下方的问题,图片无法正常显示查阅了官方的资料,发现image组件的src从2.3.0起开始支持云文件ID,需要确认下使用的调试基础库的版本号,修改之后可以正常显示,这里记录一下...

2020-05-27 10:06:10 6443 1

原创 微信小程序canvas绘图功能小例子

canvas基本功能介绍01canvas组件在wxml页面直接使用canvas来调用组件,canvas的默认宽高为300px*225px,如果要使得画布根据屏幕尺寸变化,可以在js文件中利用getSystemInfo来获取系统宽高,也可自定义宽高(可在样式表中定义也可以直接使用行内样式)<canvas canvas-id="ctx"></canvas><canvas style="width: 170px; height:170px;" canvas-id=".

2020-05-24 16:55:16 2013 1

原创 微信小程序之地图关键词输入提示,点击地点打开相应位置

运行效果​​功能介绍本案例采用腾讯位置服务中关键词输入提示方法,对用户输入的关键词进行补齐,并弹出返回匹配度高的结果,用户点击任意一个结果,打开此位置,之后可以借助于微信内置地图来实现导航等后续功能。主要代码wxml页面框架页面中主要包含一个全屏显示的地图组件、一个位于顶部的输入框组件和位置呈现区域的view组件<map id="map" longitude="{{longitude}}" latitude="{{latitude}}" markers="{{marker

2020-05-24 16:51:30 2253

原创 微信小程序之获取当前位置附近的美食、酒店、娱乐、超市等,并显示标记

运行效果功能介绍本页面首先利用微信小程序的getLocation方法获取用户当前的位置,如果用户未授权获取位置可进行提示,根据用户当前位置的经度和纬度,调用腾讯地图SDK地点搜索功能,实现返回搜索结果和标记点的效果。代码解读wxml页面在wxml页面主要使用了地图组件和滚动视图区域组件地图组件为map,可以指定其宽高、显示层级、标记点;滚动视图区域为scroll-view通过设置其宽度和高度,再设置scroll-x或者scroll-y来实现滚动的效果,wxml页面代码如下,代码中只添

2020-05-17 15:10:55 7587 1

原创 微信小程序一键抠图(进阶),抠图完成之后自定义背景合成新图并下载到本地

运行效果在之前完成抠图的基础上,再上传一张背景图,将抠图和背景图进行合成,生成新图片保存到本地功能介绍利用百度ai人像分隔功能生成的白底图存储到本地之后,提示用户上传一张背景图,将背景图临时路径和白底图路径通过页面跳转参数传递到一个新的页面combine里,在此页面中首先获取屏幕宽度和两张图片的宽高,根据屏幕宽度分别对两张图片进行缩放,利用canvas绘图,首先绘制背景图,然后绘制白底图,完成之后将canvas保存到临时路径中,再将临时路径中的图片存储到本地相册中。核心代码参数传递

2020-05-17 15:04:57 8323 1

原创 微信小程序之颜值开发(进阶),生成颜值证书并下载到本地

效果演示功能介绍在之前文章微信小程序开发之颜值测试(初级),测测小猪颜值多少,那么豪横。。。。和微信小程序开发之颜值测试,内含主要代码实现了上传一张人像图片并利用进度条呈现其颜值和年龄,最后利用模态对话框根据颜值返回判断结果,这次在之前的基础上加上了生成颜值证书的功能,用户点击模态对话框中的查看证书,跳转到证书生成页面,通过url将用户图片、年龄、颜值数据传递过去,并利用canv...

2020-05-06 18:54:02 750

原创 微信小程序开发之天气预报,调用百度天气接口,显示温馨提示和之后的天气

效果预览页面功能介绍此天气预报功能首先获取用户当前位置城市名,对于获取当前位置城市名和百度天气ak申请有疑问可以参考之前文章,然后根据城市名调用百度天气接口返回天气各项数据,最后对返回的数据进行处理,利用swiper轮播组件来实现滚动展示当天天气、温馨提示和之后天气的情况。主要代码分析1:根据当前时间不同,显示不同的背景图片和天气图片,通过Date对象的getHo...

2020-05-06 18:49:13 2485 2

原创 微信小程序开发之颜值测试,调用百度AI人脸检测接口

​页面效果插播一下,颜值71,还可以那么狂,哼。。。。。。。。项目介绍页面实现上传一张带有人像的图片,点击测试颜值之后返回照片中人像的年龄和颜值,此项目为颜值测试初级,access_token值为获取之后在页面中固定,注意有有效期30天,30天之后需要更换,未对生成数据进行处理和判断,适合刚开始接触的同学练习,之后会发布关于中级(对数据进行判断,动态获取access_tok...

2020-04-26 15:08:17 8893 3

原创 微信小程序开发之菜品识别(调用百度AI菜品识别接口)

运行效果用户点击选择图片或者拍照按钮,选择一张图片上传之后显示在图片区域,点击菜品识别,系统对菜品识别之后弹出对话框来提示菜品名称和热量,用户点击确定查看菜品详情。小程序概述此小程序主要调用了百度AI菜品识别的接口,项目可根据用户上传的图片来判断图片中菜品的名称/菜品的热量,并获取百度百科中关于菜品的详细说明。在wxml页面中,为了使得菜品图片呈现的更鲜艳,加了一个具有小圆点...

2020-04-26 15:02:08 7203 6

原创 微信小程序wxml页面实现对时间戳格式转换

从数据库中返回的文章发布时间为时间戳,想在wxml页面调用的时候直接进行转换尝试了下使用wxs,最后实现了需要的效果部分代码为网上参考,此处记录下首先新建一个my.wxs文件其中写了两个函数 一个将时间戳处理为时间,另一个判断时间与当前时间的差值function getGapTime(date) {var re = “00”var timestamp = getDate().get...

2020-04-04 17:08:38 5559

原创 微信小程序-猜数字游戏

1:app.json文件中新增一行,创建新页面2:撰写页面框架文件注意 此处用到页面if判断 如果猜数字游戏成功结束 显示出重新开始按钮3:撰写页面样式文件4:撰写相应逻辑处理函数主要知识点由于每次猜的数字输入之后输入框要清空,因此button按钮的form-type设置为reset,绑定事件为guessNum当input输入框输入完成之后将数据提交到逻辑文件,为input绑定...

2020-03-17 18:00:24 6420 2

原创 微信小程序-猜拳小游戏

用到的知识点1 页面级变量的声明和调用(js调用和wxml调用)2 数组变量3 随机数4 组件dataset数据获取5 if判断语句6 三元运算符程序逻辑计算机出拳利用随机数函数来生成0,1,2随机数,以此来确定用户出拳通过点击图片来获取图片的data-choose值用户出拳有三种情况0 1,或者2计算机同样也有三种情况两者比较共有3*3-2=7种情况使用if语句来判断谁...

2020-03-17 17:48:13 1857 1

原创 百度人脸识别+php+微信小程序返回年龄和颜值

1:百度云注册账号登录首页-》产品-》人工智能-》人脸识别与分析https://cloud.baidu.com/product/face/detecthttps://console.bce.baidu.com/ai/?_=1583931927969#/ai/face/app/detail~appId=1513185创建应用-》获取secert key和api key2:在服务器php文件...

2020-03-11 21:12:53 625

原创 微信小程序后台php实现数据get传递

1:利用phpstudy搭建本地服务器,端口设置为882:访问http://localhost:88/phpmyadmin/,在test数据库中新建一个表li,表中添加一个字段name,增加两行数据来进行测试3:网站www根目录下新建一个wxapp文件夹作为小程序测试目录4:创建文件conn.php和index.php 连接数据库并返回数据5:微信小程序index.js中请求数据...

2020-03-10 21:13:27 2246

原创 微信小程序实现两个页面之间的跳转

两个简单的页面点击链接实现在两个页面之间的跳转图片和文字自行设置步骤1:创建项目2:删除多余无用文件和代码最新版的微信开发者工具不支持创建空白项目,我们需要把原来多余的文件和代码删除需要删除的代码index.wxml 中所有代码index.wxss中所有代码3:新建一个新的页面index1不用新建文件和文件夹在app.json中添加如下代码即可“pages/index...

2020-03-09 18:52:50 10374

原创 微信小程序movable-area的使用(会移动的小黄点)

1:movable-area要和movable-view组合起来使用2:这里分享一个小例子wxml代码js代码在页面里面通过设置movable-area的宽度和高度及背景色使其显示出来,同时设置movable-view的宽度高度和border-radius使其显示为一个小黄球在js逻辑文件中,定义一个tap函数,用户在视图页面点击按钮,执行tap函数函数生成一个随机数,使得小球在点击...

2020-03-09 18:46:44 3987

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除