在这个新的十年之交，如果有一个领域有可能彻底改变我们与智能手机互动的方式，那就是增强现实（AR眼镜：你在读这个吗？）。谷歌一直在推进自己的平台ARCore，它使开发者能够在Android、iOS、Unity等平台上创建AR体验

AR简史

ARCore可以做很多事情。从运动跟踪到环境理解和光估测，它已经涵盖了大部分的基础。然而，尽管它是在2017年推出的，但直到最近，诸如增强人脸、共享摄像头和AR元素等新功能被加入，并开始显示ARCore的真正潜力，它才在这方面获得更多关注和进展。

ARCore的采用花费了一些时间，其中一个原因是它最初在3D图形上对OpenGL的依赖。当ARCore发布时，Java（或Kotlin）无法进行3D内容的导入和查看，这迫使开发人员不得不使用OpenGL（陡峭的学习曲线会给任何人带来噩梦）或Unity，其与Android组件集成时很痛苦。谷歌必须对此做点什么才行。

他们在2018年推出了Sceneform，剩下的就是历史了。

Sceneform：Android开发者的救生艇

Sceneform是一个3D框架，它允许我们使用高级图形API来呈现3D模型。它附带了一个插件，可以让你直接从Android Studio导入、预览和构建3D资源。Sceneform与ARCore紧密集成，使Java和Kotlin开发人员能够轻松构建高质量的Android AR应用程序。

Sceneform SDK可以为您处理以下事项：

• ARCore设备兼容性检查
• 相机权限
• 创建ARCore会话

现在我们已经很好地了解了Sceneform能为我们做什么，让我们定义一下本文的目标。

我们的目标

• 解决ARCore和Sceneform的一些关键术语和构建块。
• 使用Kotlin在Android AR应用程序中设置平面检测和命中测试，添加多个节点。
• 处理可变换节点上的手势和碰撞。

关键术语

Sceneform是一个基于节点的图，它可以做很多事情。从处理平面检测和允许我们在场景上设置节点（可以是零个或更多个节点），到执行命中测试等等。

命中测试是一种将用户在屏幕上点击位置的二维坐标转换为在AR场景中的三维投影的方法。想象一束光线从屏幕上的点击点发出，穿过手机的摄像头视图。这个想象的光线与AR场景的平面相交的第一个就是世界坐标位置。然后我们可以在这个世界位置设置节点。

在上一节中，我们讨论了节点、可变换节点等术语。让我们在这里定义它们：

• 场景：我们的3D对象被渲染的地方。它有一个树状的数据结构。
• 节点：一个包含所有需要在屏幕上渲染的信息的对象。它可以包含一个可渲染属性，我们可以在该属性上设置我们的三维资源和材质形状。此外，它还包括一个用于检测碰撞的碰撞形状。节点可以有零个或多个子节点和一个父节点。
• 可渲染：可以从资源文件（OBJ、FBX、glTF）创建的三维模型，如这里所示，或使用MaterialFactory或ShapeFactory创建基本形状，如立方体、球体和具有纹理的圆柱体。
• 锚节点：这些类型的节点被指定到AR世界空间中的特定位置。通常，这是检测到平面后放置的第一个节点。
• 可变换节点：顾名思义，它们可以被变换。它们能够通过对用户手势做出反应，在AR场景中缩放、平移和旋转。
• 姿态：提供节点在场景中的位置和方向。我们还可以确定摄像头的姿态，并找到摄像头与场景中锚节点之间的距离。

一旦将ArFragment添加到Activity的布局中，它就会在检查设备通过ARCore兼容性测试后，执行设置ARCore会话和ArSceneView的基础工作。

MaterialFactory和ShapeFactory

以下代码演示如何创建具有形状的可渲染对象并将其放置在节点上：

MaterialFactory.makeOpaqueWithColor(this, Color(android.graphics.Color.YELLOW))
        .thenAccept { material ->
            val vector3 = Vector3(0.05f, 0.05f, 0.05f)
            cubeRenderable = ShapeFactory.makeCube(vector3, Vector3.zero(), material)


            cubeRenderable!!.isShadowCaster = false
            cubeRenderable!!.isShadowReceiver = false

        }

MaterialFactory定义材质类型-金属、颜色、不透明度等，并将其放在ShapeFactory实例上。ShapeFactory类定义形状的尺寸。设置球体（具有半径）和圆柱体（具有半径和高度）的函数是：

ShapeFactory.makeCylinder(0.1f,0.3f,Vector3.zero(), material)
ShapeFactory.makeSphere(0.1f, Vector3.zero(), material)

以下是在ArSceneView上放置可渲染节点时的效果图：

当用户选择节点或以编程方式调用select()方法时，将显示围绕该节点的圆圈。

下面的代码片段展示了如何将我们在上面创建的可渲染节点添加到平面上的可变换节点：

arFragment!!.setOnTapArPlaneListener { hitResult, plane, motionEvent -> 
val anchor = hitResult.createAnchor()
val anchorNode = AnchorNode(anchor)
anchorNode.setParent(arFragment!!.arSceneView.scene)
val node = TransformableNode(arFragment!!.transformationSystem)
node.renderable = cubeRenderable
node.setParent(anchorNode)

arFragment!!.arSceneView.scene.addChild(anchorNode)
node.select()
}

因此，在点击一个平面时，我们可以添加一个可以在该平面边界上移动的可变换节点。

现在我们已经很好地了解了Sceneform的不同组件，让我们构建一个基于ARCore的Android应用程序，它可以检测冲突并计算两个可变换节点之间的距离。

开始

首先，在Android Studio中创建一个新的Kotlin项目。请确保ARCore和Sceneform工作所需的最低Android API级别27，并在app的build.gradle文件中添加下面的依赖：

implementation 'com.google.ar.sceneform.ux:sceneform-ux:1.14.0'

设置ArFragment

接下来，让我们向activity_main.xml布局文件添加一个ArFragment，如下所示：

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <fragment
        android:id="@+id/ux_fragment"
        android:name="com.google.ar.sceneform.ux.ArFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <TextView
        android:id="@+id/tvDistance"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:background="@android:color/black"
        android:gravity="center"
        android:padding="8dp"
        android:textColor="@android:color/white"
        android:textSize="20sp" />

</FrameLayout>

我们还添加了一个TextView来显示节点之间的距离。

检查OpenGL兼容性

现在回到MainActivity.kt类，检查OpenGL版本是否3.0或者更高：

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)

    if (!checkIsSupportedDeviceOrFinish(this)) {
        Toast.makeText(applicationContext, "Device not supported", Toast.LENGTH_LONG).show()
    }
    setContentView(R.layout.activity_main) 
}

fun checkIsSupportedDeviceOrFinish(activity: Activity): Boolean {

    val openGlVersionString = (Objects.requireNonNull(activity.getSystemService(Context.ACTIVITY_SERVICE)) as ActivityManager)
        .deviceConfigurationInfo
        .glEsVersion
    if (java.lang.Double.parseDouble(openGlVersionString) < MIN_OPENGL_VERSION) {
        Toast.makeText(activity, "Sceneform requires OpenGL ES 3.0 or later", Toast.LENGTH_LONG)
            .show()
        activity.finish()
        return false
    }
    return true
}

在平面上添加多个节点

现在，让我们修改setOnTapArPlaneListener方法以容纳两个可变换的节点。在下面的MainActivity.kt代码中，我们初始化了两个3D渲染模型-其中一个用于在碰撞期间修改可变换的材质。

class MainActivity : AppCompatActivity(), Scene.OnUpdateListener {


    private var arFragment: ArFragment? = null
    private var tvDistance: TextView? = null
    private var cubeRenderable: ModelRenderable? = null

    private var nodeA: TransformableNode? = null
    private var nodeB: TransformableNode? = null

    var greenMaterial: Material? = null
    var originalMaterial: Material? = null

    var overlapIdle = true


    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        if (!checkIsSupportedDeviceOrFinish(this)) {
            Toast.makeText(applicationContext, "Device not supported", Toast.LENGTH_LONG).show()
        }

        setContentView(R.layout.activity_main)

        arFragment = supportFragmentManager.findFragmentById(R.id.ux_fragment) as ArFragment?
        tvDistance = findViewById(R.id.tvDistance)

        initModel()
        
        arFragment!!.setOnTapArPlaneListener { hitResult, plane, motionEvent ->
            
            if (cubeRenderable != null) {

                val anchor = hitResult.createAnchor()
                val anchorNode = AnchorNode(anchor)
                anchorNode.setParent(arFragment!!.arSceneView.scene)

                if (nodeA != null && nodeB != null) {
                    clearAnchors()
                }

                val node = TransformableNode(arFragment!!.transformationSystem)
                node.renderable = cubeRenderable
                node.setParent(anchorNode)

                arFragment!!.arSceneView.scene.addChild(anchorNode)
                node.select()

                if (nodeA == null) {
                    nodeA = node
                    arFragment!!.arSceneView.scene.addOnUpdateListener(this)
                } else if (nodeB == null) {
                    nodeB = node

                }
            }
        }
    }


    private fun initModel() {

        MaterialFactory.makeOpaqueWithColor(this, Color(android.graphics.Color.GREEN))
            .thenAccept { material ->
            greenMaterial = material
        }

        MaterialFactory.makeOpaqueWithColor(this, Color(android.graphics.Color.RED))
            .thenAccept { material ->
                val vector3 = Vector3(0.05f, 0.05f, 0.05f)
                cubeRenderable = ShapeFactory.makeCube(vector3, Vector3.zero(), material)
                originalMaterial = material
                
                cubeRenderable!!.isShadowCaster = false
                cubeRenderable!!.isShadowReceiver = false

            }
    }


    fun checkIsSupportedDeviceOrFinish(activity: Activity): Boolean {

        val openGlVersionString = (Objects.requireNonNull(activity.getSystemService(Context.ACTIVITY_SERVICE)) as ActivityManager)
            .deviceConfigurationInfo
            .glEsVersion
        if (java.lang.Double.parseDouble(openGlVersionString) < MIN_OPENGL_VERSION) {
            Toast.makeText(activity, "Sceneform requires OpenGL ES 3.0 or later", Toast.LENGTH_LONG)
                .show()
            activity.finish()
            return false
        }
        return true
    }

    private fun clearAnchors() {
        
        arFragment!!.arSceneView.scene.removeChild(nodeA!!.parent!!)
        arFragment!!.arSceneView.scene.removeChild(nodeB!!.parent!!)

        nodeA = null
        nodeB = null
    }
    
    companion object {
        private val MIN_OPENGL_VERSION = 3.0
    }
}

注意Scene.OnUpdateListener接口，onUpdate(frameTime: FrameTime)方法，我们在Activity类中设置。在场景更新之前，每帧会调用一次该回调方法。我们可以在这个函数中处理任何事件。FrameTime属性将为我们提供当前帧的时间信息，从而允许我们在希望定期向场景添加一些自定义设置时利用该信息。

在下一节中，我们将检测两个节点上的碰撞事件。

使用OverlapTest检测碰撞

Sceneform处理碰撞的方式稍有不同（它称之为重叠）。目前，它没有一个事件处理程序来告诉您碰撞何时开始和何时结束。

通过调用overlapTest()函数并传递节点，可以确定它是否与场景中的任意节点重叠。或者，您可以使用overlaptTestAll()函数来获取重叠节点的列表。

以下代码处理碰撞并相应地更改节点的可渲染材质：

override fun onUpdate(frameTime: FrameTime) {

        if (nodeA != null && nodeB != null) {

            var node = arFragment!!.arSceneView.scene.overlapTest(nodeA)

            if (node != null) {

                if (overlapIdle) {
                    overlapIdle = false
                    nodeA!!.renderable!!.material = greenMaterial
                }

            } else {

                if (!overlapIdle) {
                    overlapIdle = true
                    nodeA!!.renderable!!.material = originalMaterial
                }
            }
        }
}

为了简单起见，我们只会在平面上放置两个可变换节点时检测重叠。

计算两个节点的距离

要连续计算两个可转换节点之间的距离，请在onUpdate回调函数中添加以下代码：

val positionA = nodeA!!.worldPosition
val positionB = nodeB!!.worldPosition

val dx = positionA.x - positionB.x
val dy = positionA.y - positionB.y
val dz = positionA.z - positionB.z

val distanceMeters = Math.sqrt((dx * dx + dy * dy + dz * dz).toDouble()).toFloat()

val distanceFormatted = String.format("%.2f", distanceMeters)

tvDistance!!.text = "Distance between nodes: $distanceFormatted metres"

最后，在所有设置就绪的情况下，在与ARCore兼容的设备上运行上述应用程序可以得到以下结果：

结论

与Sceneform的ARCore最近取得了一些进展。随着最新的更新发布了一些有趣的功能，比如增强的面孔、UI元素、在AR中运行时加载元素、共享摄像头等等，Google正在缓慢而稳定地赶上竞争对手。ARCore的跨平台支持也让它比其他公司有很大的优势。

新的深度API的发布会帮助开发人员构建更具沉浸性的AR场景和体验。

这里提供了这篇文章的完整源代码github仓库或者码云仓库。就这样。谢谢你的阅读。

原文链接