当前位置: 首页 > news >正文

[react]Next.js之自适应布局和高清屏幕适配解决方案

序言

阅读前首先了解即将要用到的两个包的作用

    1.postcss-pxtorem

    • 自动将 CSS 中的 px 单位转换为 rem 单位
    • 按照设计稿尺寸直接写 px 值,由插件自动计算 rem 值

    2.amfe-flexible

    • 动态设置根元素的 font-size(即 1rem 的值)
    • 根据设备屏幕宽度和 DPR 调整页面缩放比例
    • 解决 1px 边框问题 

    工作流程

    1.单独使用 postcss-pxtorem

    • CSS源码 → postcss-pxtorem转换 → 固定rem值的CSS → 浏览器渲染(无动态调整)

    2.单独使用 amfe-flexible

    • 浏览器加载 → amfe-flexible执行 → 动态计算html的font-size → 开发者手动用JS计算rem值 → 页面渲染

    3.搭配一起使用

    • 设计稿(1440px) → postcss-pxtorem(÷144) → CSS(rem) → 浏览器 → amfe-flexible动态计算 → 实际渲染 

    一:  css文件的px自动转rem

    1. 安装

    $ npm i postcss-pxtorem -D

    2. 配置文件

    // 修改根目录的postcss.config.mjs文件 ESM版
    // 如果你的文件是postcss.config.js(CJS版), 自行百度教程
    const config = {// 注意:你的项目是plugins: ["@tailwindcss/postcss"], 没关系可以改成下面的对象结构plugins: {"@tailwindcss/postcss": {}, // 新增 postcss-pxtorem"postcss-pxtorem": {rootValue: 144, // 设计稿宽度/10 [注意: 如果不搭配amfe-flexible使用, 那么填写16即可, 因为1rem = 16px]propList: ["*", "!font*", "!font-size"], // 忽略字体相关属性,字体不需要remexclude: /node_modules/i, // 排除 node_modules 文件minPixelValue: 2, // 小于 2px 不转换mediaQuery: false, // 不转换媒体查询中的 pxselectorBlackList: ["html"], // 黑名单,不转换的选择器 [注意: 如果不搭配amfe-flexible使用, 这行可以注释]},// 可选的 autoprefixer(推荐添加, 让项目兼容性更好, 记得安装包npm i autoprefixer -D)autoprefixer: {overrideBrowserslist: ["last 2 versions", "> 1%"],},},
    };export default config;
    

    二: 动态设置html的font-size

    现在百度存在最多的是lib-flexible的教程(已停止维护), 今天开始新项目就用amfe-flexible吧

    1. 安装

    $ npm i amfe-flexible -S

    2. 新建文件

    // 新建 AmfeFlexible.tsx , 与layout.tsx平级
    'use client';import { useEffect } from 'react';export default function AmfeFlexible() {useEffect(() => {if (typeof window !== 'undefined') {import('amfe-flexible');}}, []);return null;
    }
    // src目录下新建 @types\amfe-flexible\index.d.ts , 与app文件夹同级
    declare module 'amfe-flexible' {const flexible: {init: (options?: {designWidth?: number;designHeight?: number;maxWidth?: number;minWidth?: number;}) => void;};export default flexible;}

    3. 配置文件

    // 配置src/app下的 layout.tsx ,以下代码已精简, 新增内容已标注
    import { AntdRegistry } from "@ant-design/nextjs-registry";
    import zhCN from "antd/locale/zh_CN";
    import { ConfigProvider } from "antd";
    // 新增
    import AmfeFlexible from "./AmfeFlexible";export default function RootLayout({children,
    }: Readonly<{children: React.ReactNode;
    }>) {return (<html lang="zh"><head>//新增<metaname="viewport"content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"/></head><body>//新增<AmfeFlexible /><ConfigProvider locale={zhCN}><AntdRegistry>{children}</AntdRegistry></ConfigProvider></body></html>);
    }
    

    题外话

    如果你web项目用tailwind, 那么上面的方案就行不通了, 目前我能想到的解决方案就是让ui设计的时候px尽量为@4的倍数.

    因为tailwind的默认间距是0.25, 0.25*4=1, 在tailwind项目中, 如标题高度是64px, 这时候除以4, 得到16, 那么h-16 就写好了, 这样方便我们进行换算(如果你有自动转换方法一定要留言告诉我!)

    可能会有人说用h-[64px]就好了, 但是不符合我适配多端的需求, 如果只有响应式的需求就用tailwind的sm, md, lg, xl, 2xl就好, ui出多尺寸设计图.

    相关文章:

    [react]Next.js之自适应布局和高清屏幕适配解决方案

    序言 阅读前首先了解即将要用到的两个包的作用 1.postcss-pxtorem 自动将 CSS 中的 px 单位转换为 rem 单位按照设计稿尺寸直接写 px 值&#xff0c;由插件自动计算 rem 值 2.amfe-flexible 动态设置根元素的 font-size&#xff08;即 1rem 的值&#xff09;根据设备屏幕宽度和…...

    TensorFlow深度学习实战——基于语言模型的动态词嵌入技术

    TensorFlow深度学习实战——基于语言模型的动态词嵌入技术 0. 前言1. 基于语言模型的词嵌入1.1 ELMo 与 ULMFiT1.2 GPT1.3 BERT 2. 使用 BERT 作为特征提取器相关链接 0. 前言 基于语言模型的词嵌入技术&#xff0c;通过利用上下文信息来生成动态的词向量&#xff0c;大大提升…...

    欧拉服务器操作系统部署deekseep(Ollama+DeekSeep+open WebUI)

    ​​一、解压并安装 Ollama​​ # 1. 解压文件&#xff08;默认会得到一个二进制文件&#xff09; tar -xzvf ollama-linux-amd64.tgz# 2. 将二进制文件安装到系统路径 sudo mv ollama /usr/local/bin/ sudo chmod x /usr/local/bin/ollama# 3. 验证安装 ollama --version链接…...

    cocosCreator安卓隐私弹窗(链接版)

    每次新上游戏都要重新弄这个隐私弹窗,记录一下下次直接抄。 一、创建Activity 1 用androidStudio 打开项目并切换到Android视角。 2 右键项目new一个空的Activity 3 修改Activity的名字并完成如下图 二、增加依赖文件 1 增加全局颜色定义文件:项目根目录 / res/values/ …...

    统计销量前十的订单

    传入参数&#xff1a; 传入begin和end两个时间 返回参数 返回nameList和numberList两个String类型的列表 controller层 GetMapping("/top10")public Result<SalesTop10ReportVO> top10(DateTimeFormat(pattern "yyyy-MM-dd") LocalDate begin,Dat…...

    【Python爬虫】简单案例介绍2

    本文继续接着我的上一篇博客【Python爬虫】简单案例介绍1-CSDN博客 目录 跨页 3.2 环境准备 跨页 当对单个页面的结构有了清晰的认识并成功提取数据后&#xff0c;接下来就需要考虑页面之间的跨页问题。此时我们便迎来了下一个关键任务&#xff1a;如何实现跨页爬取&#xf…...

    适合单片机裸机环境的运行的软件定时器框架

    如下这篇文档介绍了一个适用于裸机环境的软件定时器模块&#xff0c;其核心功能和实现如下&#xff1a; 模块功能&#xff1a;该模块通过硬件定时器中断实现时基累加&#xff0c;适合用于裸机程序的调度处理。它使用硬件定时中断&#xff08;如1ms一次&#xff09;来增加hw_ti…...

    【ComfyUI】蓝耘元生代 | ComfyUI深度解析:高性能AI绘画工作流实践

    【作者主页】Francek Chen 【专栏介绍】 ⌈ ⌈ ⌈人工智能与大模型应用 ⌋ ⌋ ⌋ 人工智能&#xff08;AI&#xff09;通过算法模拟人类智能&#xff0c;利用机器学习、深度学习等技术驱动医疗、金融等领域的智能化。大模型是千亿参数的深度神经网络&#xff08;如ChatGPT&…...

    js的es6模块中 暴露的使用方法简介

    在 JavaScript 的 ES6 模块系统中&#xff0c;一个模块文件只能有一个 export default。export default 用于导出一个默认值&#xff0c;这个默认值在导入时可以使用任意名称。 示例&#xff1a; 导出默认值&#xff1a; // myModule.jsexport default function greet() {con…...

    基于Android的旅游自助APP(源码+lw+部署文档+讲解),源码可白嫖!

    摘要 旅游自助APP设计的目的是为用户提供对景点信息和路线攻略、周边美食等方面的平台。 与PC端应用程序相比&#xff0c;旅游自助的设计主要面向于旅行者&#xff0c;旨在为用户提供一个旅游自助。用户可以通过APP及时景点信息&#xff0c;并对景点进行购票或收藏等。相反&am…...

    SQL(7):合并字段,使用UNION,首先应使用SELECT进行检索,再使用UMION进行拼接

    核心功能&#xff1a;合并查询结果 想象一下&#xff0c;你有两个不同的名单&#xff0c;你想把它们合并成一个大名单。UNION 和 UNION ALL 都是 SQL 里用来干这个“合并名单”的活儿的。它们可以把两个&#xff08;或更多&#xff09;SELECT 查询语句的结果合并到一起&#x…...

    Spring MVC 全栈指南:RESTful 架构、核心注解与 JSON 实战解析

    目录 RESTful API 设计规范Spring MVC 核心注解解析静态资源处理策略JSON 数据交互全解高频问题与最佳实践 一、RESTful API 设计规范 1.1 核心原则 原则说明示例 URI资源为中心URI 使用名词&#xff08;复数形式&#xff09;/users ✔️ /getUser ❌HTTP 方法语义化GET&…...

    【第43节】实验分析windows异常分发原理

    目录 前言 一、异常处理大致流程图 二、实验一&#xff1a;分析 KiTrap03 三、实验二&#xff1a;分析CommonDispatchException 四、代码探究&#xff1a;分析 KiDispatchException 函数 五、代码探究&#xff1a;伪代码分析用户层KiUserExceptionDispatcher 前言 在Wind…...

    自动化测试概念篇

    文章目录 目录1. 自动化1.1 自动化概念1.1.1 回归测试 1.2 自动化分类1.3 自动化测试金字塔 2. web自动化测试2.1 驱动2.1.1 安装驱动管理2.1.2 selenium库 3. Selenium3.1 一个简单的web自动化示例3.2 selenium驱动浏览器的工作原理 目录 自动化web自动化测试Selenium 1. 自…...

    「数据可视化 D3系列」之开篇:开启数据可视化之旅

    一、系列介绍 欢迎来到《快速学习D3.js》系列&#xff01;在这个系列中&#xff0c;我们将一起从零开始掌握D3.js&#xff08;Data-Driven Documents&#xff09;&#xff0c;一个强大的JavaScript库&#xff0c;用于创建动态、交互式的数据可视化。 无论你是前端开发者、数据…...

    编译构建 WSO2 产品时的一些注意事项

    编译构建 WSO2 产品时的一些注意事项 1、JDK 版本2、maven 版本3、npm 和 node 版本4、编译命令示例 1、JDK 版本 对于 WSO2 ESB、WSO2 EI 老产品&#xff0c;可以直接使用 JDK 1.8对于 WSO2 APIM、WSO2 IS、WSO2 MI 等产品的新版本&#xff0c;需要 JDK 11 以上 特别注意&…...

    字符串与相应函数(下)

    字符串处理函数分类 求字符串长度&#xff1a;strlen长度不受限制的字符串函数&#xff1a;strcpy,strcat,strcmp长度受限制的字符串函数:strncpy,strncat,strncmp字符串查找&#xff1a;strstr字符串切割&#xff1a;strtok错误信息报告&#xff1a;strerror字符操作&#xf…...

    驾驭 Linux 云: JavaWeb 项目安全部署

    目录 1. 引言 2. Linux 基础指令 2.1 ls 展示目录/文件 2.2 pwd 查看所在路径 2.3 mkdir 创建文件夹 2.4 cd 切换路径 2.5 touch 创建文件 2.6 rm 删除文件 2.6 rm -r/rf 删除文件夹 2.7 rz/sz 上传/下载文件 2.7.1 rz 上传文件 2.7.2 sz 下载文件 2.8 mv 移动文件…...

    【MySQL数据库】InnoDB存储引擎:逻辑存储结构、内存架构、磁盘架构

    逻辑存储结构 一个数据库是由一张张表组成的&#xff0c;而表中是由一个个段构成的&#xff0c;一个段是由区构成的&#xff0c;区空间是由页构成的&#xff0c;页是行构成的。 ①表空间&#xff1a;.ibd文件&#xff0c;一个mysql实例可以对应多个表空间&#xff0c;用于存储…...

    HJ16 购物单

    https://www.nowcoder.com/exam/oj/ta?tpId37 HJ16 购物单 描述 王强决定把年终奖用于购物&#xff0c;他把想买的物品分为两类&#xff1a;主件与附件。 主件可以没有附件&#xff0c;至多有 2个附件。附件不再有从属于自己的附件。如果要买归类为附件的物品&#xff0c;必…...

    SLAM文献之DM-VIO: Delayed Marginalization Visual-Inertial Odometry

    1. 算法概述 DM-VIO (Delayed Marginalization Visual-Inertial Odometry) 是一种基于延迟边缘化的视觉-惯性里程计算法&#xff0c;它结合了视觉和惯性测量单元(IMU)的数据进行位姿估计。该算法是VINS-Mono的改进版本&#xff0c;主要创新点在于采用了一种延迟边缘化策略&…...

    【信息安全】黑芝麻A1000芯片安全启动方案

    基于黑芝麻A1000芯片的安全启动方案实现指南: 一、安全启动流程架构设计 // 启动阶段状态机定义(基于A1000芯片手册) typedef enum {ROM_BOOT = 0x01, // BootROM验证 SPL_VERIFY = 0x02, // 二级加载器验证 ATF_SIGN_CHECK = 0x03, // ARM Trusted Firmware验证 OS_LOADE…...

    初识Redis · list和hash类型

    目录 前言&#xff1a; 哈希类型 基本命令 编码方式 应用场景 列表 基本命令 编码方式 应用场景 前言&#xff1a; 前文我们已经介绍了string的基本使用&#xff0c;以及对应的基本命令&#xff0c;最后也是简单的理解了一下string的应用场景&#xff0c;比如计数统计…...

    golang-非orm数据库的操作与对比 database/sql、sqlx 和 sqlc

    简单介绍 database/sql database/sql 是一个标准库软件包&#xff0c;负责与数据库&#xff08;主要是 SQL 关系数据库&#xff09;的连接和交互。 它为类 SQL 交互提供泛型接口、类型和方法。database/sql 在创建时将简单易用纳入考量&#xff0c;配置为支持与类 SQL 数据库…...

    ‌DeepSeek模型在非图形智能体的应用中是否需要GPU

    答&#xff1a;不一定 概念 1、是否需要GPU与应用是否图形处理应用无关 2、文本内容智能体大多也需要GPU来提供更好的性能 3、‌DeepSeek模型在非图形智能体的应用中是否需要GPU取决于具体的模型版本和部署环境 不需要GPU的模型版本 ‌DeepSeek-R1-1.5B‌&#xff1a; 这…...

    RadioMaster POCKET遥控器进入ExpressLRS界面一直显示Loading的问题解决方法

    RadioMaster POCKET遥控器进入ExpressLRS界面一直显示Loading的问题解决方法 问题描述解决方法 问题描述 有一天我发现我的 RadioMaster POCKET 遥控器进入 ExpressLRS 设置界面时&#xff0c;界面却一直停留在 “Loading” 状态&#xff0c;完全无法进入设置界面。 我并没有…...

    idea的快捷键使用以及相关设置

    文章目录 快捷键常用设置 快捷键 快捷键作用ctrlshift/注释选中内容Ctrl /注释一行/** Enter文档注释ALT SHIFT ↑, ALT SHIFT ↓上下移动当前代码Ctrl ALT L格式化代码Ctrl X删除所在行并复制该行Ctrl D复制当前行数据到下一行main/psvm快速生成入口程序soutSystem.o…...

    【DDR 内存学习专栏 1.4 -- DDR 的 Bank Group】

    文章目录 BankgroupBankgroup 与 Bank 的关系 DDR4 中的 BankgroupDDR4-3200 8Gb芯片为例组织结构访问场景 实际应用示例 Bankgroup Bankgroup是DDR4及后续标准(DDR5)中引入的一个更高层次的组织结构。它将多个Bank组合在一起形成一个Bankgroup&#xff0c;目的是为了进一步提…...

    新晋前端框架技术:小程序容器与SuperApp构建

    2025年&#xff0c;前端开发领域持续迭代&#xff0c;主流框架如Vue、React等纷纷推出新版本&#xff0c;在性能、开发效率及适用场景上实现突破&#xff0c;进一步巩固其技术地位。 1. Vue 3的全面普及与创新 Vue 3通过多项核心特性优化了开发体验&#xff1a; Teleport组件…...

    强化学习:基于价值的方法做的是回归,基于策略的方法做的是分类,可以这么理解吗?

    在强化学习领域,基于价值的方法(Value-based Methods)和基于策略的方法(Policy-based Methods)是两种核心范式。本文将从目标函数、优化机制以及与机器学习任务的类比角度,探讨这两种方法是否可以被分别理解为回归和分类任务,并深入分析其内在逻辑。 一、基于价值的方法…...

    蓝耘元生代AIDC OS:一站式MaaS平台,助力AI应用快速落地

    文章目录 引言1. 什么是MaaS平台&#xff1f;MaaS平台的典型特点 2. 蓝耘元生代AIDC OS 热门模型3. 快速入门&#xff1a;如何调用API&#xff1f;步骤1&#xff1a;注册并获取API Key步骤2&#xff1a;调用API&#xff08;Python示例&#xff09; 4. 与Chatbox搭配使用&#x…...

    3.2.2.3 Spring Boot配置拦截器

    在Spring Boot应用中配置拦截器&#xff08;Interceptor&#xff09;可以对请求进行预处理和后处理&#xff0c;实现如权限检查、日志记录等功能。通过实现HandlerInterceptor接口并注册到Spring容器&#xff0c;拦截器可以自动应用到匹配的请求路径。案例中&#xff0c;创建了…...

    Python----机器学习(基于PyTorch的蘑菇逻辑回归)

    Logistic Regression&#xff08;逻辑回归&#xff09;是一种用于处理二分类问题的统计学习方法。它基于线性回归 模型&#xff0c;通过Sigmoid函数将输出映射到[0, 1]范围内&#xff0c;表示概率。逻辑回归常被用于预测某个实 例属于正类别的概率。 一、数据集介绍 本例使用了…...

    Python----机器学习(基于PyTorch的乳腺癌逻辑回归)

    Logistic Regression&#xff08;逻辑回归&#xff09;是一种用于处理二分类问题的统计学习方法。它基于线性回归 模型&#xff0c;通过Sigmoid函数将输出映射到[0, 1]范围内&#xff0c;表示概率。逻辑回归常被用于预测某个实 例属于正类别的概率。 一、数据集介绍 在本例中&…...

    如何配置AWS EKS自动扩展组:实现高效弹性伸缩

    本文详细讲解如何在AWS EKS中配置节点组&#xff08;Node Group&#xff09;和Pod的自动扩展&#xff0c;优化资源利用率并保障应用高可用。 一、准备工作 工具安装 安装并配置AWS CLI 安装eksctl&#xff08;EKS管理工具&#xff09; 安装kubectl&#xff08;Kubernetes命令…...

    【C++ Qt】认识Qt、Qt 项目搭建流程(图文并茂、通俗易懂)

    每日激励&#xff1a;“不设限和自我肯定的心态&#xff1a;I can do all things。 — Stephen Curry” 绪论​&#xff1a; 本章将开启Qt的学习&#xff0c;Qt是一个较为古老但仍然在GUI图形化界面设计中有着举足轻重的地位&#xff0c;因为它适合嵌入式和多种平台而被广泛使用…...

    用Python打造去中心化知识产权保护系统:科技驱动创作者权益新方案

    用Python打造去中心化知识产权保护系统:科技驱动创作者权益新方案 近年来,区块链技术和去中心化系统的兴起为知识产权保护提供了新的可能性。在传统模式下,知识产权保护通常依赖于集中化管理机构,这种方式不仅成本高,还可能因不透明导致权益争议。于是,我们萌生了一个设…...

    CVE重要漏洞复现-Fastjson1.2.24-RCE漏洞

    本文仅供网络学习&#xff0c;不得用于非法目的&#xff0c;否则后果自负 1、漏洞简介 fastjson是阿里巴巴的开源JSON解析库&#xff0c;它可以解析JSON格式的字符串&#xff0c;也可以从JSON字符串反序列化到JavaBean。即fastjson的主要功能就是将Java Bean序列化成JSON字符…...

    Windows 图形显示驱动开发-WDDM 1.2功能—显示设备硬件软件认证要求

    一、容器技术id技术的硬件级实现要求 1.1 EDID规范深度适配 1.物理层要求&#xff1a; 必须使用EDID 2.0及以上版本数据结构 容器ID需写入VSDB区块的0x50-0x6F区域&#xff0c;采用Little-Endian格式存储 允许的最大传输延迟&#xff1a;I2C总线时钟频率≤100KHz时&#xf…...

    Coze流搭建--写入飞书多维表格

    目标 使用coze搭建一个业务流&#xff0c;将业务流生产出的数据写入飞书保存 测试业务流 使用图片生成插件&#xff0c;配置prompt生产图片&#xff0c;将生产的结果写入飞书文档 coze流 运行后最终效果 搭建流程 第一步&#xff1a;飞书创建多维表格 注册飞书创建多维表…...

    4.14:计组第三章

    一、数据的强制类型转换与存储 1、边界对齐与大端小端方式 2、真-强制类型转换 二、存储器的基本知识(不包含磁盘存储器) 1、主存储器 (1)...

    Vue3+Vite前端项目部署后部分图片资源无法获取、动态路径图片资源报404错误的原因及解决方案

    目录 Vue3vite前端项目部署后部分图片资源无法获取、动态路径图片资源报404错误的原因及解决方案 一、情景介绍 1、问题出现的场景 2、无法加载的图片写法 二、反向代理原理简介 三、造成该现象的原因 四、解决方案 1、放弃动态渲染 2、在页面挂载的时候引入图片资源 …...

    Nacos操作指南

    第一章&#xff1a;Nacos 概述 1.1 什么是 Nacos&#xff1f; 定义与定位 Nacos&#xff08;Naming and Configuration Service&#xff09;是阿里巴巴于2018年开源的动态服务发现、配置管理和服务管理平台&#xff0c;现已成为微服务生态中的重要基础设施。其核心价值在于帮…...

    2025年常见渗透测试面试题-红队面试宝典下(题目+回答)

    网络安全领域各种资源&#xff0c;学习文档&#xff0c;以及工具分享、前沿信息分享、POC、EXP分享。不定期分享各种好玩的项目及好用的工具&#xff0c;欢迎关注。 目录 一、Java反序列化过程及利用链示例 二、大型网络渗透经验 三、Cobalt Strike的两种Dump Hash区别 四…...

    扩增子分析|基于R语言microeco包进行微生物群落网络分析(network网络、Zi-Pi关键物种和subnet子网络图)

    一、引言 microeco包是福建农林大学姚敏杰教授团队开发的扩增子测序集成分析。该包综合了扩增子测序下游分析的多种功能包括群落组成、多样性、网络分析、零模型等等。通过简单的几行代码可实现复杂的分析。因此&#xff0c;microeco包发表以来被学界广泛关注&#xff0c;截止2…...

    flutter-Text等组件出现双层黄色下划线的问题

    文章目录 1. 现象2. 原因3. 解决方法 1. 现象 这天我正在写Flutter项目的页面功能&#xff0c;突然发现我的 Text 文字出现了奇怪的样式&#xff0c;具体如下&#xff1a; 文字下面出现了双层黄色下划线文字的空格变得很大&#xff0c;文字的间距也变得很大 我百思不得其解&a…...

    优化运营、降低成本、提高服务质量的智慧物流开源了

    智慧物流视频监控平台是一款功能强大且简单易用的实时算法视频监控系统。它的愿景是最底层打通各大芯片厂商相互间的壁垒&#xff0c;省去繁琐重复的适配流程&#xff0c;实现芯片、算法、应用的全流程组合&#xff0c;从而大大减少企业级应用约95%的开发成本可通过边缘计算技术…...

    leetcode第二题

    功能函数 typedef struct ListNode {int val;struct ListNode *next; } ListNode;struct ListNode* addTwoNumbers(struct ListNode* l1, struct ListNode* l2) {ListNode *dummy (ListNode *)malloc(sizeof(ListNode));ListNode *cur dummy;int carry 0; //carry是进位值…...

    QT实现带快捷键的自定义 QComboBox 控件

    在现代GUI应用程序中&#xff0c;用户界面的设计不仅要美观&#xff0c;还要提供高效的交互方式。本文将介绍一个自定义的QCComboBox类&#xff0c;它是一个基于Qt的组合框&#xff08;QComboBox&#xff09;&#xff0c;支持为每个下拉项添加快捷键。通过这些快捷键&#xff0…...

    聊聊类模板

    我们来聊聊类模板&#xff0c;从基础到实际例子&#xff0c;让你更容易理解。 什么是类模板&#xff1f; 类模板是一种模板&#xff0c;允许我们定义一个可以处理任意数据类型的类。简单来说&#xff0c;就是我们可以编写一个类的“蓝图”&#xff0c;然后在需要的时候使用不…...