首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

如何正确地设计一个高DPI感知(4k就绪)的Delphi应用程序UI?

设计一个高DPI感知的Delphi应用程序UI需要考虑以下几个方面:

  1. DPI感知:DPI(Dots Per Inch)是指屏幕上每英寸的像素数,高DPI屏幕具有更高的像素密度。为了适应不同DPI的屏幕,应用程序需要进行DPI感知,即根据屏幕的DPI自动调整UI元素的大小和布局。
  2. 缩放支持:为了适应高DPI屏幕,应用程序需要支持缩放。可以通过设置应用程序的ScaleMode属性为smScaled来启用自动缩放。同时,还可以使用TScaleHelper类来手动缩放非标准控件。
  3. 图标和图像:在高DPI屏幕上显示清晰的图标和图像是很重要的。可以使用矢量图标或高分辨率图像来保证在不同DPI下的清晰度。同时,还可以使用TImageList组件来管理不同DPI下的图标和图像资源。
  4. 字体和文本:在高DPI屏幕上,字体和文本的大小需要根据DPI进行调整,以确保可读性。可以使用TFontScaleHelper类来自动调整字体大小,或者手动设置字体大小并根据DPI进行缩放。
  5. 布局和控件:在设计UI时,需要考虑到不同DPI下的布局和控件大小。可以使用TGridPanelLayout或TFlowLayout等布局组件来自动调整控件的位置和大小。此外,还可以使用TAnchorConstraints或TAlign属性来确保控件在不同DPI下的正确对齐和拉伸。
  6. 测试和调试:设计高DPI感知的UI后,需要进行测试和调试以确保在不同DPI下的正常显示和交互。可以使用Delphi自带的调试工具和模拟器来模拟不同DPI的屏幕,并检查UI元素的大小、布局和响应。

总结起来,设计一个高DPI感知的Delphi应用程序UI需要考虑DPI感知、缩放支持、图标和图像、字体和文本、布局和控件、测试和调试等方面。在实际设计中,可以根据具体需求选择合适的组件和技术来实现高DPI适配。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

将浏览器嵌入 .NET 应用程序中:DotNetBrowser 还是 CefSharp?

这种方法总体上简化了 UI 创建并节省了大量时间和精力。 CefSharp 提供有限设计器支持[12]。如果应用程序本身以 x86 为目标,则其控件将在设计器中正确处理。...DPI 在 CefSharp 中,浏览器子进程默认 DPI 感知[16]是 Per-Monitor。...因此,桌面应用程序应具备DPI 感知功能[17],才能在 DPI 显示器(DPI 比例设置大于 100% 显示器)上正确运行。...在其他情况下,浏览器内容可能无法正确呈现,例如: DotNetBrowser 以不同方式支持 DPI。...在初始化过程中,它会检查当前进程 DPI 感知,并为相应 Chromium 引擎设置匹配 DPI 感知。因此,无需让您应用程序显式识别 DPI 以避免在 DPI 显示上呈现伪影。

30140

Windows 下 DPI 应用开发(UWP WPF Windows Forms Win32)

当多个屏幕 DPI 不一样,而应用从一个屏幕切换到另一个屏幕时候,应用会收到 DPI 改变消息 应用顶层和子 HWND 都会收到 DPI 改变消息 以下 UI 元素也会在 DPI 改变时缩放 非客户区...不同 UI 框架对 DPI 支持情况 UWP UWP 当然支持最新各种 DPI 感知级别,而且是完全支持。...而 Per-Monitor V1 和 Per-Monitor V2 支持在操作系统级别是兼容,所以只需要修改 WPF 中应用程序清单即可兼容第二代屏幕级 DPI 感知。...混合 DPI 感知级别 当项目足够大时候,一个或几个项目成员可能很难了解所有的窗口逻辑。让一个进程所有窗口开启 DPI 缩放对应用 DPI 迁移来说比较困难。...前一次是为了让窗口在创建时有一个对此线程 DPI 感知级别,而后一次调用是恢复此线程 DPI 感知级别。

65450

Android中你可能忽略知识点(1)-分辨率那些事

除非一些特殊情况,不想跟随系统字体变化,可以使用dp dpi 是dot per inch,每英寸多少点,ppi是 Pixel per inch,每英寸像素数,针对显示器设计时,dpi=ppi 二、...750x1334,而我们xhdpi分辨率为720x1280,相差不多,所以一般公司只按照IOSUI设计一套UI图和切图,而苦逼Android开发就硬着眉头上吧。...UI设计效果,这样反倒浪费了时间同时也不能展现出来各个平台独有的特性,GoogleIO刚刚结束,Google出品APP将Android平台特性展现淋漓尽致,当然这些都纯属个人看法,话说回来,那么就需要...UI设计师了解Android和IOS特性,同时为两个平台设计各个风格UI,所以…各自安好 三、转换关系 Android开发中我们在XML文件里面设置宽度时候都会进行一次转换,也就是把非标准尺寸转换为标准尺寸...9-patch PNG图片也是一种标准PGN图片,在原生PNG图片四周空出一个像素间隔,用来标识PNG图片中哪些部分可以拉伸、哪些不可以拉伸、背景上边框位置等。

64210

将浏览器嵌入 .NET 应用程序中:DotNetBrowser 还是 CefSharp?

这种方法总体上简化了 UI 创建并节省了大量时间和精力。 CefSharp 提供有限设计器支持[12]。如果应用程序本身以 x86 为目标,则其控件将在设计器中正确处理。...DPI 在 CefSharp 中,浏览器子进程 默认 DPI 感知[16] 是 Per-Monitor。...因此,桌面应用程序应具备 DPI 感知功能,才能在 DPI 显示器(DPI 比例设置大于 100% 显示器)上正确运行。...在其他情况下,浏览器内容可能无法正确呈现,例如: DotNetBrowser 以不同方式支持 DPI。...在初始化过程中,它会检查当前进程 DPI 感知,并为相应 Chromium 引擎设置匹配 DPI 感知。因此,无需让您应用程序显式识别 DPI 以避免在 DPI 显示上呈现伪影。

39120

Android TV开发总结【适配】

UI 应该以什么标准出图? UI标注图 px 和 dp之间如何转换?...举个例子: 某款盒子通过上述代码获得分辨率为1920*1080 ,DPI为160dpi,盒子连接4K电视分辨率为3840*2160: 通过160dpi,根据上表可以得知图片放在drawable-mdpi...文件夹下 在只考虑当前设备情况下,UI应该以盒子像素1920*1080出图因为,app 在机顶盒上实际输出像素就只有1920*1080像素,而在4K电视上4K显示效果是机顶盒将系统UI框架 1920...1920*1080 ,DPI为213dpi,盒子连接4K电视分辨率为3840*2160: 我们可以计算一下倍数关系 213/160 = 1.33 ,我们发现并不是上面表格中提供参数,是个非常奇葩数字...使用 smallestWidth 定义一般屏幕尺寸很有用,因为宽度 通常是设计布局时驱动因素。UI 经常会垂直滚动,但 对其水平需要最小空间具有非常硬性限制。

3.8K10

WindowsXamlHost:在 WPF 中使用 UWP 控件(Windows Community Toolkit)

关于 DPI 适配 为了让 UWP 控件能够在 WPF 窗口中获得正确 Per-Monitor DPI 适配效果,你需要设置为 PerMonitorV2 DPI 感知级别。...在 PerMonitorV2 DPI 感知级别下,UWP 控件能够正常获得 DPI 缩放。 在 100% DPI 屏幕下: ? 在 150% DPI 屏幕下: ?...关于 PerMonitorV2 和 PerMonitor 理解和区别,可以参见: Windows 下 DPI 应用开发(UWP / WPF / Windows Forms / Win32) - walterlv...关于如何在 WPF 下开启 PerMonitorV2 级别的 DPI 感知可以参见: 支持 Windows 10 最新 PerMonitorV2 特性 WPF 多屏 DPI 应用开发 - walterlv...更复杂 UWP 控件嵌入 如果希望将更多 WPF 窗口内 UI 部分交给 UWP 来做,那么就不能只是仅仅初始化一个 Button 就完了。

4.5K20

支持 Windows 10 最新 PerMonitorV2 特性 WPF 多屏 DPI 应用开发

本文将介绍 WPF 框架利用第二代多屏 DPI 机制进行 DPI 适配方法。同时,也介绍低版本 WPF 或者低版本操作系统下如何做兼容。...添加应用程序清单文件 在你现有 WPF 项目的主项目中需要添加两个文件以支持第二代多屏 DPI 机制。...image.png ▲ 新建文件时候选择应用程序清单文件(应用程序配置文件就在旁边) 了解 WPF 清单文件中 DPI 感知设置 DpiAware 在你打开了 app.manifest 文件后,找到以下代码...不过这只是兼容性设计而已,感谢老版本系统使用字符串包含方式,于是可以老版本系统可以兼容新 DPI 感知值: 什么都不填 如果你额外也没做什么 DPI 相关操作,那么就是 Unaware...第一个能识别的感知级别是 system 当前进程设置为系统级 DPI 感知(System DPI Awareness)。

1.5K20

使用 SetParent 跨进程设置父子窗口时一些问题(小心卡死)

在这篇文章 DPI 感知一段中明确写明了在进程内以及跨进程设置父子关系时一些行为。...如果我没记错的话,SetParent 文档曾经包含一个严厉警告表明它不受支持,但现在这段备注似乎已经不存在了。我就遇到过一个客户跨进程设置窗口之间父子关系,然后他们应用程序间歇性不稳定。...然而实际上 Windows GUI 应用程序开发中基本上 UI 代码都是通过消息循环来执行,所以这几乎等同于所有进程 UI 线程强制同步成类似一个 UI 线程效果了。...带来副作用也就相当明显,任何一个进程卡了 UI,其他进程 UI 将完全无响应。当然,不依赖消息循环代码不会受此影响,比如 WPF 应用程序动画和渲染。...如何解决 对于 SetParent 造成这些问题,实际上没有官方解决方案,你需要针对你不同业务采用不同解决办法。

64620

Android端App设计经验小分享

Android麻烦在于“各种价位,各种性能,各种分辨率”, 不同分辨率对应不同dpi模式。...一般来说,48dp转化为一个物理尺寸约9毫米。建议目标大小为7-10毫米范围,这是一个用户手指能准确并且舒适触摸区域。 如果你设计元素和宽至少48dp,你就可以保证: (1)....当运行在mdpi下时,1dp=1px:也就是说设计师在PS里定义一个item48px,开发就会定义该item48dp;当运行在hdpi模式下时,1dp=1.5px:也就是说设计师在PS里定义一个item...如需对设计稿进行后期标注,则可使用该套规范,对设计稿中字号、颜色、间距进行标注。推荐一个小工具,MarkMan,标注设计稿十分方便。因为这是一个Adobe插件,所以可以和PS同步。...把常见三种分辨率都要进行测试,当然能所有分辨率都测试一遍最好,不过这取决于有多土豪,或者身边有多少土豪朋友。 如果想做一个UI设计师,一定要从规范入手。很多都是细节东西,在于积累。

75930

Windows微信DPI适配

DPI设备给我们提供了更精细画质,然而Windows上大多数应用并没有适配DPI显示器,导致应用在这些设备显示模糊,体验非常差。...为了让应用在DPI设备上依然显示清晰,我们就需要对DPI设备进行适配。...2.2 DPI和缩放比例关系 现在我们已经知道DPI是个什么了,那么DPI又是怎样影响我们应用程序界面的呢?...3.1 声明DPI感知级别 适配应用,首先我们需要声明我们应用是DPI感知级别的。...3.3.3 xml等构建UI资源 一般来说,除非想在不同DPI、有效分辨率下采用不同布局方式,建议只使用一套xml资源。这样可以减少适配工作量,同时避免维护多套xml带来麻烦。

5.5K90

WPF 引用 UWP 控件 不打包为 MSIX 分发方法

按照微软官方文档,大部分文档都会说如果用了 XAML Islands 等技术时候,需要新建一个打包项目,将 WPF 应用打包为 msix 等才可以进行分发和使用。...解决方法有两个,第一个是通过微软文档说打包方法,再新建一个打包工程,在这个工程里面打包作为 MSIX 安装包。...-- 设计应用程序与其一起工作且已针对此应用程序进行测试 Windows 版本列表。取消评论适当元素, Windows 将自动选择最兼容环境。...-- 指示该应用程序可以感知 DPI 且 Windows 在 DPI 较高时将不会对其进行 自动缩放。...Windows Presentation Foundation (WPF)应用程序自动感知 DPI,无需 选择加入。

69150

创建支持多种屏幕尺寸Android应用

例如,一个240dpi屏幕,1 dp等于1.5个物理像素。定义应用程序UI时,你应该总是使用dp单位,以确保在不同密度屏幕上正确地显示你UI。...Android制造这些差异使应用程序抽象化,所以,你可以提供设计UI给广义尺寸和密度,必要时让系统处理任何最后调整。图1 阐明了不同尺寸和密度被如何大致归类到不同尺寸和密度组。...当为不同屏幕尺寸设计UI时,会发现每个设计需要最低限度空间。...例如,下面是应用程序资源目录列表,这个程序为中等、及超高密度屏幕提供了不同为不同屏幕尺寸和位图绘图设计布局。...当设计UI时,可能关心主要事情是,应用程序在手机类型UI和多窗格平板类型UI之间切换时实际尺寸。

2.6K60

Windows 系统上使用任务管理器查看进程各项属性(命令行、DPI、管理员权限等)

如何查看进程各种属性 在任务栏上右键,选择“任务管理器”;或者按下 Ctrl + Shift + Esc 可以打开任务管理器。...UAC 虚拟化相关问题可以阅读 应用程序清单 Manifest 中各种 UAC 权限级别的含义和效果 - 吕毅。 DPI 感知 可以查看进程 DPI 感知级别。...进程 DPI 感知级别有以下这些,名字来源于 Windows 系统任务管理器上显示名称。...Awareness) 关于 DPI 感知级别的更多内容,可以阅读我其他博客: Windows 下 DPI 应用开发(UWP / WPF / Windows Forms / Win32) - 吕毅...支持 Windows 10 最新 PerMonitorV2 特性 WPF 多屏 DPI 应用开发 - 吕毅 本文会经常更新,请阅读原文: https://blog.walterlv.com/post

1.9K30

CefSharp中文帮助文档「建议收藏」

显示/支持 WinForms/WPF需要使使用DPI桌面应用程序能够在DPI显示器(DPI Scale设置大于显示器)上正确运行DPI100%。...请确保阅读Windows窗体中High DPI支持以获取Microsoft更多详细信息。 使用应用程序清单设置默认感知。...WPFDPI 应用清单 添加相关条目,请参阅app.manifest中针对Microsoft建议打开Windows级每个监视器DPI感知。...DPI附加信息 Chromium默认情况下,将在单独子流程中执行所有渲染。特别是GPU Compositor需要有一个DPI Awareness与您应用程序匹配需求。...f=6&t=15120#p34802中建议,现在看来有必要在32位应用程序运行时在应用程序可执行文件上设置“大地址感知”链接器设置。遇到内存负载。

12K31

Android 目前最稳定和高效UI适配方案

Android适配最核心问题有两个,其一,就是适配效率,即把设计图转化为App界面的过程是否高效,其二如何保证实现UI界面在不同尺寸和分辨率手机中UI一致性。...那么这个dp是如何计算呢? 我们都知道一个公式: px = dp(dpi/160) 系统都是通过这个来判断px和dp数学关系, 那么这里又出现了一个问题,dpi是什么呢?...dpi是软件参考了物理像素密度后,人为指定一个值,这样保证了某一个区间内物理像素密度在软件上都使用同一个值。这样会有利于我们UI适配。...在把设计稿向UI代码转换过程中,我们需要耗费相当精力去转换尺寸,这会极大降低我们生产力,拉低开发效率。 宽限定符适配 为了高效实现UI开发,出现了新适配方案,我把它称作宽限定符适配。...UI适配框架(已经停止维护) 鸿洋大佬适配方案项目也来自于宽限定符方案启发。 使用方法也很简单: 第一步:在你项目的AndroidManifest中注明你设计稿尺寸。

1.3K20

Android开发稳定和高效UI适配方案总结

Android适配最核心问题有两个,其一,就是适配效率,即把设计图转化为App界面的过程是否高效,其二如何保证实现UI界面在不同尺寸和分辨率手机中UI一致性。...那么这个dp是如何计算呢? 我们都知道一个公式: px = dp(dpi/160) 系统都是通过这个来判断px和dp数学关系, 那么这里又出现了一个问题,dpi是什么呢?...dpi是软件参考了物理像素密度后,人为指定一个值,这样保证了某一个区间内物理像素密度在软件上都使用同一个值。这样会有利于我们UI适配。...在把设计稿向UI代码转换过程中,我们需要耗费相当精力去转换尺寸,这会极大降低我们生产力,拉低开发效率。 宽限定符适配 为了高效实现UI开发,出现了新适配方案,我把它称作宽限定符适配。...UI适配框架(已经停止维护) 鸿洋大佬适配方案项目也来自于宽限定符方案启发。 使用方法也很简单: 第一步: 在你项目的AndroidManifest中注明你设计稿尺寸。

44530

设计师会编程、程序员懂艺术之设计规范

以下为正文 UI&UX类设计规范,不像建筑设计、工业设计那样,有比较成熟权威设计规范。大多是各家发布设计规范,用于自家产品、品牌设计复用。 本文从 设计规范是什么?...本文所提设计规范”,包括设计语言、风格指引、设计指南、设计资源、web前端框架等,对UI、VISUAL、BRAND、APP、WEB等进行样式规范。...PPI(DPI): pixel(dot)per inch,每英寸像素(点)数,是一个率,表示了“清晰度”,“精度”; 电子设备DPI,一般为96 在Photoshop中,设置一个图片中某个艺术效果字体是...字体行绝对值为『字号 x 1.5倍』,例如:12 号字体为 18px,14 号字体为 21px。...2.7 动画 也叫动效设计,主要起到过渡、增强示意、改善感知、加强层级空间作用。 ? 3、自己动手开发一个从网页自动生成设计规范功能 上文提到2个网页,实现并不完美。

1.1K60

准确判断一个 WPF 控件 UI 元素当前是否显示在屏幕内

判断 UI 元素位置,其右侧是否在屏幕最左侧,其底部是否在屏幕最上面;或者其左侧是否在屏幕最右侧,其顶部是否在屏幕最下面。...Win32 / Windows Forms 方法在来计算屏幕与 UI 元素之间交叉情况,并且避免在任何时候同时将多个屏幕坐标进行加减乘除(避免单位不一致问题)。...关于 DPI 感知设置问题,可阅读我其他博客: Windows 下 DPI 应用开发(UWP / WPF / Windows Forms / Win32) - walterlv 支持 Windows...10 最新 PerMonitorV2 特性 WPF 多屏 DPI 应用开发 - walterlv Windows 系统上使用任务管理器查看进程各项属性(命令行、DPI、管理员权限等) - walterlv...✔️ 多屏有不同 DPI(WPF 感知系统 DPI) ❌ ❌ ✔️ 多屏有不同 DPI(WPF 感知屏幕 DPI) ❌ ❌ ✔️ 多屏有不同 DPI(WPF 感知屏幕 DPI V2) ❌ ❌ ✔️ 纯

45440

Android目前最稳定和高效UI适配方案

Android适配最核心问题有两个,其一,就是适配效率,即把设计图转化为App界面的过程是否高效,其二如何保证实现UI界面在不同尺寸和分辨率手机中UI一致性。...那么这个dp是如何计算呢? 我们都知道一个公式: px = dp(dpi/160) 系统都是通过这个来判断px和dp数学关系, 那么这里又出现了一个问题,dpi是什么呢?...dpi是软件参考了物理像素密度后,人为指定一个值,这样保证了某一个区间内物理像素密度在软件上都使用同一个值。这样会有利于我们UI适配。...在把设计稿向UI代码转换过程中,我们需要耗费相当精力去转换尺寸,这会极大降低我们生产力,拉低开发效率。 宽限定符适配 为了高效实现UI开发,出现了新适配方案,我把它称作宽限定符适配。...Q:平板适配问题? A: 这个可以分成两个问题,第一,团队有没有专门针对平板设计UI?第二,才是如何对平板适配。

1.7K20
领券