简体   繁体   English

为什么我的UIButton图像大小在模拟器和设备中有所不同?

[英]Why is my UIButton Image size different in Simulator and Device?

I have created a screen with 2 images on it (150 x 150 pixels) designed to take up most of the screen. 我创建了一个屏幕,上面有两个图像(150 x 150像素),用于占据大部分屏幕。 This looks fine in the simulator, but when I actually run the app on the device, the images have shrunk down to become very tiny. 这在模拟器中看起来很好,但是当我在设备上实际运行应用程序时,图像缩小了变得非常小。 I assume that the device sizes are the size of the actual image itself. 我假设设备大小是实际图像本身的大小。

I used very high quality images so you can't notice that the image has been stretched on the simulator. 我使用了非常高质量的图像,因此您无法注意到图像已在模拟器上拉伸。

Is there something that I can use to ensure that I am always going to use the 150x150 size? 有什么东西我可以用来确保我总是使用150x150尺寸?

Many thanks 非常感谢

Jon 乔恩

from what you described, this can be fixed by simply setting the constraints for each object on your storyboard. 根据您的描述,只需在故事板上为每个对象设置约束即可解决此问题。

To give you an example of how to do this, I've added two UIImageView objects to the storyboard. 为了举例说明如何执行此操作,我在故事板中添加了两个UIImageView对象。 Select the first object and press the constraints button at the bottom like in the picture below, and you will need to make sure at least 4 constraints have been set. 选择第一个对象并按下底部的约束按钮,如下图所示,您需要确保至少设置了4个约束。 Specifically, check the HEIGHT, WIDTH and select the distance to LHS and distance to TOP by selecting the corresponding struts which will change to a highlighted orange colour (see picture) 具体来说,检查HEIGHT,WIDTH并选择到LHS的距离和到TOP的距离,方法是选择相应的支柱,它将变为高亮的橙色(见图)

在此输入图像描述

Once this has been done, press the 'Add 4 Constraints' button at the bottom. 完成此操作后,按下底部的“添加4个约束”按钮。 Then repeat this with the second UIImageView object. 然后使用第二个UIImageView对象重复此操作。

When the constraints are properly set (with no conflicts) they will be visible if you select the object, and the constraint lines will be blue (see pic below) 当约束被正确设置(没有冲突)时,如果选择对象,它们将是可见的,约束线将是蓝色的(见下图)

在此输入图像描述

By following these steps for adding objects to your storyboard, then this will solve the issue of the squashed image on the device. 通过按照以下步骤将对象添加到故事板,这将解决设备上压扁图像的问题。 Further reading on configuring auto-layout constraints would be very useful. 有关配置自动布局约束的进一步阅读将非常有用。

I hope this helps 我希望这有帮助

  1. Just check your image name, because device is case sensitive but simulator is not.After changing the image name,if it will work then fine. 只需检查您的图像名称,因为设备区分大小写,但模拟器不是。更改图像名称后,如果它将工作,那么很好。
  2. you can add a 2x version of image(as: yourImage@2x.png). 您可以添加2x版本的图像(as:yourImage@2x.png)。
  3. Remove installed app from device, and run it again. 从设备中删除已安装的应用,然后再次运行。

I think it will help you. 我认为它会对你有所帮助。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM