微信小程序案例：2-2本地生活

news2024/11/19 5:30:30

文章目录

一、实现步骤
- （一）创建项目
- （二）创建页面
- （三）准备图片素材
- （四）编写页面结构
- - 1、编写轮播区域页面结构
  - 2、编写九宫格区域页面结构
- （五）编写页面样式
- - 1、编写轮播图区样式
  - 2、编写九宫格区域页面样式
- （六）查看模拟机效果

一、实现步骤

（一）创建项目

在这里插入图片描述

（二）创建页面

在这里插入图片描述

（三）准备图片素材

在这里插入图片描述

（四）编写页面结构

1、编写轮播区域页面结构

源码
预览效果

2、编写九宫格区域页面结构

view组件里嵌套9个view组件

（五）编写页面样式

1、编写轮播图区样式

设置swiper容器高度：350rpx，设置容器的高度和宽度

在这里插入图片描述

预览效果

2、编写九宫格区域页面样式

整体页面样式
每个格子页面样式
每个格子中的图片和文字的页面样式

（六）查看模拟机效果

查看轮播图和九宫格

在这里插入图片描述

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/1076254.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

升级MacOS后无法打开 Parallels Desktop，提示“要完成 Parallels Desktop 设置，请重新启动 Mac 。”

有用户升级macOS后，发现无法打开PD虚拟机了，提示“要完成 Parallels Desktop 设置，请重新启动 Mac 。”但是重启电脑之后，尝试了卸载重装，安装新版本，都无法解决问题，打开依旧如此提示&#xff…

flutter 绘制原理探究

文章目录 Widget1、简介2、源码分析Element1、简介2、源码分析RenderObjectWidget 渲染过程总结思考Flutter 的核心设计思想便是“一切皆 Widget”，Widget 是 Flutter 功能的抽象描述，是视图的配置信息，同样也是数据的映射，是 Flutter 开发框架中最基本的概念。在 Flutter…

网络攻防实战演练

在经历了多年的攻防对抗之后，大量目标单位逐渐认识到安全防护的重要性。因此，他们已采取措施尽可能收敛资产暴露面，并加倍部署各种安全设备。但安全防护注重全面性，具有明显的短板... 1、供应链在经历了多年的攻防对抗之后&…

[话题讨论]你认为程序员不写注释的原因是什么

你认为程序员不写注释的原因是什么 chatGPT发展势头迅猛，我认为其能够回答这个问题。于是我通过两条指令使其帮助我回答了这个问题，下面就是详细的提问指令和答复。 Not everything will go according to plan. Always be ready to adapt. Sometimes une…

kong 和konga网关部署及使用

Kong是一款基于OpenResty（Nginx Lua模块）编写的高可用、易扩展的，由Mashape公司开源的API Gateway项目。Kong是基于NGINX和Apache Cassandra或PostgreSQL构建的，能提供易于使用的RESTful API来操作和配置API管理系统，…

2D函数优化实战

优化目标函数如下： 该函数有四个极小值点，值都为0 先对函数进行绘图初始化起始点，再设置优化器，进行梯度下降优化完整代码： import torch import numpy as np import matplotlib.pyplot as plt from mpl_toolk…

手动文件锁定 #include <stdio.h> void flockfile(FILE* stream);void funlockfile(FILE* stream);//非阻塞函数 int ftrylockfile(FILE* stream); 不会锁定流的操作 #define _GNU_SOURCE #include <stdio.h>int fgetc_unlocked(FILE* stream); char *fgets_unl…