Metal 学习笔记五:3D变换
在上一章中,您通过在 vertex 函数中计算position,来平移顶点和在屏幕上移动对象。但是,在 3D 空间中,您还想执行更多操作,例如旋转和缩放对象。您还需要一个场景内摄像机,以便您可以在场景中移动。
要移动、缩放和旋转三角形,您将使用矩阵 - 一旦您掌握了一个三角形,就可以一次旋转具有数千个三角形的模型!
对于我们这些不是数学天才的人来说,向量和矩阵可能有点可怕。幸运的是,在使用数学时,您不必总是需要知道引擎盖下的内容。为了提供帮助,本章的重点不是数学,而是矩阵。在学习本章的过程中,您将逐渐扩展您的线性代数知识,因为您将了解矩阵可以为您做什么以及如何操作它们。
变换
查看下面的图片:
使用矢量图像编辑器 Affinity Designer,您可以通过一系列仿射变换来缩放和旋转猫。Affinity Designer 不会单独计算每个位置,而是创建一个包含变换组合的变换矩阵。然后,它将变换应用于每个元素。
注: 仿射表示完成变换后,所有平行线都保持平行。
当然,没有人愿意移动、缩放和旋转猫,因为它们可能会咬人。因此,您将平移、缩放和旋转三角形。
开始项目和设置
➤ 打开并运行位于本章 starter 文件夹中的 starter 项目。
此项目渲染一个三角形两次,而不是渲染一个四边形。
在 Renderer 的 draw(in:) 中,您将看到两个 draw 调用(每个三角形一个)。渲染器将 position 传递给 vertex 函数,将 color 传递给 fragment 函数;它对每个三角形执行此操作。灰色三角形位于其原始位置,红色三角形应用变换。
➤ 在继续下一步之前,请确保您理解 Renderer 的 draw(in:) 中的代码和 Shaders.metal 中的 vertex 函数。
ContentView.swift 现在位于 SwiftUI 视图组中,它在Metal View上显示网格,以便您可以更轻松地可视化顶点位置。
平移
starter项目展示两个三角形:
• 没有任何变换的灰色三角形。
• 使用position = simd_float3(0.3, -0.4, 0) 平移的红色三角形。
在上一章的第一个挑战中,您计算了着色器函数中每个顶点的位置。更常见的计算机图形范例是,在顶点缓冲区中设置模型每个顶点的位置,通常从文件加载,然后将矩阵发送到顶点着色器,着色器包含模型当前位置、旋转和缩放。
顶点和矩阵
您可以更好地将position描述为位移矢量[0.3, -0.4, 0]。每个顶点从 x 方向上移动 0.3 个单位,在 y 方向上移动 -0.4 个单位。
在下图中,蓝色箭头是矢量。
左侧蓝色箭头是值为 [-1, 2] 的向量。右侧的蓝色箭头(靠近 cat 的箭头)也是值为 [-1, 2] 的向量。position(point)是空间中的位置,而向量是空间中的位移。换句话说,向量包含移动的数量和方向。如果你要用蓝色向量来移动猫,它最终会到达点 (2, 4)。这是猫的位置 (3, 2) 加上向量 [-1, 2]。
此 2D 向量是一个 1x2 矩阵。它有一列和两行。
注: 您可以按行或列对矩阵进行排序。simd 库按列优先顺序构造矩阵,这意味着列在内存中是连续的。simd_double2x4 是包含两列四行的矩阵。
矩阵是二维数组。即使是单个数字 1 也是一个 1×1 矩阵。实际上,数字1是独一无二的,因为用任何数字乘以1都是它本身。所有方阵(行数和列数相等的矩阵),都有一个矩阵具有和1的概念相等的矩阵——单位矩阵。任何向量或矩阵乘以单位矩阵,都是它本身。
4×4 单位矩阵如下所示(全是 0,对角线 1 除外):
3D 变换矩阵有 4 行和 4 列。变换矩阵左上角的 3×3 矩阵中包含缩放和旋转信息,平移信息在最后一列中。将向量和矩阵相乘时,左侧矩阵或向量的列数必须等于右侧的行数。例如,您不能将 float3 乘以 float4×4。
矩阵的魔力
当您将矩阵相乘时,您将它们合并为一个矩阵。然后,您可以将向量乘以此矩阵来变换向量。例如,您可以设置旋转矩阵和平移矩阵。然后,您可以使用以下代码计算转换后的位置:
translationMatrix * rotationMatrix * positionVector
矩阵乘法从右向左进行。在这里,旋转应用于平移之前的位置。
这是线性代数的基础——如果你想继续学习计算机图形学,你需要更全面地理解线性代数。目前,了解设置转换矩阵的概念可以让你走很长的路。
创建矩阵
➤ 打开 Renderer.swift,找到你在 draw(in:) 中渲染第一个灰色三角形的位置。
➤ 将position代码从:
var position = simd_float3(0, 0, 0)
renderEncoder.setVertexBytes(&position,length: MemoryLayout<SIMD3<Float>>.stride,index: 11)
改为:
var translation = matrix_float4x4()
translation.columns.0 = [1, 0, 0, 0]
translation.columns.1 = [0, 1, 0, 0]
translation.columns.2 = [0, 0, 1, 0]
translation.columns.3 = [0, 0, 0, 1]
var matrix = translation
renderEncoder.setVertexBytes(&matrix,length: MemoryLayout<matrix_float4x4>.stride,index: 11)
在这里,您将创建一个单位矩阵和一个要发送到 GPU 的渲染命令。
➤ 找到第二个红色三角形的position代码并更改:
position = simd_float3(0.3, -0.4, 0)
renderEncoder.setVertexBytes(&position,length: MemoryLayout<SIMD3<Float>>.stride,index: 11)
为:
let position = simd_float3(0.3, -0.4, 0)
translation.columns.3.x = position.x
translation.columns.3.y = position.y
translation.columns.3.z = position.z
matrix = translation
renderEncoder.setVertexBytes(&matrix,length: MemoryLayout<matrix_float4x4>.stride,index: 11)
您将使用此矩阵来平移顶点着色器中的position。
➤ 打开 Shaders.metal,然后更改:
constant float3 &position [[buffer(11)]])
为:
constant float4x4 &matrix [[buffer(11)]])
您将接收传入着色器中的矩阵。
➤ 在 vertex 函数中,更改:
float3 translation = in.position.xyz + position;
为:
float3 translation = in.position.xyz + matrix.columns[3].xyz;
使用矩阵的第四列作为位移向量。
➤ 构建并运行。到目前为止,输出是相同的。
请记住,此矩阵还将保存旋转和缩放信息。要计算position,您需要执行矩阵乘法,而不是添加平移位移向量。
➤ 将 vertex 函数的内容改为:
float4 translation = matrix * in.position;
VertexOut out {.position = translation
};
return out;
➤ 构建并运行应用程序,您会发现仍然没有变化。
现在,您可以在 Renderer 中向矩阵添加缩放和旋转,而无需每次更改着色器函数。
缩放
➤ 打开 Renderer.swift,然后在 draw(in:) 中找到第二个红色三角形中设置 matrix 的位置。
➤ 在 matrix = translation 之前,添加以下内容:
let scaleX: Float = 1.2
let scaleY: Float = 0.5
let scaleMatrix = float4x4([scaleX, 0, 0, 0],[0, scaleY, 0, 0],[0, 0, 1, 0],[0, 0, 0, 1])
您可以像这样初始化一个矩阵,将列定义为数组,而不是像在“平移”中所做的那样分配给列。scaleMatrix.columns.0 现在包含 [1.2, 0, 0, 0]。
无需过多地进行数学研究,就可以使用此代码来设置缩放矩阵。
➤ 将 matrix = translation更改为: matrix = scaleMatrix
将平移矩阵乘以缩放矩阵,而不是乘以平移矩阵。
➤ 构建并运行应用程序。
在 vertex 函数中,矩阵将三角形的每个顶点乘以 x 和 y 缩放因子。
➤ 将 matrix = scaleMatrix 更改为: matrix = translation * scaleMatrix
此代码平移缩放的三角形。
➤ 构建并运行应用程序。
旋转
执行旋转的方式与缩放类似。
➤ 将 matrix = translation * scaleMatrix,改为:
let angle = Float.pi / 2.0
let rotationMatrix = float4x4([cos(angle), -sin(angle), 0, 0],[sin(angle), cos(angle), 0, 0],[0, 0, 1, 0],[0, 0, 0, 1])
matrix = rotationMatrix
在这里,您可以设置围绕 z 轴旋转的角度(以弧度为单位)。
注意:Float.pi / 2.0 与 90° 相同,均为 1.5708 弧度。弧度是计算机图形学中的标准单位。这是将度数转换为弧度的公式:度数 * pi / 180 = 弧度。
➤ 构建并运行,您将看到红色三角形的每个顶点如何围绕原点 [0, 0, 0] 旋转 90°。
➤ 将 matrix = rotationMatrix 替换为:
matrix = translation * rotationMatrix * scaleMatrix
此代码首先缩放每个顶点,然后旋转,然后平移。
➤ 构建并运行。
矩阵运算的顺序很重要。尝试更改顺序,看看会发生什么。
缩放和旋转发生在原点 (坐标 [0, 0, 0])。但是,有时您可能希望围绕不同的点进行旋转。例如,当三角形处于其原始位置(即与灰色三角形相同的位置和旋转角度)时,让我们围绕三角形的最右边点旋转三角形。
要旋转三角形,您需要设置一个平移矩阵,其中向量位于原点和最右侧点之间,执行以下步骤:
1. 使用平移矩阵平移所有顶点。
2. 旋转。
3. 再次平移回来。
➤ 在对红色小三角设置矩阵之前,添加以下代码:
translation.columns.3.x = triangle.vertices[2].x
translation.columns.3.y = triangle.vertices[2].y
translation.columns.3.z = triangle.vertices[2].z
将变换矩阵设置为(从原点)移动到(灰色)三角形的第三个顶点,即最右侧的点。
记住这些步骤。第 1 步是按距原点的距离平移所有顶点。您可以通过将矩阵设置为顶点的向量值并使用平移矩阵的逆矩阵来实现此目的。
在执行以下每个步骤后,不要忘记构建并运行应用程序,以便您可以查看矩阵乘法的作用。
➤ 将matrix = translation * rotationMatrix * scaleMatrix 更改为: matrix = translation.inverse
此代码将最右侧的顶点放在原点处,以相同的距离平移所有其他顶点。
➤ 将您刚刚输入的代码更改为:
matrix = rotationMatrix * translation.inverse
三角形绕原点旋转 90°。
➤ 将您刚刚输入的代码更改为:
matrix = translation * rotationMatrix * translation.inverse
匪夷所思!您正在执行按最右侧顶点与原点的距离平移每个顶点的所有步骤。之后,您将旋转每个顶点并再次将其平移回来,使三角形围绕其最右侧的点旋转。
参考
https://zhuanlan.zhihu.com/p/387152681
相关文章:
Metal 学习笔记五:3D变换
在上一章中,您通过在 vertex 函数中计算position,来平移顶点和在屏幕上移动对象。但是,在 3D 空间中,您还想执行更多操作,例如旋转和缩放对象。您还需要一个场景内摄像机,以便您可以在场景中移动。 要移动…...
Android-创建mipmap-anydpi-v26的Logo
利用 Android Studio 自动创建 创建新项目:打开 Android Studio,点击 “Start a new Android Studio project” 创建新项目。在创建项目的过程中,当设置Target SDK Version为 26 或更高版本时,Android Studio 会在项目的res目录下…...
DOM 事件 HTML 标签属性速查手册
以下是一份 DOM 事件 & HTML 标签属性速查手册,涵盖常用场景和示例,助你快速查阅和使用: 一、DOM 事件速查表 1. 鼠标事件 事件名触发时机适用元素示例代码click元素被点击任意可见元素button.addEventListener(click, () > { ... …...
差旅费控平台作用、功能、11款主流产品优劣势对比
本文将对比以下11款主流费控系统:合思、喜报销、泛微费控报销系统、经贝管家、每刻报销、SAP Concur、Expensify、Zoho Expense等。 随着全球化和企业跨地区运营的不断发展,企业差旅管理已逐渐成为许多公司面临的管理挑战之一。从差旅申请到费用报销的全…...
常用的配置文件格式对比(ini,toml,yaml,json,env,settings.py)及应用程序修改自身配置并保留注释
代码与环境配置解耦 git分支的代码应做到“环境无关”:代码本身不硬编码任何环境特定的配置(如数据库连接、密钥、API地址),而是通过外部机制动态注入。 配置与代码分离:将配置信息存储在代码库之外(如环…...
MySQL 存储过程详解
文章目录 1. 存储过程定义1.1 基本概念1.2 核心特点1.3 存储过程 vs 函数 2. 工作原理与示意图2.1 执行流程2.2 示意图 3. 使用场景3.1 复杂业务逻辑3.2 批量数据处理3.3 权限控制3.4 性能优化 4. 示例与说明4.1 基础示例:创建存储过程4.2 带输出参数的存储过程4.3 …...
使用DeepSeek/chatgpt等AI工具辅助网络协议流量数据包分析
随着deepseek,chatgpt等大模型的能力越来越强大,本文将介绍一下deepseek等LLM在分数流量数据包这方面的能力。为需要借助LLM等大模型辅助分析流量数据包的同学提供参考,也了解一下目前是否有必要继续学习wireshark工具以及复杂的协议知识。 pcap格式 目…...
源码压缩包泄露
##解题思路 因为网站的文件都放在www下面,所以直接访问/www.zip就可以得到网页的源码压缩包 在fl000g.txt这个文件中看到一个flag{flag_here}不像是真的flag,尝试提交ctfshow{flag_here},果然提交失败 打开文件属性之类的,也没有…...
TCP/IP 5层协议簇:数据链路层(交换机工作原理)
目录 1. 数据链路层 2. 帧 3. 工作在数据链路层的设备 4. 交换机工作原理 1. 数据链路层 数据链路层(2层Data Link Layer):传输单元是帧、这层工作的主要设备二层交换机、网卡 2. 帧 帧的结构如下:帧最大1518字节 如下&…...
TCP/IP的分层结构、各层的典型协议,以及与ISO七层模型的差别
1. TCP/IP的分层结构 TCP/IP模型是一个四层模型,主要用于网络通信的设计和实现。它的分层结构如下: (1) 应用层(Application Layer) 功能:提供应用程序之间的通信服务,处理特定的应用细节。 典型协议&am…...
【分布式理论11】分布式协同之分布式事务(一个应用操作多个资源):从刚性事务到柔性事务的演进
文章目录 一. 什么是分布式事务?二. 分布式事务的挑战三. 事务的ACID特性四. CAP理论与BASE理论1. CAP理论1.1. 三大特性1.2. 三者不能兼得 2. BASE理论 五. 分布式事务解决方案1. 两阶段提交(2PC)2. TCC(Try-Confirm-Cancel&…...
Linux: 已占用接口
Linux: 已占用接口 1. netstat(适用于旧系统)1.1 书中对该命令的介绍 2. ss(适用于新系统,替代 netstat)3. lsof(查看详细进程信息)4. fuser(快速查找占用端口的进程)5. …...
HWUI 和 Skia
📌 HWUI 和 Skia 的关系 Skia 是 Android 的底层 2D 图形库,提供 CPU 和 GPU 渲染能力,支持 OpenGL、Vulkan、Metal 等后端。HWUI 是 Android UI 组件的 GPU 渲染引擎,主要用于 加速 View、动画、阴影等 UI 元素的绘制。HWUI 依赖…...
Pytorch使用手册--将 PyTorch 模型导出为 ONNX(专题二十六)
注意 截至 PyTorch 2.1,ONNX 导出器有两个版本。 torch.onnx.dynamo_export 是最新的(仍处于测试阶段)导出器,基于 PyTorch 2.0 发布的 TorchDynamo 技术。 torch.onnx.export 基于 TorchScript 后端,自 PyTorch 1.2.0 起可用。 一、torch.onnx.dynamo_export使用 在 60 …...
GitHub SSH连接问题解决指南
🔍 GitHub SSH连接问题解决指南 问题描述 遇到错误:ssh: connect to host github.com port 22: Connection refused 说明您的网络环境无法访问GitHub的SSH端口22,常见原因: 防火墙/网络运营商限制(国内常见…...
【Linux】vim 设置
【Linux】vim 设置 零、起因 刚学Linux,有时候会重装Linux系统,然后默认的vi不太好用,需要进行一些设置,本文简述如何配置一个好用的vim。 壹、软件安装 sudo apt-get install vim贰、配置路径 对所有用户生效: …...
2025届开发岗秋招经验教训总结
实习 实习的作用: 学习知识,充实简历了解特定部门的氛围转正比秋招提前占坑提前展现工作能力,争取更高起薪 其中,除非有梦中情组,我认为占坑是最不重要的一个,因为现在的校招就业形势并未严峻到转正占满…...
Java 之集成 DataX 数据同步工具
1、官网下载 DataX https://github.com/alibaba/DataX 2、将依赖添加到本地(DataX没有maven坐标,需要自己安装) mvn install:install-file -Dfile"datax-common-0.0.1.jar" "-DgroupIdcom.datax" "-DartifactIdda…...
JMH 详细使用
JMH 基本使用 官方地址 JMH 是一个用于 Java 代码微基准测试的工具,允许开发者对特定部分进行精确的性能测试; 安装 JMH 环境: Maven 项目;JDK 8; Maven 方式安装 引入如下依赖: <dependencies>…...
2025 PHP授权系统网站源码
2025 PHP授权系统网站源码 安装教程: PHP7.0以上 先上传源码到服务器,然后再配置伪静态, 访问域名根据操作完成安装, 然后配置伪静态规则。 Ngix伪静态规则: location / { if (!-e $request_filename) { rewrite …...
【对话推荐系统】Towards Topic-Guided Conversational Recommender System 论文阅读
Towards Topic-Guided Conversational Recommender System 论文阅读 Abstract1 Introduction2 Related Work2.1 Conversation System2.2 Conversational Recommender System2.3 Dataset for Conversational Recommendation 3 Dataset Construction3.1 Collecting Movies for Re…...
git 使用常见错误整理
1. git am 应用补丁时遇到错误 fatal: previous rebase directory .git/rebase-apply still exists but mbox given fatal:之前的变基目录 .git/rebase-apply仍然存在,但却提供了mbox 答:这通常是因为之前的 git am 或 git rebase 操作失败后…...
数据存储:一文掌握存储数据到mysql的详细使用
文章目录 一、环境准备1.1 安装MySQL数据库1.2 安装Python MySQL驱动 二、连接到MySQL数据库三、执行基本的CRUD操作3.1 创建(Create):插入数据3.2 读取(Read):查询数据3.3 更新(Update…...
React 源码揭秘 | 更新队列
前面几篇遇到updateQueue的时候,我们把它先简单的当成了一个队列处理,这篇我们来详细讨论一下这个更新队列。 有关updateQueue中的部分,可以见源码 UpdateQueue实现 Update对象 我们先来看一下UpdateQueue中的内容,Update对象&…...
Vue3 + Vite + TS,使用 配置项目别名属性:resolve
使用 resolve 配置全局项目路径别名 1.优化了开发中单页面引用其他模块的路径复杂性 2.妥妥解决了,组件复用当中提高开发效率 // 不使用配置 import { useStore } from ../../../stores // 使用配置 可根据开发者需求任意定义,较多 import { useStore…...
使用 C# 以api的形式调用 DeepSeek
一:创建 API 密钥 首先,您需要来自 DeepSeek 的 API 密钥。访问 DeepSeek,创建一个帐户,并生成一个新的 API 密钥。 二:安装所需的 NuGet 包 使用 NuGet 包管理器安装包,或在包管理器控制台中运行以下命…...
手机放兜里,支付宝“碰一下”被盗刷?
大家好,我是小悟。 近期,网络上关于“支付宝‘碰一下’支付易被盗刷”的传言甚嚣尘上,不少用户对此心生疑虑。 首先,要明确一点:“碰一下”支付并不会像某些传言中所描述的那样容易被隔空盗刷。这一观点已经得到了支付…...
0x01 html和css
css 对于三种css使用方式: 第一种:行内样式 <span style"color: grey;">2024年05月15日 20:07</span>第二种:内部样式 <!DOCTYPE html> <html lang"en"> <head>...<style>span{…...
模型和数据集的平台之在Hugging Face上进行模型下载、上传以及创建专属Space
模型下载 步骤: 注册Hugging Face平台 https://huggingface.co/ 新建一个hf_download_josn.py 文件 touch hf_download_josn.py 编写hf_download_josn.py文件 import os from huggingface_hub import hf_hub_download# 指定模型标识符 repo_id "inter…...
轮式机器人在复杂地形中如何选择合适的全局路径规划算法?
已思考完成 收起 嗯,用户问的是轮式机器人在复杂地形中如何选择合适的全局路径规划算法。首先,我需要理解复杂地形可能带来的挑战,比如崎岖的路面、动态障碍物、非结构化环境等等。轮式机器人在这里的运动控制需要考虑地形通过性、稳定性&…...
免费使用 DeepSeek API 教程及资源汇总
免费使用 DeepSeek API 教程及资源汇总 一、DeepSeek API 资源汇总1.1 火山引擎1.2 百度千帆1.3 阿里百炼1.4 腾讯云 二、其他平台2.1 华为云2.2 硅基流动 三、总结 DeepSeek-R1 作为 2025 年初发布的推理大模型,凭借其卓越的逻辑推理能力和成本优势,迅速…...
文献汇总|AI生成图像检测相关数据集汇总
前言:本博客汇总当前AI生成图像检测领域用到的数据集及相关链接。 ⚠️:除标注「未公开」数据集,其余数据集均已开源。 目录 2020202220232024 2020 CNNSpot https://github.com/peterwang512/CNNDetection Testset: The zip file contains …...
C# 弃元的使用
总目录 前言 在C# 7.0及更高版本中,弃元(Discard)是一个新的语言特性,允许开发者在特定情况下忽略某些值。弃元用下划线 _ 作为占位符,明确表示忽略某个值,提升代码可读性 一、弃元是什么? 1.…...
蓝桥杯备考:贪心算法之矩阵消除游戏
这道题是牛客上的一道题,它呢和我们之前的排座位游戏非常之相似,但是,排座位问题选择行和列是不会改变元素的值的,这道题呢每每选一行都会把这行或者这列清零,所以我们的策略就是先用二进制把选择所有行的情况全部枚举…...
React面试(一)
文章目录 1.vue和react有什么异同2.useEffect中为什么不能使用异步3.useEffect和useLayoutEffect的区别4.react的生命周期5.state和prop的区别6.受控组件和非受控组件7.为什么react16之后不把事件挂载到document上了8.讲一下react的hoc,它可以用来做什么?…...
《解锁AI密码,机器人精准感知环境不再是梦!》
在科技飞速发展的当下,人工智能与机器人技术的融合正深刻改变着世界。其中,人工智能助力机器人实现更精准的环境感知,已成为该领域的核心课题,吸引着全球科研人员与科技企业的目光。这不仅关乎机器人能否在复杂环境中高效执行任务…...
C/C++语言知识点二
1. 编程算法之“哨兵”思想 哨兵思想是一种编程技巧,通过在数据结构的边界或特定位置放置一个特殊值(称为“哨兵”),来简化逻辑判断和提高代码效率。哨兵通常是一个标记值,用于指示某种条件或边界,从而避免…...
【SpringBoot】——分组校验、自定义注解、登入验证(集成redis)、属性配置方式、多环境开发系统学习知识
🎼个人主页:【Y小夜】 😎作者简介:一位双非学校的大三学生,编程爱好者, 专注于基础和实战分享,欢迎私信咨询! 🎆入门专栏:🎇【MySQL࿰…...
【EB-03】 AUTOSAR builder与EB RTE集成
AUTOSAR builder与EB RTE集成 1. Import Arxml files to Tresos2. Run MultiTask Script3. Add Components3.1 Run EcuExtractCreator Script4. Mapping Component to Partitions5. Event Mapping/Runnables Mapping to Tasks6. Port Connect7. Run SvcAs_Trigger Script8. Ver…...
布署elfk-准备工作
建议申请5台机器部署elfk: filebeat(每台app)--> logstash(2台keepalived)--> elasticsearch(3台)--> kibana(部署es上)采集输出 处理转发 分布式存储 展示 ELK中文社区: 搜索客,搜索人自己的社区 官方…...
JVM垃圾回收器深度底层原理分析与知识体系构建
一、垃圾回收的基本步骤 标记(Marking) 从GC Roots(如虚拟机栈、方法区静态变量、本地方法栈等)出发,遍历对象引用链,标记所有可达对象为存活对象,未被标记的则视为垃圾。此阶段需暂停用户线程&…...
Flutter系列教程之(5)——常用控件Widget的使用示例
目录 1.页面跳转 2.某个控件设置点击事件 3.AlertDialog对话框的使用 4.文本输入框 5.按钮 圆角扁平按钮: 圆角悬浮按钮: 6.补充 圆点 7.布局使用 Row控件左右对齐 调整边距 1.页面跳转 首先,先介绍一下页面跳转功能吧 Flutter使用 Navigator 进行页面…...
快手前端通用静态托管服务KFX演进历程:从崎岖土路到平坦高速
快手静态部署托管服务(KFX)历经四年发展,经历了三个阶段,一步步从勉强能行车的“崎岖土路”到现在多车道并行的“平坦高速”,这一转变极大地提升了资源利用率和效率,满足业务的实际需要。本文将带你了解其背…...
hackmyvm-buster
题目地址 信息收集 主机发现 ┌──(root㉿kali)-[/home/kali] └─# arp-scan -I eth1 192.168.56.0/24 Interface: eth1, type: EN10MB, MAC: 00:0c:29:34:da:f5, IPv4: 192.168.56.103 WARNING: Cannot open MAC/Vendor file ieee-oui.txt: Permission denied WARNING: C…...
React加TypeScript最新部署完整版
React TypeScript 全流程部署指南 一、环境准备与项目初始化 关于node.js及npm的安装请参见我的文章。 1.1 创建项目(React TypeScript) # 使用官方推荐脚手架(Vite 5.x) npx create-vitelatest my-app --template react-ts …...
DeepSeek-R1-Zero:基于基础模型的强化学习
注:此文章内容均节选自充电了么创始人,CEO兼CTO陈敬雷老师的新书《自然语言处理原理与实战》(人工智能科学与技术丛书)【陈敬雷编著】【清华大学出版社】 文章目录 DeepSeek大模型技术系列四DeepSeek大模型技术系列四》DeepSeek-…...
python的列表和元组别再傻傻分不清啦
目录 什么是下标: 正数索引:正数索引从左到右,从 0 开始。 负数索引:负数索引从右到左,从 -1 开始。 切片(slice):除了单个元素,Python还支持通过切片访问序列的子集。…...
Fiddler在Windows下抓包Https
文章目录 1.Fiddler Classic 配置2.配置浏览器代理自动代理手动配置浏览器代理 3.抓取移动端 HTTPS 流量(可选)解决抓取 HTTPS 失败问题1.Fiddler证书过期了 默认情况下,Fiddler 无法直接解密 HTTPS 流量。需要开启 HTTPS 解密: 1…...
【超详细】神经网络的可视化解释
《------往期经典推荐------》 一、AI应用软件开发实战专栏【链接】 项目名称项目名称1.【人脸识别与管理系统开发】2.【车牌识别与自动收费管理系统开发】3.【手势识别系统开发】4.【人脸面部活体检测系统开发】5.【图片风格快速迁移软件开发】6.【人脸表表情识别系统】7.【…...
LVS+Keepalived 高可用集群搭建
一、高可用集群: 1.什么是高可用集群: 高可用集群(High Availability Cluster)是以减少服务中断时间为目地的服务器集群技术它通过保护用户的业务程序对外不间断提供的服务,把因软件、硬件、人为造成的故障对业务的影响…...