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

在 uniapp 中 一键转换单位 (px 转 rpx)

在 uniapp 中 一键转换单位 px 转 rpx

  • Uni-app 官方转换位置
  • 利用【px2rpx】插件`Ctrl + S`一键全部转换
    • 下载插件
    • 修改插件

Uni-app 官方转换位置

首先在App.vue中输入这个:

uni.getSystemInfo({success(res) {console.log("屏幕宽度", res.screenWidth) //屏幕宽度const myrpx = res.screenWidth / 750 * 1console.log("myrpx", myrpx);}
});

在这里插入图片描述

得到转换单位:

在这里插入图片描述

然后在偏好设置中设置:

在这里插入图片描述

但是需要注意的是,这个不是严格安装这个来计算的

例如我在figma中选择390宽度的画布,但是如果安装计算转换比例应该是:0.52,但是0.52是这个效果:

在这里插入图片描述

在这里插入图片描述

因此我调整比例为0.58,效果就好很多了

在这里插入图片描述

所以你把这个当作一个比例工具就好啦

利用【px2rpx】插件Ctrl + S一键全部转换

你可以下载这个插件,我看有很多人在这个插件底下问这个插件如何自己设定转换值,可以参考如下:

下载插件

px2rpx
在这里插入图片描述

注意,这个插件是在你Ctrl+s时才会给你自动将整个页面单位转换

修改插件

在这里插入图片描述

首先在package.json中修改模式显示名称:

在这里插入图片描述

然后再extension.js中修改单位数值转换规则

在这里插入图片描述

最后重启HbuildX,可以发现:

在这里插入图片描述

http://www.lryc.cn/news/229009.html

相关文章:

  • SQL对数据进行去重
  • 登录注册代码模板(Vue3+SpringBoot)[邮箱发送验证码(HTML)、RSA 加密解密(支持长文本)、黑暗与亮色主题切换、AOP信息校验]
  • 【计算机网络】VRRP协议理论和配置
  • ubuntu操作系统的docker更换存储目录
  • 【人工智能Ⅰ】6-机器学习之分类
  • 本地部署_语音识别工具_Whisper
  • 秋招求职经验分享
  • DNS域名解析
  • Flink SQL --命令行的使用(02)
  • 【nlp】1.3 文本数据分析(标签数量分布、句子长度分布、词频统计与关键词词云)
  • 路由器的结构以及工作原理
  • DefaultListableBeanFactory
  • NSF服务器
  • 10 Go的映射
  • 瑞萨e2studio(29)----SPI速率解析
  • mysql的主从复制,读写分离
  • 小米路由器4A千兆版刷入OpenWRT并远程访问
  • 【golang】探索for-range遍历实现原理(slice、map、channel)
  • 依赖倒转原则接口隔离原则迪米特法则合成复用原则
  • MATLAB | 官方举办的动图绘制大赛 | 第一周赛情回顾
  • 适配器模式 rust和java的实现
  • 竞赛 题目:垃圾邮件(短信)分类 算法实现 机器学习 深度学习 开题
  • wpf devexpress项目中添加GridControl绑定数据
  • 2023亚太杯数学建模A题思路解析
  • Spark3.0中的AOE、DPP和Hint增强
  • 算法笔记-第五章-质因子分解
  • 适用于WPF的设计模式
  • C++与多态
  • ios 对话框UIAlertController放 tableview
  • 警告:新版Outlook会向微软发送密码、邮件和其他数据