问题标签 [image-scaling]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
3 回答
1679 浏览

java - 重新缩放 PNG 的自定义方法会失去透明度

嘿伙计们,我正在为支持 java 的手机开发一个 j2ME 游戏。我正在尝试使用以下方法缩放透明 PNG:

它正确缩放图像,不幸的是我似乎失去了该方法返回的图像的透明度。我对这些概念相当陌生,任何帮助将不胜感激!请注意,为了在任何支持 java 的移动设备上正确显示,重新缩放需要在代码中完成,而不是在任何类型的图像编辑器中。

提前致谢!

0 投票
2 回答
712 浏览

html - 在 IE 中使用双三次插值对性能有何影响?

每个人都知道 IE7 不擅长缩放图像。我最近刚刚发现了img { -ms-interpolation-mode: bicubic; }在缩放图像时强制 IE 使用双三次采样以使它们看起来更好的技巧。但是,我想知道是否有人知道使用 ms-interpolation-mode 对性能的影响。

0 投票
2 回答
5850 浏览

html - 如何使 SVG 在 html 中显示没有滚动条

如何使 SVG 在 HTML 中没有滚动条的情况下可靠地显示?在 Firefox 和 Chrome 中都可以使用的东西就足够了。

  • 最基本的步骤是 SVG 在文档中显示为“自然”的宽度和高度。全面展开。没有滚动条。Firefox 通常会这样做。Chrome 通常不会(除非我使用实际宽度和高度的先验知识)。

  • 更高级的步骤是我给 SVG 一个任意宽度(比如 400 像素),并且 SVG 显示为适当缩放,同时保持其纵横比。同样,没有滚动条。

我宁愿不必知道 HTML 中 SVG 的自然尺寸。更改 HTML 或 CSS 是最好的,但更改 SVG(一次,不是针对我想要显示的每个尺寸)也可以。

这种事情可能吗?

这是一些嵌入 svg 的示例 html。

如果需要,下面的 <embed> 标记可以更改为 <object> 或其他内容。

这是一个示例 test.svg:

更新:

好的,似乎我正在使用的工具正在生成带有小写viewbox属性的 SVG,但是这是不正确的,并且属性名称实际上是驼峰式viewBox,因为 Erik 在下面正确地写了。

这与删除宽度/高度或更改为百分比相结合,使我能够解决问题的两个部分。

感谢大家!

0 投票
9 回答
40888 浏览

actionscript-3 - 如何将动态加载的图像调整为闪存(as3)

一旦动态调用到舞台并放置在 MC 中,我正在努力寻找正确的 as3 代码来调整图像的大小。我正在加载使用:

舞台最终将全屏打开(工作正常),所以我需要将图像保持在比舞台大得多的原始尺寸。

我需要做的是在加载时将其缩小到与舞台相同的高度,同时保持宽度成比例(哦并将其居中)。我尝试了各种代码,但找不到任何工作,因为我所做的只是调整包含图像的 MC 的大小,而不是图像本身。任何有关正确代码的指导将不胜感激。

我猜它就像这样简单

但如果是这样,写图像名称的正确方法是什么,正如我所写的那样,它似乎是错误的。非常感谢

埃德

0 投票
1 回答
2836 浏览

android - 如何在 Android 上缩小图像以获得更好的质量?

现在我正在使用以下代码来缩小运行时从互联网下载的图像。但结果还不够好。

有什么帮助吗?谢谢。

0 投票
1 回答
3674 浏览

image-processing - 使用 ImageMagick 像 Facebook 一样调整图像大小

我想以 Facebook 的方式调整(缩小)一些图像的大小。ImageMagick,但是,我愿意接受建议 :)

我相信 Facebook 正在这样做:

假设您的最大宽度 x 高度为 250x200,Facebook 正在优化它的使用。尝试尽可能多地使用 250x200。例如,如果您缩小图像并获得 220x200,那么他们会从图像的顶部和底部剪切,直到尽可能多地使用 250x200 帧。实际上,我认为他们从底部获取更多,而不是顶部(大约 1:2.5),我相信这是因为大多数图片的头部都在顶部,而 Facebook 意识到了这一点。

这种大小调整算法有什么名字吗?有没有办法让 ImageMagick 做到这一点?

提前致谢!

编辑 实际上,Facebook 可能根本不会采用这种“智能”调整大小的技术。他们只是在有最小宽度/最小高度的地方调整大小。然后,当他们在相册中展示图片时,他们会从顶部/底部或左侧/右侧切入,以尽可能多地使用框架(至少我是这样认为的)。

-托拜厄斯

0 投票
3 回答
1482 浏览

internet-explorer-6 - ie6 图像拉伸和缩放

我需要能够拉伸图像背景以适应窗口大小现在它可以在除 ie6 之外的所有浏览器中使用

这是我的演示站点,如果您有 ie6,您将能够看到我的问题我也需要它来拉伸整个宽度和高度,而不会扭曲图像

http://demo.jigsawfinance.com/

任何人都知道可行的解决方案我有img标签等但仍然无济于事

对于那些没有ie6的人,这里是屏幕截图

替代文字

如您所见,我有很多空白区域,图像也应该扩展

0 投票
2 回答
2343 浏览

android - 2x2 基于图像的菜单使用哪种布局?

我正在尝试创建一个屏幕(纵向模式),显示 4 个图像(大小相同,旨在缩小以适应屏幕),占据整个屏幕,将屏幕分成象限(一个高的 2x2 网格)。这将作为活动的主菜单类型,并且每个图像都应该是可点击的,以便将用户带到不同的活动。

我曾尝试在 LinerLayout 中使用 GridView(使用 Google 的 GridView 教程中的很多内容),但无法使图像正确缩放以填满整个屏幕。我在图像周围和/或整个屏幕的滚动中获得了额外的边距。

我也尝试过使用 TableLayout,在 2 行中的每一行中放置 2 个图像。从视觉上看,这非常有效。不幸的是,在使用它时,我似乎无法在我的活动代码中引用 TableLayout 中的 ImageView 项目(findViewById 始终返回 null)。

我觉得 TableLayout 真的不是“正确的做法”,但我想听听其他人怎么说。无论哪种方式,应该做些什么来完成我想要的功能?

谢谢。

编辑 1.1:相对布局更适合排列整齐。现在我只剩下 findViewById 总是返回 null 的问题了。到目前为止,这是我的代码:

0 投票
1 回答
4726 浏览

android - Android - 在不同分辨率的位图上确定特定位置(X,Y 坐标)?

我正在尝试创建的应用程序是棋盘游戏。它将有一个位图作为棋盘,棋子将移动到棋盘上的不同位置。板子的一般设计是方形的,有一定的列数和行数,并有一个外观的边框。想想棋盘或拼字板。

在使用位图之前,我首先通过手动绘制来创建板和边框 - drawLine & drawRect。我根据“onSizeChanged”中传入的屏幕宽度和高度来决定边框宽度的像素数。剩下的屏幕除以我需要的列数或行数。

例如,假设屏幕尺寸为 102 x 102。

我可能选择将边框设置为 1,并将行数和列数设置为 10。这将留下 100 x 100(减少 2 以说明顶部和底部边框以及左/右边框)。然后将列和行设置为 10,这将留下 10 个像素的高度和宽度。

无论传入什么屏幕尺寸,我都会准确存储边框宽度的像素数以及板上每个正方形的高度和宽度。根据一个简单的公式,我确切地知道将碎片移动到屏幕上的哪个位置,并且我确切地知道用户触摸了哪个单元格以进行移动。

现在如何处理位图?意思是,如果我为每个密度创建 3 个不同的背景位图,它们是否仍会调整大小以适应每个设备的屏幕分辨率,因为从我读到的不仅仅是 3 个屏幕分辨率,而是 5 个,现在使用平板电脑 - 甚至更多的。如果我或 Android 将位图向上或向下缩放以适应当前设备的屏幕尺寸,我将如何知道边框缩放到多宽以及每个正方形的尺寸,以便确定将棋子移动到哪里或计算玩家的位置感动。到目前为止,我看过的示例只是展示了如何缩放整个位图并获得整体位图的宽度和高度。但是,我不知道如何判断板的每个部分在缩放后会有多少像素宽或高。

如果有人有任何示例代码或 URL 指向我可以使用位图阅读此内容,我将不胜感激。

顺便说一句,这里有一些示例代码(非常简化),关于我如何知道我的游戏板(边框和正方形)的尺寸,无论屏幕尺寸如何。现在我只需要知道如何将电路板作为可缩放到任何屏幕尺寸的位图来执行此操作。


我想我找到了答案。我可能无法在单个缩放位图中找到每个可播放方块的确切宽度/高度和位置,但是通过查看 SDK 中的 Snake 示例,我发现它不会为整个板创建 1 个位图并缩放它基于屏幕尺寸 - 相反,它为每个图块创建一个位图,然后根据屏幕分辨率和屏幕上所需的图块数量缩放图块 - 就像我手动绘制板时所做的那样。使用这种方法,我应该能够找到板上所有可玩方块的确切像素边界。我只需要将板分成每个正方形的多个位图。我可能必须对边界采取类似的方法,这样我也可以在缩放后检测它们的宽度/高度。

现在我将对其进行测试以验证,但我希望它能够根据我在 Snake SDK 示例中看到的内容工作。

- 麦克风


我测试了一种方法来做我所要求的,它似乎有效。这是我所做的:

我为一块板创建了一个 320 x 320 的位图。它由边框和正方形组成(如棋盘)。边框在电路板上一直宽度为 10 像素。正方形为 20 x 20 像素。

我通过onSizeChanged检测到屏幕的宽高。在 480 x 800 显示器上,我将板的新宽度设置为 480 x 480,并使用以下代码来缩放整个东西:

现在为了检测边框被缩放到多少像素宽度以及正方形被缩放到多少像素的高度和宽度,我首先计算了整个图像被缩放了多少。我知道位图是 320 x 320,因为我创建了它。我使用以下公式来计算图像的缩放程度:

floatBoardScale = floatScreenWidth / 320;

在 480 宽屏幕的情况下,floatBoardScale 等于:1.5。然后为了计算我在完整位图中的边框被缩放到什么,我做了:

floatBorderWidth = 10 * floatBoardScale;

10 是我的 320 x 320 位图中的原始边框宽度。在我的最终代码中,我不会硬编码值,我将使用变量。无论如何,在这个公式的情况下,新计算的边框宽度应该是:15

当我将相同的比例因子乘以棋盘方格(原始位图中为 20 x 20)时,我得到了 30 x 30 的新值。当我在公式中使用这些值来计算人触摸的方格时,它起作用了。我触摸了正方形的每个角落和中心,它总是计算出正确的位置。这很重要,所以无论屏幕分辨率如何,我都知道用户想要将一块移动到哪里,并且视觉上它会显示在正确的位置。

我希望这可以帮助任何可能有同样问题的人。另外,如果有人有更好的方法来完成同样的事情,请发布。

0 投票
1 回答
7925 浏览

android - 如何缩放图像以填满屏幕

我的问题是这样的:我使用 android 模拟器,针对 android 2.2。我创建了一个自定义视图,我想处理我的应用程序的背景,在这个视图中我只想显示一个图像,但我希望它填满整个屏幕。

我从我的“活动”初始化视图,如下所示:BackgroundView bw = new BackgroundView(this);

问题:在我的硬盘上,我使用的资源图像是 500x375 像素。调用后:

位图 m_resourceBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.landscape_1); int nWidth = m_resourceBitmap.getWidth(); int nHeight = m_resourceBitmap.getHeight();

返回的 nWidth 和 nHeight 取决于我放置资源的位置,如果我将它放在“drawable-mdpi”中,我会得到原始尺寸,否则我会得到其他尺寸。

另一方面,如果我通过 this.getWidth(); 询问视图的宽度和高度;this.getHeight();

我得到固定值,但与设备的预期分辨率不同(我设置了 480x800 设备,得到 320x533)

最后,如果我尝试使用视图尺寸除以图像尺寸来创建比例矩阵,那么屏幕上的结果是比屏幕小得多的图像......

我的问题是:我应该问什么问题以及从哪些对象中可以在 View 中绘制资源位图以使其占据整个屏幕?