<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[ZeroT_Too的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/ZeroT_Too</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; ZeroT_Too]]></copyright><item><title><![CDATA[5.8 数据缓存]]></title><link>https://blog.youkuaiyun.com/ZeroT_Too/article/details/170435695</link><guid>https://blog.youkuaiyun.com/ZeroT_Too/article/details/170435695</guid><author>ZeroT_Too</author><pubDate>Tue, 10 Nov 2026 13:33:54 +0800</pubDate><description><![CDATA[本案例演示微信小程序本地数据缓存全套 API，区分同步、异步两套接口。实现：存储数据、读取数据、查看缓存信息、清空全部缓存；作业扩展：输入 key 删除指定一条缓存记录。10MB，数据保存在设备本地，卸载小程序会丢失。涉及 API 列表表格异步 API同步 API功能保存 key‑value 缓存读取指定 key 缓存获取缓存整体信息（key 列表、占用大小）清空全部缓存删除指定 key（本次作业扩展）异步 API：依靠 success/fail/complete 回调，不会阻塞页面执行；]]></description><category></category></item><item><title><![CDATA[5.6 照相和摄像]]></title><link>https://blog.youkuaiyun.com/ZeroT_Too/article/details/170435237</link><guid>https://blog.youkuaiyun.com/ZeroT_Too/article/details/170435237</guid><author>ZeroT_Too</author><pubDate>Tue, 10 Nov 2026 13:28:48 +0800</pubDate><description><![CDATA[本案例是微信小程序媒体 API 实战，使用实现拍照 / 相册选择图片、拍摄 / 相册选择视频；在此基础上完成作业扩展，增加图片预览按钮，图片为空时按钮禁用，有图片时可以全屏预览图片。：拍摄或者从相册选择图片、视频：全屏预览图片遇到坑：scroll‑view 直接子元素设置 border 会出现右边框被裁切显示不全，通过增加一层中间容器解决。页面包含【获取图片】、【预览图片】、【获取视频】按钮；image 展示图片，video 播放视频未选择图片：预览图片按钮灰色不可点击。]]></description><category></category></item><item><title><![CDATA[5.7 文件操作]]></title><link>https://blog.youkuaiyun.com/ZeroT_Too/article/details/170292733</link><guid>https://blog.youkuaiyun.com/ZeroT_Too/article/details/170292733</guid><author>ZeroT_Too</author><pubDate>Sun, 08 Nov 2026 18:09:14 +0800</pubDate><description><![CDATA[本次实验基于微信小程序原生框架，不使用云开发，利用文件管理器，完成本地文件的写入、复制、读取、获取文件信息、删除文件整套操作，熟悉小程序沙盒文件系统的特点与文件相关 API。小程序的本地文件存在独立沙盒目录，每个小程序、每个用户相互隔离，不能随意访问手机其他目录，保障数据安全。通过本次实验，我熟悉了微信小程序沙盒文件系统的隔离机制，学会使用 FileSystemManager 完成基础本地文件管理。小程序本地文件适合存放小型缓存文本，但是有严格目录限制，不能随意访问设备本地全部文件。]]></description><category></category></item><item><title><![CDATA[5.3 图形变换]]></title><link>https://blog.youkuaiyun.com/ZeroT_Too/article/details/170190379</link><guid>https://blog.youkuaiyun.com/ZeroT_Too/article/details/170190379</guid><author>ZeroT_Too</author><pubDate>Fri, 06 Nov 2026 11:07:53 +0800</pubDate><description><![CDATA[本次实验基于微信小程序 Skyline 渲染引擎，使用新版type="2d"Canvas 2D API，实现画布图形的平移、旋转、缩放、矩阵复合变换矩形叠加椭圆绘制。理解 Canvas 坐标系变换原理，掌握save()与restore()绘图状态栈，熟悉ellipse()椭圆绘制接口。开发环境：微信开发者工具 渲染模式：Skyline（必须，新版 type="2d" canvas 依赖此渲染引擎）"pages": [],"navigationBarTitleText": "图形变换",},},]]></description><category></category></item><item><title><![CDATA[5.2 基本绘图]]></title><link>https://blog.youkuaiyun.com/ZeroT_Too/article/details/170189889</link><guid>https://blog.youkuaiyun.com/ZeroT_Too/article/details/170189889</guid><author>ZeroT_Too</author><pubDate>Fri, 06 Nov 2026 10:54:53 +0800</pubDate><description><![CDATA[本次实验基于微信小程序，采用 Skyline 渲染模式，使用新版 Canvas 2D 接口完成基础图形绘制。实现功能包含：清空画布、绘制实心圆、轮廓圆、虚线、端点与交点样式、文字绘制、径向渐变图形、阴影矩形、半透明图形，并且额外扩展drawImage实现图片绘制，熟悉小程序 Canvas 绘图上下文、绘图状态保存、坐标与图形 API。开发环境：微信开发者工具 Stable 1.06.2504010 渲染模式：Skyline（必须，新版 type="2d" canvas 依赖该渲染引擎）]]></description><category></category></item><item><title><![CDATA[4.9 map 地图组件]]></title><link>https://blog.youkuaiyun.com/ZeroT_Too/article/details/169258048</link><guid>https://blog.youkuaiyun.com/ZeroT_Too/article/details/169258048</guid><author>ZeroT_Too</author><pubDate>Wed, 04 Nov 2026 23:59:11 +0800</pubDate><description><![CDATA[本次实验练习微信小程序map：获取当前设备地理位置：唤起地图选择位置：唤起微信内置地图，实现导航、打车功能选择位置打开位置。点击选择位置可以手动挑选地理位置，地图中心点跟随切换；点击打开位置调用微信地图导航能力。开发环境：微信开发者工具，小程序基础库版本 3.x❌错误：写电脑桌面绝对路径、使用反斜杠、缺少开头。✅解决：图片放在小程序项目文件夹内，路径使用，清缓存重新编译。]]></description><category></category></item><item><title><![CDATA[5.1 变脸游戏]]></title><link>https://blog.youkuaiyun.com/ZeroT_Too/article/details/169260213</link><guid>https://blog.youkuaiyun.com/ZeroT_Too/article/details/169260213</guid><author>ZeroT_Too</author><pubDate>Mon, 02 Nov 2026 09:51:16 +0800</pubDate><description><![CDATA[本次实验使用微信小程序加速计 API，实现变脸小游戏。实现两种切换脸谱方式：点击图片切换、摇晃手机切换脸谱；扩展功能：统计并展示累计变脸总次数。开发环境：微信开发者工具，基础库 3.7.5。]]></description><category></category></item><item><title><![CDATA[4.10 canvas组件]]></title><link>https://blog.youkuaiyun.com/ZeroT_Too/article/details/169258934</link><guid>https://blog.youkuaiyun.com/ZeroT_Too/article/details/169258934</guid><author>ZeroT_Too</author><pubDate>Fri, 30 Oct 2026 10:37:36 +0800</pubDate><description><![CDATA[本次实验学习微信小程序新版画布组件，掌握 Canvas 2D 绘图上下文的创建、触摸事件处理，实现手指自由手绘绘图；完成作业扩展功能：增加按钮切换画笔线条颜色，同时实现清空画布功能。开发环境：微信开发者工具，webview 渲染模式。]]></description><category></category></item><item><title><![CDATA[4.8 scroll‑view 组件]]></title><link>https://blog.youkuaiyun.com/ZeroT_Too/article/details/169071097</link><guid>https://blog.youkuaiyun.com/ZeroT_Too/article/details/169071097</guid><author>ZeroT_Too</author><pubDate>Tue, 27 Oct 2026 13:10:34 +0800</pubDate><description><![CDATA[本次实验学习小程序滚动视图组件，掌握纵向、横向滚动的配置方式，熟悉滚动相关回调事件。学会使用实现页面初始化定位，设置横向初始偏移。练习 CSS 伪元素::before，不用增加 DOM 节点就可以插入文本；掌握经典居中布局。同时了解 webview 与 Skyline 渲染引擎的语法差异。作业扩展在横向列表增加新页面，巩固横向滚动布局写法。]]></description><category></category></item><item><title><![CDATA[4.7 video 组件]]></title><link>https://blog.youkuaiyun.com/ZeroT_Too/article/details/169070865</link><guid>https://blog.youkuaiyun.com/ZeroT_Too/article/details/169070865</guid><author>ZeroT_Too</author><pubDate>Mon, 26 Oct 2026 00:19:53 +0800</pubDate><description><![CDATA[本次实验学习小程序video媒体视频组件，掌握预设弹幕与实时发送弹幕的开发流程。学会使用获取组件上下文，调用组件实例方法。实现随机十六进制颜色生成函数，完成弹幕随机变色效果。同时认识小程序基础库版本差异性，部分组件属性会随版本迭代废弃。掌握视频资源的限制规则，理解真机与模拟器行为差异，开发视频小程序时必须使用网络视频资源，不能直接引用本地 mp4 文件。]]></description><category></category></item><item><title><![CDATA[4.3 slider 组件]]></title><link>https://blog.youkuaiyun.com/ZeroT_Too/article/details/169070621</link><guid>https://blog.youkuaiyun.com/ZeroT_Too/article/details/169070621</guid><author>ZeroT_Too</author><pubDate>Sun, 25 Oct 2026 23:30:07 +0800</pubDate><description><![CDATA[在标签上书写data‑xxx="值"，触发事件时，可以通过获取自定义属性。，事件函数通过拿到r/g/b/a标识，区分是哪一个滑块触发。本次实验学习小程序slider滑动条表单组件，熟悉滑块各项配置。通过data‑*自定义属性传递标识，结合 JS 动态计算属性名，实现单函数处理多组件，体会代码复用。利用rgba()颜色函数配合内联样式，实现页面动态色彩效果。作业扩展练习属性修改滑动条轨道样式。同时巩固小程序事件机制、setData数据驱动视图更新的基础思想。]]></description><category></category></item><item><title><![CDATA[3.10 文件引用]]></title><link>https://blog.youkuaiyun.com/ZeroT_Too/article/details/168550077</link><guid>https://blog.youkuaiyun.com/ZeroT_Too/article/details/168550077</guid><author>ZeroT_Too</author><pubDate>Fri, 23 Oct 2026 11:01:24 +0800</pubDate><description><![CDATA[本次实验学习了小程序include文件引用机制，include可以引入 wxml 片段，复用页面结构，实现代码分离。使用wx:if条件渲染控制拓展阅读的显示隐藏，绑定按钮 tap 事件修改 data 数据驱动页面更新。同时熟悉小程序全局配置 app.json、全局样式 app.wxss，掌握导航栏、页面布局、边框样式的编写。通过拆分多个 wxml 文件，代码结构更清晰，便于后期维护修改，体会到小程序代码复用的优势。]]></description><category></category></item><item><title><![CDATA[3.7 列表渲染实现九九乘法表]]></title><link>https://blog.youkuaiyun.com/ZeroT_Too/article/details/168548667</link><guid>https://blog.youkuaiyun.com/ZeroT_Too/article/details/168548667</guid><author>ZeroT_Too</author><pubDate>Tue, 20 Oct 2026 13:55:35 +0800</pubDate><description><![CDATA[原因：flex 布局默认子元素会收缩压缩，单元格被挤没。解决：给.row.item设置禁止压缩；外层容器设置，容器跟随内容自动撑开。本次实验主要练习小程序嵌套列表渲染 wx:for和条件渲染wx:if，实现九九乘法表。通过双层wx:for循环模拟双层 for 循环，实现下三角效果。借助拿到循环下标，三元表达式动态 class 完成奇偶行不同背景色。学习双层嵌套方案，解决 webview 引擎下同时横纵向滚动的难题。理解 flex 布局的收缩特性，解决表格单元格被压缩消失的 bug。]]></description><category></category></item><item><title><![CDATA[3.6 条件渲染与 picker 选择器组件]]></title><link>https://blog.youkuaiyun.com/ZeroT_Too/article/details/168547648</link><guid>https://blog.youkuaiyun.com/ZeroT_Too/article/details/168547648</guid><author>ZeroT_Too</author><pubDate>Tue, 20 Oct 2026 13:31:56 +0800</pubDate><description><![CDATA[本次实验熟悉了小程序 picker 选择器组件，掌握wx:if条件渲染与<block>标签用法，理解小程序数据驱动思想。页面数据不能直接赋值，需要借助setData驱动视图更新。picker 组件通过数组下标获取选中项，结合内联样式动态修改背景色，实现颜色切换效果。通过作业扩展新增紫色选项，进一步加深对数组、下标、条件分支渲染的理解。同时认识 input 的 blur 事件，实现输入完成（失去焦点）之后再做条件判断，而不是输入每一个字符就执行逻辑。]]></description><category></category></item><item><title><![CDATA[2.2 图片与声音]]></title><link>https://blog.youkuaiyun.com/ZeroT_Too/article/details/167805229</link><guid>https://blog.youkuaiyun.com/ZeroT_Too/article/details/167805229</guid><author>ZeroT_Too</author><pubDate>Sun, 18 Oct 2026 11:18:24 +0800</pubDate><description><![CDATA[本次实验为微信小程序课堂案例 2.2《图片与声音》，主要练习image图片组件、音频上下文、事件绑定、页面生命周期onLoad，同时学习云存储存放音视频资源，避免小程序主包体积超出 2MB 限制。实现效果：页面展示宝塔山图片，点击图片切换播放 / 暂停《重回延安抒怀》音频；作业扩展需求：设置音频播放速率，每次点击后在控制台打印音频播放位置、播放速率。踩坑提醒：云开发控制台偶尔打不开，需要关闭小程序开发工具，完全重启开发者工具。表格属性 / API功能说明创建音频上下文实例，用于控制音频播放暂停。]]></description><category></category></item><item><title><![CDATA[2.10 自动随机变化的颜色]]></title><link>https://blog.youkuaiyun.com/ZeroT_Too/article/details/167804009</link><guid>https://blog.youkuaiyun.com/ZeroT_Too/article/details/167804009</guid><author>ZeroT_Too</author><pubDate>Tue, 13 Oct 2026 14:10:41 +0800</pubDate><description><![CDATA[是周期性定时器，可以每隔固定时间重复执行一段代码，适合自动轮播、自动变色这类场景。小程序想要修改页面上展示的数据，必须使用 setData，直接修改 js 里的变量不会更新界面。WXML 的 style 内联样式可以绑定动态数据，用来实现颜色、宽高这类样式动态变化。十六进制颜色一共 6 位，每一位取值范围是 0~F，一共 16 种可能性，利用随机数就可以生成任意颜色。]]></description><category></category></item><item><title><![CDATA[3.5 微信小程序计时器]]></title><link>https://blog.youkuaiyun.com/ZeroT_Too/article/details/167803806</link><guid>https://blog.youkuaiyun.com/ZeroT_Too/article/details/167803806</guid><author>ZeroT_Too</author><pubDate>Tue, 13 Oct 2026 14:07:02 +0800</pubDate><description><![CDATA[setTimeout只执行一次，适合做延迟显示；循环执行，适合倒计时、轮播。定时器一定要保存 id，使用手动清除，否则定时器会在后台持续运行造成内存问题。小程序修改页面显示数据，必须调用setData()，直接修改 js 变量不会更新视图。定位布局：父容器，子元素，子元素相对于父盒子进行定位；z-index 控制元素上下层级。开发小程序，要留意 WXSS 和普通 CSS 差异，部分 CSS 特性不能直接使用，需要用标签布局替代。]]></description><category></category></item><item><title><![CDATA[4.2 checkbox 和 radio 组件]]></title><link>https://blog.youkuaiyun.com/ZeroT_Too/article/details/166131778</link><guid>https://blog.youkuaiyun.com/ZeroT_Too/article/details/166131778</guid><author>ZeroT_Too</author><pubDate>Tue, 06 Oct 2026 23:15:13 +0800</pubDate><description><![CDATA[本次实验学习了小程序多选与单选组件。多选返回数组，可以同时选中多个；单选返回单个字符串，只能选一项。通过 wxml 行内style动态绑定 data 变量，调用setData()驱动页面样式实时更新。开发中要注意渲染引擎兼容性，部分 css 属性在 skyline 引擎会失效；wxml 特殊符号需要使用转义字符；选择组件必须放在对应的 group 容器内，事件绑定写在 group 上。通过 console 打印事件对象，可以快速查看接口返回数据，辅助调试。]]></description><category></category></item><item><title><![CDATA[4.6 image 图片组件]]></title><link>https://blog.youkuaiyun.com/ZeroT_Too/article/details/166131860</link><guid>https://blog.youkuaiyun.com/ZeroT_Too/article/details/166131860</guid><author>ZeroT_Too</author><pubDate>Tue, 06 Oct 2026 23:12:31 +0800</pubDate><description><![CDATA[本次实验学习小程序image图片组件，通过数组 +wx:for循环一次性展示 14 种 mode 显示效果。缩放模式会改变图片大小，裁剪模式不缩放只截取部分画面。开发过程中遇到很多格式问题，复制课件代码容易混入全角符号；Windows 图片后缀隐藏，很容易出现图片加载失败。调试可以先用网络图片快速验证代码逻辑，再替换成本地图片，减少排错时间。不同渲染引擎对组件属性支持不一样，做实验要留意官方兼容性说明。]]></description><category></category></item><item><title><![CDATA[4.1 三角形面积计算器]]></title><link>https://blog.youkuaiyun.com/ZeroT_Too/article/details/166131725</link><guid>https://blog.youkuaiyun.com/ZeroT_Too/article/details/166131725</guid><author>ZeroT_Too</author><pubDate>Tue, 22 Sep 2026 08:14:17 +0800</pubDate><description><![CDATA[本次实验完成三角形面积计算器，熟悉小程序表单组件工作流程。form 组件依靠 submit 事件收集表单组件数据，使用 setData 完成数据更新驱动页面渲染。程序需要做好输入合法性校验，对不满足业务逻辑的数据给用户 toast 提示。重置功能使用 bindtap 点击事件，把 data 全部恢复初始状态。通过本次实验，理解小程序视图层和逻辑层分离的开发思想。]]></description><category></category></item></channel></rss>