Android UI设计中px、pt、ppi、dpi、dp、sp之间的关系

这篇具有很好参考价值的文章主要介绍了Android UI设计中px、pt、ppi、dpi、dp、sp之间的关系。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

做了几个移动端的项目之后,深感UI设计移动端尺寸换算的必要性,在此做个总结。

android dp,Android,android,ui,dpi,屏幕适配,Powered by 金山文档

先介绍下各自的定义:

px: pixel,像素,电子屏幕上组成一幅图画或照片的最基本单元

pt: point,点,印刷行业常用单位,等于1/72英寸

ppi: pixel per inch,每英寸像素数,该值越高,则屏幕越细腻

dpi: dot per inch,每英寸多少点,该值越高,则图片越细腻

dp: dip,Density-independent pixel, 是安卓开发用的长度单位,1dp表示在屏幕像素点密度为160ppi时1px长度

sp: scale-independent pixel,安卓开发用的字体大小单位。

以下是换算关系:

一、pt和px

公式一: 1pt= (DPI / 72) px

当photoshop中新建画布的分辨率为72ppi( 即 72dpi时 ), 1pt=1px; 当新建画布分辨率为72*2=144ppi时,1pt=2px

二、ppi和dpi

dpi最初用于衡量打印物上每英寸的点数密度。DPI值越小图片越不精细。当DPI的概念用在计算机屏幕上时,就应称之为ppi。同理: PPI就是计算机屏幕上每英寸可以显示的像素点的数量。因此,在电子屏幕显示中提到的ppi和dpi是一样的,可认为

公式二:dpi=ppi

三、ppi计算方法

ppi是指屏幕上的像素密度,其计算方法为:

公式三: ppi= 屏幕对角线上的像素点数/对角线长度 = √ (屏幕横向像素点^2 + 屏幕纵向像素点^2)/对角线长度

以小米2s为例,该屏幕分辨率为720px*1280px,4.3英寸。则点密度为 √ (720^2 +1280^2) /4.3 = 342ppi。

四、px和dp

dp为安卓开发时的长度单位,根据不同的屏幕分辨率,与px有不同的对应关系。

安卓端屏幕大小各不相同,根据其像素密度,分为以下几种规格:

android dp,Android,android,ui,dpi,屏幕适配,Powered by 金山文档

1dp定义为屏幕密度值为160ppi时的1px,即,在mdpi时,1dp = 1px。 以mdpi为标准,这些屏幕的密度值比为:ldpi : mdpi : hdpi : xhdpi : xxhdpi = 0.75 : 1 : 1.5 : 2 : 3;即,在xhdpi的密度下,1dp=2px;在hdpi情况下,1dp=1.5px。其他类推。

公式四: 1dp=(屏幕ppi/ 160)px

以WVGA屏为例,该屏幕为480px*800px,按3.8寸屏算,点密度 √ (480^2 + 800^2) / 3.8 = 245,约等于240,对应于hdpi屏幕,所以该屏幕1dp=1.5px

五、dp和sp

dp和sp都是安卓的开发单位,dp是长度单位,sp是字体单位。sp与dp类似,但是可以根据用户的字体大小首选项进行缩放。Android系统允许用户自定义文字尺寸大小(小、正常、大、超大等等),

公式五:当文字尺寸是“正常”时1sp=1dp,而当文字尺寸是“大”或“超大”时,1sp>1dp。

一般情况下可认为sp=dp。

总结:由于做设计时以xhdpi为模板,xhdpi条件下,1dp=2px。若新建画布时,将画布分辨率设为144ppi,则1pt=2px=1dp。此时,即可将pt等同于dp。标注长度的时候,将长度像素除以2即为dp值。

结语

在photoshop cc中切图时,可直接在.png 图片图层名称前加上200%获得2倍大小的图,其他比例的切图以此类推。输出的两倍图不模糊的前提是,该图是photoshop中用形状工具画出来的未被栅格化的图形,而不是已被栅格化的图层或外部导入的图片。文章来源地址https://www.toymoban.com/news/detail-729742.html

到了这里,关于Android UI设计中px、pt、ppi、dpi、dp、sp之间的关系的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • Android开发中Gradle插件,Gradle版本与JDK版本之间的对应关系

    Gradle插件 Gradle版本 SDK Build Tools JDK版本 说明 8.2 8.1 17 8.1 8.0 17 8.0 8.0 30.0.3 17 7.4 7.5 30.0.3 11 7.3 7.4 30.0.3 11 7.2 7.3.3 30.0.3 11 7.1 7.2 30.3.30 11 4.2.0+ 6.7.1 30.0.2 8+ 4.1.0+ 6.5+ 29.0.2 8+ 4.0.0+ 6.1.1+ 29.0.2 8+ 3.6.0~3.6.4 5.6.4+ 28.0.3 8+ 3.5.0 - 3.5.4 5.4.1+ 28.0.3 8+ 3.4.0 - 3.4.3 5.1.1+ 28.0.3 8+ 3.3.0 - 3.3.3 4.10.1+ 28.0

    2024年03月20日
    浏览(72)
  • pt和onnx和ncnn之间的转换以及避坑

    这个转化比较简单python里就可以 这个文件yolov5-5.0modelsexport.py 下面那个根据自己的环境修改,环境是你yolov5运行的环境cpu就填cpu gpu就填 0  修改好后运行  有可能需要下载onnx包 直接pip 直接运行就好了   onnx会直接在你pt模型路径下 ncnn有些特殊会生成两个文件  然后把onnx模型

    2024年02月16日
    浏览(39)
  • 音视频——码率、帧率越高越清晰?分辨率、像素、dpi的关系

    本期我介绍一下视频的一些基础概念,如帧率、码率、分辨率、像素、dpi、视频帧、I帧、P帧、gop等。我i初步学习音视频,给这些专业词汇进行扫盲 会解释多少码率是清晰的,是否帧率越高越流畅等问题。 这些概念是比较杂乱的,我们按这样的顺序介绍: 1、单个视频帧的概

    2024年02月13日
    浏览(54)
  • Android 使用adb修改手机分辨率、dpi

    为了适配不同尺寸屏幕的手机,最简单的方式就是通过adb修改分辨率和dpi Android Studio 安装adb(Android Debug Bridge) https://developer.android.com/studio/releases/platform-tools?hl=zh-cn 查看分辨率 修改分辨率 查看dpi 修改dpi 恢复默认的size和dpi android利用adb修改手机的分辨率和dpi

    2024年02月11日
    浏览(62)
  • 【Qt UI相关】Qt5和Qt6中关于高DPI缩放属性

    高DPI(每英寸点数)显示器具有更高的像素密度,这意味着它们可以显示更清晰、更详细的图像。然而,如果应用程序不适应高DPI显示,它们可能会看起来模糊或者太小。为了解决这个问题,Qt提供了高DPI缩放支持。 在Qt 5中,高DPI缩放默认是禁用的,你可以通过设置 Qt::AA_

    2024年02月04日
    浏览(47)
  • Android UI 设计规范,Android学习路线指南

    DP/PX在线转换工具:http://pixplicity.com/dp-px-converter/ 字体大小单位是 sp 。 1.5 切图 注意:切图素材文件大小尽量保持 = 200Kb,主要为png格式。 2. Material Design相关 Material Design,中文名:质感设计,是由 Google 推出的全新的设计语言,谷歌表示,这种设计语言旨在为手机、平板电脑

    2024年04月25日
    浏览(43)
  • 【入门dp】力扣鸡蛋掉落问题和转账问题的关系初探

    我昨晚偶然编出了一道水题,名为转账问题:已知银行卡里有不超过 n 元,你想把卡里所有钱提到某信支付,但你无法看到卡里的钱,你只能执行若干次转账 i 元的操作,每次看到转账成功与失败的提示。问至少需要操作多少次。 n 和 i 是自然数。形式化描述:你的策略 y 是

    2024年02月16日
    浏览(35)
  • 安卓Android 架构模式及UI布局设计

    Android UI 设计是指在Android应用程序中创建用户界面的过程。这涉及到使用XML布局文件定义界面元素的位置和外观,以及通过Java或Kotlin代码处理用户交互。Android UI设计包括使用各种视图组件(如按钮、文本框、列表等)和布局管理器(如线性布局、相对布局等)来构建用户友

    2024年04月13日
    浏览(52)
  • Android开发-UI界面--类微信页面设计

    一、功能说明 二、开发技术 ​ 本次用到了 layout.xml、控件、监听、fragment layout(布局) ​ 定义了用户界面的可视化结构,主要有4种布局: ConstrainLayout (约束布局):一个使用“相对定位”灵活地确定微件的位置和大小的一个布局 LinearLayout (线性布局):按照水平或垂直

    2024年02月10日
    浏览(41)
  • android stdio中简单的ui页面设计

    首先创建一个APP项目 在layout文件夹下找到activity main.xml 到以下界面可以添加界面的各种符号: 账号输入框,密码输入框按钮和其他按键 可添加辅助线对页面设置布局页面布局不同的尺寸,分辨率可以使设备的兼容度更好 可以用imageView添加图标    页面展示图如下:

    2024年02月05日
    浏览(46)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包