为不同的iphone设置图像并调试

时间:2016-06-01 14:36:22

标签: ios iphone swift xcode7 xcasset

我目前正在开发ios应用程序,范围仅限于iPhone和纵向模式。

在每个屏幕中都有图像,按钮,标签和textFields。这里的问题是,如何从Images.xcassets中为设备渲染适当的图像?

我现在在做什么,写在下面 -

  1. 从草图设计应用程序导出我的图像1x,2x和3x(由UI设计师设计的屏幕)

  2. 将它们添加到Xcode项目中(从finder拖放到xcode)

  3. 在Images.xcassets中添加新图像集(将其命名为" MyImages")并将我的图像拖放1x,2x,3x。

  4. 在故事板中,在viewcontroller上添加ImageView

  5. 对于图像视图,选择Image as" MyImages"来自Attribute Inspector。

  6. 完成上述步骤后,当我从iphone4s,iphone5,iphone5s,iphone6等开始在模拟器上测试应用程序时...(Xcode 7.3上提供的所有模拟器),我都看不到合适的正在渲染图像。

    我的方法是否正确?

    另外,如何在屏幕上调试UI元素?比如,我如何/在哪里检查渲染的图像?它的大小(W X H)?

    添加了屏幕截图

    enter image description here

3 个答案:

答案 0 :(得分:1)

对于iPhone而言,它们都应该是2x图像,除了iPhone应该是3倍的加号iPhone。这不是你所看到的吗?

在调试/检查时 - 您可以将持有者图像放置在您的资产中,并带有标签或不同颜色的色调,以便将它们彼此区分开来,然后在您知道所有内容后再将图像替换为具有所需最终外观的图像按预期工作。

答案 1 :(得分:1)

使用iPhone的2x图像方法工作正常,但是,通过使用优质的大质量PDF(矢量),还有另一种更直接的方式,而不必在Xcode中使用1x,2x,3x的多个图像文件。 / p>

<强> 1。创建要使用的图像/图形图像的大PDF

<强> 2。将其导入&#39; Assets.xcassets&#39; - 拖放(进入Xcode)

第3。转到右侧的实用程序面板,查看“属性”检查器&#39; (选择图像时)

参见屏幕截图(a)

enter image description here

enter image description here

比例因子&#39;从多个&#39;中选择到&#39; 单一载体&#39;

现在,当你到了故事板&#39;并添加图像 - 只需选择PDF的名称。 Xcode会在运行时为您自动呈现正确的大小等。所有的工作都是由Xcode完成的。

例外: 对于TabBar或导航栏项目中的图标图像,它不能很好地工作。

注意: 矢量图形非常清晰,是高清晰度(HD)的理想选择,但是虽然Xcode接受图像资产作为PDF的矢量,但它似乎不会保留矢量,而是将其转换为实际图像,当放大时出现像素化问题从高清的角度来看。

答案 2 :(得分:1)

@Lohith Korupolu:

您提供的屏幕截图是通用尺寸(iPhone / iPad)。根据评论中提供的其他信息,这将导致问题与AutoLayout约束,这将阻止图片显示在比StoryBoard中显示的尺寸更小的屏幕上。

例如我已在故事板上复制了您的问题......

enter image description here

这导致了iPhone 4s模拟器中的以下内容....

enter image description here

即。文字在那里,但没有图像

原因:为较大的“通用”屏幕设置的autoLayout约束,在较小的屏幕上查看时会使图像不可见/消失。

解决方案

<强> 1。清除故事板中此选定图像的Autolayout约束。见下图... enter image description here

<强> 2。添加AutoLayout约束,如下面的x2图片。 (顶部约束,高度+宽度)(水平在容器中)。记住勾选“新约束条款”。

enter image description here enter image description here

第3。为iPhone 4s运行模拟器...例如

enter image description here

**其他iPhone尺寸模拟器运行也出现了同样的情况。 **

******所有工作******