**【李宁】微信小程序视频教程(UI + API + WeUI)导读**

在移动互联网流量红利向私域沉淀转移的当下,微信小程序已成为连接用户与服务最高效的载体之一。本课程由资深讲师李宁主讲,专为希望从零基础构建完整小程序开发能力的学习者设计。课程不仅涵盖底层开发逻辑,更深度结合 UI 视觉规范与 WeUI 组件库,旨在帮助学员打造兼具美观性与实用性的商业级小程序应用。

课程开篇从“微信小程序基础”入手,为初学者扫清环境障碍。李宁老师详细演示了微信开发者工具的下载安装、公测账号注册以及研发者与体验者的绑定流程,这些看似繁琐的基础配置,实则是保障项目合规运行的基石。随后,课程通过一个经典的“猜拳游戏”案例,引导学员完成从工程创建、页面布局到业务逻辑编写的全流程实践。这种“做中学”的方式,让抽象的代码逻辑变得具象可感,学员在短短几小时内即可理解小程序“数据驱动视图”的核心思想,并完成代码的预览与上传,获得初次开发的成就感。

进入核心模块后,课程深入剖析“布局”与“容器视图”两大关键技术点。现代小程序界面往往复杂多变,李宁老师系统讲解了水平、垂直及折行排列布局,并重点解析了带边距的水平等间隔排列等高阶技巧,确保学员能够精准控制界面元素的位置与间距。在容器视图部分,课程涵盖了滚动视图、定位、轮播图以及自动切换等高频应用场景。特别是针对电商与信息流场景中常见的轮播组件,课程详细拆解了其事件响应机制,使学员能够灵活处理用户交互带来的动态效果。

此外,课程还引入了视图层的进阶技术,如条件渲染(wx:if/block)、循环渲染(wx:for)及其嵌套逻辑。这些语法是构建动态内容列表的关键,对于后续开发商品展示、新闻资讯等复杂页面至关重要。整门课程结构清晰、循序渐进,既注重底层原理的讲解,又强调实战技能的培养。无论你是希望转型前端开发的程序员,还是希望通过小程序实现业务创新的运营人员,这门课都将为你提供一套完整、系统且可落地的技术解决方案。通过本课的学习,你将不再局限于简单的页面拼凑,而是能够独立构建出性能优异、体验流畅的小程序应用,为未来的职业发展中打下坚实基础。

课程目录

课程目录89 集
  • 1-1 [微信小程序基础] 开发环境安装与配置 (07:04).mp4
  • 1-2 [微信小程序基础] 注册小程序的公测账号 (04:03).mp4
  • 1-3 [微信小程序基础] 绑定研发者和体验者 (02:10).mp4
  • 1-4 [微信小程序基础] 创建小程序工程 (02:55).mp4
  • 1-5 [微信小程序基础] 猜拳游戏的布局 (07:44).mp4
  • 1-6 [微信小程序基础] 编写猜拳游戏的业务逻辑代码 (10:31).mp4
  • 1-7 [微信小程序基础] 小程序预览和上传 (03:56).mp4
  • 2-1 [布局] 水平排列布局 (13:21).mp4
  • 2-2 [布局] 水平折行排列布局 (03:36).mp4
  • 2-3 [布局] 垂直(折列)排列布局 (04:07).mp4
  • 2-4 [布局] 水平排列对齐方式布局 (03:35).mp4
  • 2-5 [布局] 垂直排列对齐方式布局 (02:55).mp4
  • 2-6 [布局] (带边距)水平等间隔排列布局 (04:01).mp4
  • 3-1 [容器视图] 垂直滚动视图 (09:35).mp4
  • 3-2 [容器视图] 定位到指定的位置或子视图 (04:12).mp4
  • 3-3 [容器视图] 水平滚动视图 (04:54).mp4
  • 3-4 [容器视图] 滚动到边缘触发事件 (12:20).mp4
  • 3-5 [容器视图] 滚动事件 (11:24).mp4
  • 3-6 [容器视图] 水平和垂直轮询图 (12:13).mp4
  • 3-7 [容器视图] 自动切换轮询页面 (05:59).mp4
  • 3-8 [容器视图] 响应轮询图切换事件 (01:49).mp4
  • 4-1 [视图层技术] 条件属性 (08:34).mp4
  • 4-2 [视图层技术] block wx-if (04:36).mp4
  • 4-3 [视图层技术] 循环属性-wx:for (05:07).mp4
  • 4-4 [视图层技术] 循环属性-wx-for-item和wx-for-index (02:25).mp4
  • 4-5 [视图层技术] 循环属性-block-嵌套循环 (06:33).mp4
  • 4-6 [视图层技术] wx-key属性 (19:32).mp4
  • 4-7 [视图层技术] 模板(1) (11:07).mp4
  • 4-8 [视图层技术] 模板(2) (08:49).mp4
  • 4-9 [视图层技术] 引用 (06:35).mp4
  • 5-1 [基础组件] 文本显示组件(text) (14:54).mp4
  • 5-2 [基础组件] 显示系统图标(icon) (12:00).mp4
  • 5-3 [基础组件] 进度条(progress) (06:16).mp4
  • 6-1 [表单组件] button(提交和重置按钮) (20:30).mp4
  • 6-2 [表单组件] checkbox(复选框组件) (12:25).mp4
  • 6-3 [表单组件] input【1】(单行文本录入组件) (25:49).mp4
  • 6-4 [表单组件] input【2】(单行文本录入组件) (05:57).mp4
  • 6-5 [表单组件] label【1】(包含带绑定在组件) (11:02).mp4
  • 6-6 [表单组件] label【2】(使用for属性绑定组件) (06:49).mp4
  • 6-7 [表单组件] radio(单选按钮组件) (07:53).mp4
  • 6-8 [表单组件] switch(开关组件) (06:03).mp4
  • 6-9 [表单组件] picker(列表选择组件) (17:03).mp4
  • 6-10 [表单组件] slider(滑杆组件) (05:48).mp4
  • 6-11 [表单组件] textarea(多行输入组件) (06:05).mp4
  • 6-12 [表单组件] form(提交和重置组件) (10:56).mp4
  • 7-1 [多媒体组件] image组件 (08:55).mp4
  • 7-2 [多媒体组件] audio组件 (07:20).mp4
  • 7-3 [多媒体组件] video组件 (14:41).mp4
  • 8-1 [其他组件] action-sheet组件 (17:01).mp4
  • 8-2 [其他组件] modal组件(对话框) (13:12).mp4
  • 8-3 [其他组件] canvas组件 (12:25).mp4
  • 8-4 [其他组件] 地图组件 (22:25).mp4
  • 8-5 [其他组件] 页面导航 (12:33).mp4
  • 8-6 [其他组件] TabBar导航 (09:33).mp4
  • 9-1 [网络API] 准备工作(1) (22:11).mp4
  • 9-2 [网络API] 准备工作(2) (14:57).mp4
  • 9-3 [网络API] 发起HTTPS请求 (16:35).mp4
  • 9-4 [网络API] 上传文件 (11:23).mp4
  • 9-5 [网络API] 下载文件 (04:38).mp4
  • 9-6 [网络API] WebSocket (16:30).mp4
  • 9-7 [网络API] WebSocket演示 (12:10).mp4
  • 10-1 [多媒体API] 选择图像 (13:14).mp4
  • 10-2 [多媒体API] 获取图像信息 (06:52).mp4
  • 10-3 [多媒体API] 录音 (08:38).mp4
  • 10-4 [多媒体API] 播放、暂停、停止声音 (11:47).mp4
  • 10-5 [多媒体API] 控制背景音乐 (31:41).mp4
  • 10-6 [多媒体API] 音频组件控制 (09:59).mp4
  • 10-7 [多媒体API] 打开和播放本地视频 (07:53).mp4
  • 10-8 [多媒体API] 控制视频组件播放、暂停、定位、发送弹幕 (14:12).mp4
  • 11-1 [数据存取] 将临时文件保存成长期文件 (07:59).mp4
  • 11-2 [数据存取] 获取文件列表和文件信息 (06:38).mp4
  • 11-3 [数据存取] 删除长期文件 (05:28).mp4
  • 11-4 [数据存取] 打开文档 (07:58).mp4
  • 12-1 [位置API] 获取经纬度 (11:45).mp4
  • 12-2 [位置API] 在地图上选中位置 (06:05).mp4
  • 12-3 [位置API] 用微信内置的地图显示位置 (05:33).mp4
  • 12-4 [位置API] 与组件绑定 (05:18).mp4
  • 13-1 [设备API] 获取系统信息 (14:46).mp4
  • 13-2 [设备API] 获得网络类型 (05:08).mp4
  • 13-3 [设备API] 获取重力感应数据 (04:24).mp4
  • 13-4 [设备API] 获取罗盘方向 (05:59).mp4
  • 13-5 [设备API] 拨打电话 (04:14).mp4
  • 13-6 [设备API] 扫描二维码 (07:43).mp4
  • 14-1 [位置API] 信息框(Toast、模态窗口和ActionSheet) (11:38).mp4
  • 14-2 [位置API] 改变导航条的标题 (03:21).mp4
  • 14-3 [位置API] 设置和隐藏导航条动画 (02:16).mp4
  • 14-4 [位置API] 导航与返回页面 (18:33).mp4
  • 15-1 [WeUI(微信官方开发的基础样式库)] 简介 (04:41).mp4
  • 15-2 [WeUI(微信官方开发的基础样式库)] 把徽章样式改成模板 (14:55).mp4