当前位置:首页 > 文章列表 > 文章 > 软件教程 > PxCook怎么设置倍率_切换1x2x3x倍率适配不同屏幕【倍率】

PxCook怎么设置倍率_切换1x2x3x倍率适配不同屏幕【倍率】

2026-05-03 10:01:17 0浏览 收藏

最近发现不少小伙伴都对文章很感兴趣,所以今天继续给大家介绍文章相关的知识,本文《PxCook怎么设置倍率_切换1x2x3x倍率适配不同屏幕【倍率】》主要内容涉及到等等知识点,希望能帮到你!当然如果阅读本文时存在不同想法,可以在评论中表达,但是请勿使用过激的措辞~

PxCook切图尺寸不匹配需检查设备类型与设计稿分辨率设置:Photoshop/Sketch中依画板宽度选iOS/Android,按1x/2x/3x物理像素密度设分辨率;局部图层组可用@bounds/#控制裁切;协作端可切换倍率预览验证。

PxCook怎么设置倍率_切换1x2x3x倍率适配不同屏幕【倍率】

如果您在使用PxCook进行切图标注时,发现导出的图片尺寸与目标设备不匹配,则可能是设计稿分辨率与倍率设置未正确对应。以下是设置1x、2x、3x倍率以适配不同屏幕的具体操作方法:

一、在Photoshop中设置设备类型与设计稿分辨率

该设置决定PxCook插件如何按基准缩放生成各倍率切图,实际输出尺寸由标记图层原始像素值结合所选分辨率共同计算得出。

1、确保已安装PxCook 3.9.x及以上版本,并重启Photoshop使插件生效。

2、通过菜单栏进入 窗口 > 扩展功能 > PxCook-切图,打开右侧切图面板。

3、在切图面板顶部找到“设备类型”和“设计稿分辨率”下拉选项。

4、根据当前PSD画板的实际宽度选择设备类型:若画板宽为375px,选iOS;若为360px或720px,选Android

5、依据设计稿所处的基准倍率选择分辨率:若画板是按1倍物理像素绘制(如375×667),则选1x;若按2倍绘制(如750×1334),则选2x;若按3倍绘制(如1125×2001),则选3x

二、在Sketch中配置Flavor导出面板的倍率参数

Sketch通过Flavor插件将画板与切图同步至PxCook,其倍率逻辑与Photoshop一致,仅界面位置不同。

1、安装PxCook 3.9.4及以上版本后,重启Sketch确保插件加载。

2、在Sketch右侧面板中找到并点击Flavor插件图标。

3、点击第一个导出工具按钮,弹出导出设置面板。

4、在面板中确认设备类型与当前画板所属平台一致(iOS/Android/Web)。

5、在设计稿分辨率选项中,选择与画板原始像素密度对应的值:例如750px宽画板对应iOS 2x,1125px宽画板对应iOS 3x

6、完成设置后点击导出,PxCook将自动按1x、2x、3x三档生成对应尺寸切图。

三、通过图层组内@bounds或#图层控制局部倍率输出

当某组图标需单独指定输出尺寸而非跟随全局倍率时,可通过图层命名与结构实现精准控制。

1、选中需独立设定倍率的图层,右键选择编组(Group)。

2、在组内新建一个形状图层,使用矩形工具绘制所需切图范围区域。

3、将该形状图层重命名为@bounds#(二者等效)。

4、确保该图层位于组内最顶层或最底层,且未被隐藏或锁定。

5、返回PxCook切图面板,对该图层组点击标记为切图,插件将严格按@bounds图层边界裁切,并依全局分辨率设置生成多倍率文件。

四、在PxCook协作项目中查看与切换倍率显示

PxCook Web端或桌面端支持在开发模式下实时切换倍率视图,便于验证标注与切图是否符合预期。

1、将画板成功导入PxCook协作项目后,进入对应画板页面。

2、点击右上角开发模式按钮,切换至开发者视角。

3、在右侧边栏切图列表中,每张切图名称后均标注有1x / 2x / 3x标识。

4、点击任意切图条目,右侧预览区将显示该倍率下的实际尺寸与像素值。

5、鼠标悬停于切图名称上,可快速查看其原始图层尺寸、导出尺寸及缩放比例。

本篇关于《PxCook怎么设置倍率_切换1x2x3x倍率适配不同屏幕【倍率】》的介绍就到此结束啦,但是学无止境,想要了解学习更多关于文章的相关知识,请关注golang学习网公众号!

云算宝建站系统使用指南云算宝建站系统使用指南
上一篇
云算宝建站系统使用指南
公积金贷款审批要多久
下一篇
公积金贷款审批要多久
查看更多
最新文章
查看更多
课程推荐
  • 前端进阶之JavaScript设计模式
    前端进阶之JavaScript设计模式
    设计模式是开发人员在软件开发过程中面临一般问题时的解决方案,代表了最佳的实践。本课程的主打内容包括JS常见设计模式以及具体应用场景,打造一站式知识长龙服务,适合有JS基础的同学学习。
    543次学习
  • GO语言核心编程课程
    GO语言核心编程课程
    本课程采用真实案例,全面具体可落地,从理论到实践,一步一步将GO核心编程技术、编程思想、底层实现融会贯通,使学习者贴近时代脉搏,做IT互联网时代的弄潮儿。
    516次学习
  • 简单聊聊mysql8与网络通信
    简单聊聊mysql8与网络通信
    如有问题加微信:Le-studyg;在课程中,我们将首先介绍MySQL8的新特性,包括性能优化、安全增强、新数据类型等,帮助学生快速熟悉MySQL8的最新功能。接着,我们将深入解析MySQL的网络通信机制,包括协议、连接管理、数据传输等,让
    500次学习
  • JavaScript正则表达式基础与实战
    JavaScript正则表达式基础与实战
    在任何一门编程语言中,正则表达式,都是一项重要的知识,它提供了高效的字符串匹配与捕获机制,可以极大的简化程序设计。
    487次学习
  • 从零制作响应式网站—Grid布局
    从零制作响应式网站—Grid布局
    本系列教程将展示从零制作一个假想的网络科技公司官网,分为导航,轮播,关于我们,成功案例,服务流程,团队介绍,数据部分,公司动态,底部信息等内容区块。网站整体采用CSSGrid布局,支持响应式,有流畅过渡和展现动画。
    485次学习
查看更多
AI推荐
  • 剧云 - 免费 AI 智能中文剧本创作平台
    剧云
    剧云是专业中文剧本创作平台,安全稳定运行十余年,集成AI编剧、剧本医生审核、人物小传、剧情关系图、大纲编写、多人协作、Word导入导出、版权管控功能,数据安全防护,轻松高效创作剧本。
    94次使用
  • 万象有声 - AI 一站式有声内容创作平台
    万象有声
    万象有声,一个专为有声创作者打造的新一代智能有声内容创作平台。平台提供专业的智能拆章、智能画本编辑、AI配音、AI生成音效、后期制作、智能对轨、智能审听等有声创作全流程工具,可以帮助创作者高效、低成本创作出引人入胜的有声作品。立即体验,让有声书制作更简单!
    98次使用
  • Red Skill - 小红书推出的 AI Skill 分发平台
    Red Skill
    小红书创作服务平台为小红书创作者和机构提供视频上传、数据分析、粉丝管理、创作指导等多项运营服务,助力用户解锁更多创作者专属功能,体验高效创作!
    100次使用
  • MiMo Code - 小米大模型团队开源的新一代 AI 编程助手
    MiMo Code
    MiMo Code 是小米大模型团队开源的新一代 AI 编程助手,面向开发者提供代码理解、生成与辅助开发能力,适合作为 AI 编程工具收藏和体验。
    202次使用
  • TRAE Work - 字节跳动推出的 AI 原生工作台
    TRAE Work
    TRAE AI IDE | 国内首款 AI 原生集成开发环境,深度集成 Doubao-1.5-pro 与 DeepSeek 模型,支持中文自然语言一键生成完整代码框架,实时预览前端效果并智能修复 BUG。首创 Builder 模式实现需求到代码的自动化开发,兼容 Windows/macOS 系统,官网下载即用。
    232次使用
微信登录更方便
  • 密码登录
  • 注册账号
登录即同意 用户协议隐私政策
返回登录
  • 重置密码