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

文章目录

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

一、实现步骤

（一）创建项目

在这里插入图片描述

（二）创建页面

在这里插入图片描述

（三）准备图片素材

在这里插入图片描述

（四）编写页面结构

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

  • 源码
    在这里插入图片描述
  • 预览效果
    在这里插入图片描述

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

  • view组件里嵌套9个view组件
    在这里插入图片描述

（五）编写页面样式

1、编写轮播图区样式

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

在这里插入图片描述

  • 预览效果
    在这里插入图片描述

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

  • 整体页面样式
    在这里插入图片描述

  • 每个格子页面样式
    在这里插入图片描述

  • 每个格子中的图片和文字的页面样式
    在这里插入图片描述

（六）查看模拟机效果

  • 查看轮播图和九宫格

在这里插入图片描述

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

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

相关文章

Docker从零到实战

Docker从零到实战

一、概述 1. 为什么学习Docker 我们经常会遇到这样的情况：当我们开发完一个项目，打包发给别人，别人却无法运行项目，但在本地却可以运行。于是，在别人的环境中，又配置了一下此项目所需的各种环境&#xff…
阅读更多...
Lua05——Lua基本数据类型

Lua05——Lua基本数据类型

lua 是动态类型语言，变量使用前不需要定义类型，在使用时直接赋值即可。 1 基本数据类型 值可以存储在变量中，作为参数传递或作为结果返回。 lua中有八个基本数据类型： nil 只有值nil属于该类，表示一个无效值&#…
阅读更多...
【PPT制作】基础篇

【PPT制作】基础篇

文章目录 一、PPT制作必要的基础设置1.1 自动保存1.2 字体嵌入1.3 撤销步数1.4 图像大小和质量 二、必备快捷键三、设计四原则四、总结 ヾ(๑╹◡╹)ﾉ" 没有坚持的努力，本质上并没有多大意义ヾ(๑╹◡╹)ﾉ" 一、PPT制作必要的基础…
阅读更多...
MinIO的安装与使用

MinIO的安装与使用

文章目录 1.MINIO是什么？2.MINIO安装3.启动脚本4.打开MINIO页面5.MC命令6.MINIO备份脚本 1.MINIO是什么？ MinIO 是一款高性能、分布式的对象存储系统. 它是一款软件产品, 可以100%的运行在标准硬件。即X86等低成本机器也能够很好的运行MinIO。 MinIO与…
阅读更多...
Python 人工智能 Machine Learning 机器学习基础知识点详细教程（更新中）

Python 人工智能 Machine Learning 机器学习基础知识点详细教程（更新中）

人工智能基本介绍 人工智能（Artificial Intelligence，AI）是研究、开发用于模拟、延伸和扩展人的智能的理论、方法、技术及应用系统的一门新的技术科学。它试图了解智能的实质，并生产出一种新的能以人类智能相似的方式做出反应的智…
阅读更多...
c++视觉--通道分离，合并处理，在分离的通道中的ROI感兴趣区域里添加logo图片

c++视觉--通道分离，合并处理，在分离的通道中的ROI感兴趣区域里添加logo图片

c视觉–通道分离&#xff0c;合并处理 通道分离: split()函数 #include <opencv2/opencv.hpp>int main() {// 读取图像cv::Mat image cv::imread("1.jpg");// 检查图像是否成功加载if (image.empty()) {std::cerr << "Error: Could not read the…
阅读更多...
R²决定系数

R²决定系数

R 2 R^2 R2&#xff08;决定系数&#xff09;是一个用于衡量统计模型拟合数据的指标&#xff0c;通常用于线性回归分析。它表示模型所解释的因变量&#xff08;目标变量&#xff09;方差的比例&#xff0c;范围从0到1。 更具体地说&#xff0c; R 2 R^2 R2告诉我们模型能够解释…
阅读更多...
【Linux】【C++17】filesystem 工具，常用集合

【Linux】【C++17】filesystem 工具，常用集合

文章目录 1. std::experimental::filesystem::exists() 查找文件是否存在2. std::experimental::filesystem::is_directory() 判断是否是一个目录3. std::experimental::filesystem::create_directory() 单层级目录创建std::experimental::filesystem::create_directories 多层…
阅读更多...
为什么选择虚拟展会展览？了解虚拟展会展览的应用领域

为什么选择虚拟展会展览？了解虚拟展会展览的应用领域

引言&#xff1a; 相较于传统的实体展览&#xff0c;虚拟展会展览具有吸引力和便捷性&#xff0c;能够在全球范围内进行宣传活动。这种创新形式不仅能够降低成本、扩大受众范围&#xff0c;还能够提供没有过的互动性和数据分析。 一&#xff0e;虚拟展会展览简介 虚拟展会展览…
阅读更多...
EasyExcel 简单导入/导出 Controller Demo

EasyExcel 简单导入/导出 Controller Demo

1、导入EasyExcel依赖 <!--导入EasyExcel依赖--> <dependency> <groupId>com.alibaba</groupId> <artifactId>easyexcel</artifactId> <version>3.0.5</version&g…
阅读更多...
Laya3.0 入门教程

Laya3.0 入门教程

点击play箭头 点击右边的开发者工具 就会弹出 chrome的调试窗口 然后定位到你自己的ts文件 直接在ts里断点即可 不需要js文件 如何自动生成代码&#xff1f; 比如你打开一个新项目 里面显示的是当前场景 只需要点击 UI运行时 右边的框就可以了 他会自动弹窗提示你 创建一个文…
阅读更多...
虹科分享 | 确保冻干工艺开发中精确测量和数据完整性的5步指南

虹科分享 | 确保冻干工艺开发中精确测量和数据完整性的5步指南

虹科分享 | 确保冻干工艺开发中精确测量和数据完整性的5步指南 介绍 冻干周期的工艺开发在冻干中起着至关重要的作用&#xff0c;因为它可以优化关键工艺参数&#xff0c;以实现理想的产品质量和工艺一致性。优化冻干工艺还可以缩短运行时间&#xff0c;尽早发现关键错误&…
阅读更多...
Practical Memory Leak Detection using Guarded Value-Flow Analysis 论文阅读

Practical Memory Leak Detection using Guarded Value-Flow Analysis 论文阅读

本文于 2007 年投稿于 ACM-SIGPLAN 会议1。 概述 指针在代码编写过程中可能出现以下两种问题&#xff1a; 存在一条执行路径&#xff0c;指针未成功释放&#xff08;内存泄漏&#xff09;&#xff0c;如下面代码中注释部分所表明的&#xff1a; int foo() {int *p malloc(4 …
阅读更多...
centos下安装配置redis7

centos下安装配置redis7

1、找个目录下载安装包 sudo wget https://download.redis.io/release/redis-7.0.0.tar.gz 2、将tar.gz包解压至指定目录下 sudo mkdir /home/redis sudo tar -zxvf redis-7.0.0.tar.gz -C /home/redis 3、安装gcc-c yum install gcc-c 4、切换到redis-7.0.0目录下 5、修改…
阅读更多...
解决网页 H5 对接微信 JSSDK 后自定义分享和跳转APP等没效果

解决网页 H5 对接微信 JSSDK 后自定义分享和跳转APP等没效果

导致的原因 在聊天窗口直接点击一个文本链接&#xff0c;现在微信JSSDK已经不支持这样使用。 解决办法1 将文本链接生成一个二维码&#xff0c;然后微信扫码进入这个链接。 解决办法2 将这个文本链接收藏&#xff0c;然后从收藏打开这个链接。
阅读更多...
学习记忆——数学篇——案例——代数——方程——一元二次方程

学习记忆——数学篇——案例——代数——方程——一元二次方程

重点记忆法 a x 2 b x c 0 ax^2bxc0 ax2bxc0 整体可以由&#xff1a; 根&#xff08;多少&#xff0c;正负&#xff0c;区间&#xff09; ⟹ \Longrightarrow ⟹ △ △ △ ⟹ \Longrightarrow ⟹ 求根公式 x 1 , 2 x_{1,2} x1,2​ − b △ 2 a \frac{-b\sqrt{△}}{2a} 2…
阅读更多...
LaunchView/启动页 的实现

LaunchView/启动页 的实现

1. 创建启动画板&#xff0c;LaunchScreen.storyboard 添加组件如图: 2. 项目中设置只支持竖屏&#xff0c;添加启动画板&#xff0c;如图: 3. 创建启动画面动画视图&#xff0c;LaunchView.swift import SwiftUI/// 启动视图 struct LaunchView: View {/// 字符串转换为字符串…
阅读更多...
SQL获取正数第N个或倒数第N个数据

SQL获取正数第N个或倒数第N个数据

这里我们使用Order By与Limit的组合&#xff1a; Order By&#xff1a;可以将某个序列值按照从大到小或从小到大排序Limit&#xff1a;如果类似Limit 5表示前5个&#xff0c;Limit 3,5表示从第4个位置&#xff08;以0为开始&#xff09;开始往后取5个 通过这样的组合就可以实…
阅读更多...
TensorFlow入门(十六、识别模糊手写图片)

TensorFlow入门(十六、识别模糊手写图片)

TensorFlow在图像识别方面,提供了多个开源的训练数据集,比如CIFAR-10数据集、FASHION MNIST数据集、MNIST数据集。 CIFAR-10数据集有10个种类,由6万个32x32像素的彩色图像组成,每个类有6千个图像。6万个图像包含5万个训练图像和1万个测试图像。 FASHION MNIST数据集由衣服、鞋子…
阅读更多...
社会工程学

社会工程学

1.概述 信息安全分为“硬安全 ”和“软安全 ”两个部分。所谓“硬安全”主要包括具体的IT安全技术&#xff08;比如防火墙、入侵检测、漏洞扫描、拒绝服务攻击、缓冲区溢出攻击、等等&#xff09;&#xff1b;而“软安全”主要涉及管理、心理学、文化、人际交往等方面&#xff…
阅读更多...
最新文章

Copyright @ 2022~2023