在本节中，我们将介绍一个重要且简单的元素，即按钮。这个小元素可以改变整个UX。我们将使用该按钮来缩放我们的3D模型。此外，我们将尝试更改手机的壁纸。对于您的型号，如果您有不同的材质或颜色，您也可以更改它。
下载按钮和互动
要学习本教程，您需要Xcode 10。您可以下载Final Xcode项目，以帮助您与自己的进度进行比较。
设置
现在，您可以更改项目名称并添加应用程序图标。在设置页面中，将显示名称更改为角度AR或所需名称。在资产目录中，将应用程序图标从assets文件夹拖放到选定的插槽中。
主要故事板
我们在屏幕上放置一些按钮。使用模板，主故事板附带一个ARSCNView，我们无法在其上放置按钮。首先，删除ARSCNView并放置UIView。拥有UIView，允许我们放置这3个按钮并添加约束。这是按钮的约束：
| 按钮 | 约束 | |
|---|---|---|
| 左 | PlaceScreen | 左：46点 / 底部：28点 |
| 中 | 加号按钮 | 水平中心 / 底部：28点 |
| 右 | 减号按钮 | 右：46点 / 底部：28点 |
放置按钮后放回ARSCNView，并将约束条件设置为0，即四边。确保约束视图的每一侧而不是安全区域。取消选中Constrain到边距。在布局中，将ARSCNView放在View下方，否则按钮将不会显示。
约束
IBAction为
现在我们有了按钮，我们需要给它们功能。通过单击右上角带有双圆圈的图标启用助理编辑器。您将看到我们同时拥有主故事板和代码。在swift文件中，您将看到一个与之前的ARSCNView链接的IBOutlet。由于我们删除了那个，将新的ARSCNView链接到该Outlet。
让我们通过按住Control创建3个IBAction 并拖动ARSCNView Outlet 声明正下方的每个按钮。
选择：IBAction将它们命名为：plusButtonTapped，minusButtonTapped和placeScreenButtonTapped类型：UIButton
IBActions
类变量
2个第一个按钮的目的是能够调整我们的3D模型的大小。问题是iPhoneNode的声明是渲染器方法的局部变量。解决方案是声明另一个变量并使其成为与iPhoneNode相同的节点。在根级别和渲染器内声明变量iPhoneXNode，将2个变量匹配在一起。
var iPhoneXNode = SCNNode()
把这一行放在最后。
iPhoneXNode = iPhoneNode
iPhoneNodeChild
变换
在IBAction的括号内，您可以放置指定按钮的功能。对于plusButtonTapped，声明一个常量，这是一个缩放操作，并将数量设置为2x，持续时间为2秒。让iPhoneXNode运行此操作。对minusButtonTapped重复相同的步骤，但不是将模型缩放2x，而是将其更改为0.5。
@IBAction func plusButtonTapped(_ sender: UIButton) {
let scalePlus = SCNAction.scale(by: 2, duration: 2)
iPhoneXNode.runAction(scalePlus)
}
@IBAction func minusButtonTapped(_ sender: UIButton) {
let scaleMinus = SCNAction.scale(by: 0.5, duration: 2)
iPhoneXNode.runAction(scaleMinus)
}
切换材质
对于最后一个按钮，我们将更改3D模型的漫反射材质。在我们的例子中，这意味着我们正在改变iPhone的屏幕。调用节点并访问其漫反射材质。然后，转到art.scnassets并找到不同的屏幕。对我们来说，它是AR-Screen.png。
@IBAction func placeScreenButtonTapped(_ sender: Any) {
iPhoneXNode.geometry?.firstMaterial?.diffuse.contents = UIImage(named: "art.scnassets/AR-Screen.png")
}
结论
在本节中，我们学习了如何在Storyboard中放置按钮并约束它们。此外，我们将它们连接到代码，这样我们就可以提供功能。到目前为止，您可以使用按钮执行许多令人惊叹的事情。
网友评论