使用居中图像iOS启动屏幕故事板

Question

1 - 我想在我的应用程序中使用LaunchScreen.storyboard

2 - 在此启动屏幕中,我需要在屏幕中央插入品牌图像

谁能帮助我？

Answer 1

我知道了!

以下是步骤图片的链接:

1 - 在选项卡>常规中设置启动文件

2 - 在Project导航器中选择LaunchScreen.storyboard,选中文件Inspector中的"Use as Launch Screen"选项

3 - 在视图控制器场景中拖放ImageView

4 - 选择之前添加的ImageView,更改其宽度和高度.我把wxh 200

首先,选中此框并在更改大小值后

单击"添加2个约束"按钮

5 - 选择ImageView后,更改位置以集中它.

首先,选中此框并在更改大小值后

单击"添加2个约束"按钮

6 - 差不多完成!!!

现在让我们解决自动布局问题,单击"解决自动布局问题"按钮并更新框架

7 - 是时候挑选我们的形象了

选择ImageView后,转到> Atributes Inspector选项卡并选择你想要的图像,remenber删除它的扩展名(这是技巧,因为图像可能会在真实设备上构建应用程序时出现,发生在我身上!!!).

8 - 所以,CMD + R来构建和运行你的应用程序.瞧!!!!!

Answer 2

不幸的是，@ Jhonsore的回答对我没有用。

这是我为使其正常工作所做的事情：

注意这也适用于React Native初始化随附的.xib文件

添加图像文件

1）在image.xcassets下，右键单击并选择New Image Set。创建三种不同尺寸的图像（@ 1x，@ 2x，@ 3x），然后将其拖动到1x，2x，3x插槽中以添加图像。对于3倍，我建议使用大于1200像素的尺寸。

2）命名新图像集，例如：splash

创建启动屏幕

1）右键单击您的项目，单击“ 新建文件...”，然后添加一个启动屏幕。

2）选择您的项目，然后在“ 常规”->“应用程序”图标和启动图像->“启动屏幕文件”下，选择新创建的启动屏幕

3）打开启动屏幕

4）选择视图控制器场景->视图控制器

5）在右侧窗格中，选择“ 模拟指标”->“大小”，然后将其更改为“ 页面表”

6）在左侧面板中，删除两个文本输入（版权和项目名称）

7）通过单击下面的屏幕快照中显示的按钮并将其拖动到视图的中心来添加图像视图

8）在右侧面板中选择“图像视图”，然后选择“ 视图”->“内容模式”->“宽高比”。还可以通过选择** Image View-> Image添加图像

10）转到“ 大小检查器”（标尺图标，请参见屏幕截图），然后选择看起来不错的宽度和高度（这将缩放为其他屏幕尺寸）。

11）将图像拖到屏幕中央，直到看到水平和垂直蓝线

12）最后，在“ 自动调整大小”下，使用箭头更改窗口，使其看起来如上图所示。应取消选择所有外部箭头，并选择所有内部箭头。

结果

故障排除： 如果您的图像未在模拟器上显示，请尝试重新启动它或尝试选择其他设备。

公交车图片来源：Eliott Van Buggenhout

Answer 3

我用响应式设置解决了它

在 Attribute Inspector -> Content Mode -> Aspect Fill

在尺寸检查器 -> 布局 -> 自动：

添加新约束 -> 如下图所示填充，然后单击添加 5 个约束