不同分辨率下的位置对象问题

发布于 2024-08-22 01:16:47 字数 1019 浏览 4 评论 0原文

情况
导出为投影仪的 Flex 项目,全屏显示。该项目有一个背景和几个点,每个点代表一个“位置”。这些位置是从 XML 文件中获取的,并以百分比形式设置其位置。以像素为单位的位置是根据应用程序的宽度和高度计算的(这按其应有的方式工作)。点放置正确。

背景为JPG,分辨率为1280*1024。此时,背景设置在 Canvas 上,且 backgroundSize = auto。这会将图像置于中心而不拉伸它。拉伸会产生丑陋的像素化图像,并破坏比例。

问题
当我们以两种不同的分辨率(1 = 1280*1024;2 = 1024*768)查看项目时,点的位置很好,背景图像很清晰。但是 - 由于背景的分辨率与 1 相同,因此背景在分辨率 2 中未完全显示(因为它没有拉伸。逻辑结果。

这就是我尝试拉伸背景的原因。结果:
以正确方式放置的点 http://i733.photobucket.com/albums/ ww336/winkelman66/example1.jpg

在较小/其他分辨率上:
替代文本 http://i733.photobucket.com/albums/ww336/winkelman66/ example2.jpg

解决方案?
我应该如何解决这个问题?我想始终将背景置于底部中心,保持比例不变。由于缺少图像的细节/部分,这不是一个选项。拉伸会导致丑陋、像素化的图像不成比例。
我知道拉伸可能是在不丢失部分图像的情况下解决分辨率问题的唯一选择,但是如何解决点位置不正确的问题(如图 2 所示)。

Situation
A Flex project exported as a Projector, showing fullscreen. The project has a background and several dots which each represent a "Location". These locations are fetched from an XML file and have their position set in percentages. The location in pixels is calculated (this works as it should) by the width and height of the Application. The dots are placed correctly.

The background is a JPG with a resolution of 1280*1024. At this moment, the background is set on a Canvas with backgroundSize = auto. This places the image in the center without stretching it. Stretching results in ugly, pixelated images and tears the proportions apart.

Problem
When we view the project on 2 different resolutions (1 = 1280*1024; 2 = 1024*768), the dots are in the good position, the background image is sharp. But - because of the background having the same resolution as 1, the background isn't fully shown in resolution 2 (because it isn't stretched. A logic result.

That's why I tried stretching the background. The results:
Dots placed in the correct way http://i733.photobucket.com/albums/ww336/winkelman66/example1.jpg

On a smaller/other resolution:
alt text http://i733.photobucket.com/albums/ww336/winkelman66/example2.jpg

Solution?
How should I solve this problem? I thought of always having the background centered on the bottom, leaving the proportions as they are. This is not an option because of missing details/parts of the image. Stretching results in ugly, pixelated images which are out of proportion.
I know stretching might be the only option to tackle the resolution problem without losing parts of the image, but how can I solve the problem where the dots aren't in the good position (like image 2 shows).

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

木緿 2024-08-29 01:16:47

不知道这是否正是您的意思,但我会尝试一下:P

  1. 获取原始背景大小
  2. 获取拉伸背景的大小
  3. 计算宽度和高度差异
  4. 反映点位置上的差异

Don't know if this is exactly what you mean but i'll give it a shot :P

  1. Get the original background size
  2. Get the size of the stretched background
  3. calc the width and height difference
  4. Reflect the difference on the points position
爱*していゐ 2024-08-29 01:16:47

大问题,简单的解决方案(在工作时间之后)。
我们只是在计算中忘记了一件简单的事情:反映位置中点的大小(宽度/高度)...

因此,如果您在根据百分比计算像素位置时遇到同样的问题,请不要忘记包括 < code>(viewToBePositioned.width / 2) 在你的计算中:-)

Big problem, simple solution (after working hours on this).
We just forgot 1 simple thing in our calculations: reflect the size (width/height) of the dots in the position...

So if you face the same problem when calculating the location in pixels from percentages, don't forget to include (viewToBePositioned.width / 2) in your calculations :-)

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文