如何在ARKit中的SCNPlane上渲染透明背景的UIView？ - 腾讯云开发者社区

图2 AR 应用的整体架构 ARKit 是连接真实世界与虚拟世界的桥梁，而渲染引擎是把虚拟世界的内容渲染到屏幕上。本部分会围绕这两个方面展开介绍。...图7 高度信息提取卡片渲染通常我们想展示的信息，都是通过 UIView 及其子类来实现。但是 ARKit 只负责建立真实世界与虚拟世界的桥梁，渲染的部分还是要交给渲染引擎来处理。...借助 UIGraphics 中的一些方法可以将绘制好的 UIView 渲染成一个 UIImage 对象。根据这张图片创建 SCNPlane，以作为 SCNNode 的外观。...卡片大小 ARKit 中的物体都是近大远小。只要固定好 SCNPlane 的宽高，ARKit 会自动根据距离的远近设置 SCNPlane 的大小。...点击熟悉 Cocoa Touch 的朋友都了解，UIView 的层级结构是通过 hit-testing 来判断哪个视图响应事件的，在 ARKit 中也不例外。

2.1K2 0

ARKit示例 - 第2部分：平面检测+可视化

ARKit - 检测到平面并映射到楼层在我们的第一个hello world ARKit应用程序中，我们设置了我们的项目并渲染了一个虚拟3D立方体，可以在现实世界中渲染并在您移动时进行跟踪。...; 检测平面几何在ARKit中，您可以通过在会话配置对象上设置planeDetection属性来指定要检测水平平面。...SCNNode实例是ARKit创建的SceneKit节点，它有一些属性设置，如方向和位置，然后我们得到一个锚实例，这告诉我们使用有关已找到的特定锚的更多信息，例如大小和中心飞机锚实例实际上是一个ARPlaneAnchor...我还在SCNPlane几何体上设置了网格材质，以使可视化看起来更好，为简洁起见，我在此省略了该代码。...我在SCNPlane几何体中添加了Tron样式的网格纹理，我在这里省略了它，但你可以查看源代码。

2.9K2 0

您找到你想要的搜索结果了吗？

是的

没有找到

图像检测-如何通过扫描图像来制造幻觉

今年，Apple发布了ARKit 2的新功能。其中之一就是图像检测。这是一个非常酷的功能，允许您在用户的环境中跟踪2D图像，并在其上放置增强现实内容。...在本课程中，您将学习如何通过检测您喜欢的任何图像以及如何在呈现模型时更改模型的材质，将您自己的3D模型放置在任何对象之上。...第一个AR项目如果这是您的第一个ARKit项目，我强烈建议您阅读我们的ARKit简介，因为我们不会在这里介绍基础知识。...{ let node = SCNNode() return node } 该渲染器允许您从渲染场景中的节点，所以你就可以将其添加在图像的顶部。...通过拖放这些元素从媒体库中插入这些图像：ARLeft，ARRight和iPhoneX-Screen。单击场景并将其颜色更改为“ 自定义”，并将不透明度设置为0。 ?

2.4K2 0

建立您的第一个AR体验

重要如果您的应用需要ARKit作为其核心功能，请使用应用文件部分UIRequiredDeviceCapabilities中的arkit键，使您的应用仅在支持ARKit的设备上可用。...ARKit还在平面锚点中提供了更简单的extent和center估计，并且它们一起描述了矩形边界（使用SCNPlane易于可视化）。...为了显示每个平面的当前估计形状，此示例应用程序还实现了renderer(_:didUpdate:for:)方法，更新ARSCNPlaneGeometry和SCNPlane对象以反映来自ARKit的最新信息...中的世界跟踪发现支持概念，功能和最佳实践，以构建出色的AR体验。...class ARPlaneAnchor 有关在世界跟踪AR会话中检测到的真实世界平面的位置和方向的信息。

1K2 0

VR+全景播放器+头控讲解-06

学习目标掌握头控部分布局如何检测头控按钮被选中如何实现悬停动画在UIView上面布局我们可以使用UIButton UIView UIImageView等，但是是在3D场景中,我们不能使用UIView...243FA4BB-FAC5-4A93-A9DF-C3A1F447F010.png 提示几点头控根节点可以放在根节点上中心或者球体中心都是可以的,但是考虑到后期我们要进行视频滤波,所以最好放到场景节点上...低头菜单出现,抬头菜单消失,这个要根据重力感应在X轴旋转决定的当抬头时菜单总是出现在下方,一旦出现不会跟随照相机转动,当重力感应变化时,我们让头控节点的绕着y轴旋转实现步骤第一步.创建菜单节点...第二步添加到先把功能按钮节点添加到头控背景节点上,然后将背景节点添加到头控根节点上去 [self.scene.rootNode addChildNode:self.controlNode]; [self.controlNode...i]; [gif addObject:name]; } _gif = gif; } return _gif; } 第二步在执行的节点上执行动画行为

7631 0

iOS版使用ARKit和Swift创建交互式Domino游戏

在下面的教程中，我将向您展示如何使用Swift和ARKit制作有趣的Domino游戏。这就是我们要做的： ?...将手机移动一下，以便ARKit可以检测到地板并用手指在屏幕上绘制： ? 3.png 好吧，热门测试工作正常，但现在我们遇到了一个新问题：这么多的多米诺骨牌！...我们添加到场景中的地板是不透明的，因此应用到它上面的任何阴影都是不可见的。如何在保持隐形的同时为地板添加阴影？自iOS 11以来，SceneKit已经添加了一个新策略来实现这一目标。...我们创建一个50％不透明度的黑色，并将其设置为我们的shadowColor。这将使我们的阴影看起来更加灰色和逼真，而不是默认的深黑色。为了将光添加到场景中，它必须附加到节点。...这是一个非常长的教程，但我希望它能帮助您了解创建交互式ARKit应用程序所需的过程，更重要的是，我希望您能够创建它。如果您有任何问题或建议，请在下面的评论中写下。

2.3K3 0

Core Animation Programming

Core Animation 是一个复合引擎,它能快速的组合屏幕上不同显示的内容. 并将其分解成独立图层,存储到Layer Tree 的体系中....What's UIView在iOS开发中,这个使用频率非常高的控件,同时在iOS 所有原生的视图都是由UIView派生而来....UIView 与 CALayer 平行的层级关系每个UIView 都会有一个CALayer 实例图层属性.也就是backing layer.UIView 的职责就是创建并管理这个图层.用来确保当前子视图在层级关系中添加或者移除的时候...实际上,这背后的关联的图层才是真正用来在屏幕上显示和做动画的.UIView 就是对CALayer图层的封装,提供用户交互接口....为何开发者要使用CALayer 根据刚刚的描述,既然CALayer 只是UIView 的内部实现细节,那为何在要来使用或者学习它?

1.1K1 0

按钮与交互-使用按钮触发操作

在设置页面中，将显示名称更改为角度AR或所需名称。在资产目录中，将应用程序图标从assets文件夹拖放到选定的插槽中。主要故事板我们在屏幕上放置一些按钮。...使用模板，主故事板附带一个ARSCNView，我们无法在其上放置按钮。首先，删除ARSCNView并放置UIView。拥有UIView，允许我们放置这3个按钮并添加约束。...IBActions 类变量 2个第一个按钮的目的是能够调整我们的3D模型的大小。问题是iPhoneNode的声明是渲染器方法的局部变量。...diffuse.contents = UIImage(named: "art.scnassets/AR-Screen.png") } 结论在本节中，我们学习了如何在Storyboard中放置按钮并约束它们...到目前为止，您可以使用按钮执行许多令人惊叹的事情。原文: https://designcode.io/arkit-buttons

4.5K2 0

平面检测-搜索真实世界的表面

现在我们已经完成了正确运行ARKit项目的所有基本设置，我们希望我们的设备能够坐在水平表面上。这是飞机检测。在本节中，我们将学习如何激活平面检测。我们将熟悉锚点以及如何使用它们将对象放置在锚点上。...水平平面检测首先，我们需要打开配置的平面检测属性并将其设置为水平，以检测平面（如地板或桌子）。...，以允许视图在渲染场景时接收信息。...您现在正在学习如何在代码中应用它。飞机位置所以，就像我们为手表所做的步骤一样，我们需要定位它。将平面节点放在检测到的曲面的中心。...例如，您可以将物理应用于水平表面以使虚拟对象掉落，在其上驾驶汽车或在场景上为角色设置动画。与此同时，我希望您能够在场景编辑器中学到的概念代码中受到教育。

2.9K3 0

ARKit 进阶：材质

Scenekit lights and materials 光照与材质，是决定3D世界中的模型如何渲染的关键参数。许多时候模型的渲染对与不对，往往只是一种视觉的感受。...Materials 材质指定了引擎如何在渲染阶段对几何体的每个像素着色。...在使用CALayer作为内容时，如果是UIView.layer并且该UIView已经添加到其他层级中，那么内容会为空。...对于材质上的每一个点，SceneKit通过将transparency与transparent纹理映射点的透明信息相乘，获得最终的像素透明度。...transparency控制材质整体的透明度，类似的效果也可以通过控制SCNNode.opacity来获得。 blendMode blendMode指定了材质的像素点在渲染阶段是如何与背景混合的。

3.3K0 1

iOS 事件处理机制与图像渲染过程

两个线程同时设置同一个UIView的背景颜色，那么很有可能渲染显示的是颜色A，而此时在UIView逻辑树上的背景颜色属性为B。...CALayer类在概念上和UIView类似，同样也是一些被层级关系树管理的矩形块，同样也可以包含一些内容（像图片，文本或者背景色），管理子图层的位置。它们有一些方法和属性用来做动画和变换。...UIView 的 Layer 在系统内部，被维护着三份同样的树形数据结构，分别是：图层树（这里是代码可以操纵的，设置属性的最终值会立刻在这里更新）；呈现树（是一个中间层，系统就在这一层上更改属性，进行各种渲染操作...当一个触摸事件到来时，RunLoop 被唤醒，App 中的代码会执行一些操作，比如创建和调整视图层级、设置 UIView 的 frame、修改 CALayer 的透明度、为视图添加一个动画；这些操作最终都会被...Facebook Pop介绍在计算机的世界里面，其实并不存在绝对连续的动画，你所看到的屏幕上的动画本质上都是离散的，只是在一秒的时间里面离散的帧多到一定的数量人眼就觉得是连续的了，在iOS中，最大的帧率是

5.5K10 0

iOS ARKit教程：用裸露的手指在空中画画

ARKit教程插图：在iOS ARKit应用程序中与虚拟对象交互在这篇文章中，我们将使用iOS ARKit创建一个有趣的ARKit示例项目。用户将手指放在桌子上，好像他们握笔，点击缩略图并开始绘图。...它将来自设备相机的实时视频输入渲染为场景背景，同时它自动将SceneKit空间与现实世界相匹配，假设该设备是这个世界中移动的相机。...这可以在SCNView的渲染器委托功能中完成，每次要渲染3D引擎的新帧时都会调用它：此时，如果您运行应用程序，您应该会在相机流上看到焦点方块搜索水平平面。...iOS ARKit Vision库检测到的要素点我们将按照以下步骤初始化缩略图跟踪：上面最棘手的部分是如何将点击位置从UIView坐标空间转换为图像坐标空间。...随着计算机视觉的进步，以及为小工具（如深度相机）添加更多AR友好的硬件，我们可以访问我们周围越来越多的物体的3D结构。

2.2K3 0

ARKit 简介

增强现实（AugmentedReality，简称 AR），是一种实时地计算摄影机影像的位置及角度并加上相应图像的技术，这种技术的目标是在屏幕上把虚拟世界套在现实世界并进行互动。...第三层，渲染,支持各种渲染制作工具，目标就是简单易用，和其它插件融合度好。 ?...处理器A9及以上（6S机型及以上）实现步骤一个简单的AR场景实现所需要的技术和实现步骤如下： 1.多媒体捕捉现实图像：如摄像头 2.三维建模:3D立体模型 3.传感器追踪:主要追踪现实世界动态物体的六轴变化...这基本上也是学习AR最难的部分，好在ARKit帮助我们大大简化了这一过程。 4.除此之外，AR还可以与虚拟物体进行一些交互。 ?...// Set the scene to the view //设置ARKit的场景为SceneKit的当前场景（SCNScene是Scenekit中的场景，类似于UIView）

2.5K6 0

iOS内存优化

1、用ARC管理内存undefined 2、在正确的地方使用 reuseIdentifierundefined 3、尽量把views设置为透明undefined 4、避免过于庞大的XIBundefined...容易被忽略的内存优化如下： 1.View的渲染是很吃CPU性能和内存的，所以更多的View渲染是特别容易消化内存和cpu，特别是我们再使用UIScrollView时，多个Subview 时我们可以适当的...因为加载资源和计算高度多CPU的消耗也是比较高的undefined 4.UIView加载背景图....在View释放后，1中的color不会跟着释放，而是一直存在内存中；2中的color会跟着释放掉，当然再次生成color时就会再次申请内存.在UIView上再添加一个UIImageView显示图片作为UIView...undefined iOS视图都是一个图层，最先放置的图层就会在最底层，如此最先给UIView添加一个UIImageView就可以作UIView的背景图片使用啦。

9206 4

iOS 渲染原理解析

那么 CALayer 究竟是如何进行管理的呢？另外在 iOS 开发过程中，最大量使用的视图控件实际上是 UIView 而不是 CALayer，那么他们两者的关系到底如何呢？...根据 Apple 的官方文档，UIView 是 app 中的基本组成结构，定义了一些统一的规范。它会负责内容的渲染以及，处理交互事件。...部分效果的设置：因为 UIView 只对 CALayer 的部分功能进行了封装，而另一部分如圆角、阴影、边框等特效都需要通过调用 layer 属性来设置。... 等）都会产生类似的效果，因为组透明度、阴影都是和裁剪类似的，会作用与 layer 以及其所有 sublayer 上，这就导致必然会引起离屏渲染。...【mask】再增加一个和背景色相同的遮罩 mask 覆盖在最上层，盖住四个角，营造出圆角的形状。但这种方式难以解决背景色为图片或渐变色的情况。

2.1K5 0

【IOS开发基础系列】Table View开发专题

2.2 使用技巧 2.2.1 UITableViewCell去掉点击效果相当于Android中的ListView的selector设置成空/透明的： 1.XIB设置 .../fkuewfnh/article/details/36000129 2.4 性能优化 2.4.1 快速滑动性能优化方法 2.4.1.1 使用不透明视图不透明的视图可以极大地提高渲染的速度...因此如非必要，可以将tablecell及其子视图的opaque属性设为YES(默认值)。...其中的特例包括背景色，它的alpha值应该为1(例如不要使用clearColor)；图像的alpha值也应该为1，或者在画图时设为不透明。...这个例子中，layer并不会显著影响性能，但如果layer透明，或者有圆角、变形等效果，就会影响到绘制速度了。解决办法可参见后面的预渲染图像。 2.4.1.4 不要做多余的绘制工作。

3062 0

iOS开发CoreAnimation解读之二——对CALayer的分析

iOS开发CoreAnimation解读之二——对CALayer的分析一、UIView中的CALayer属性 1.Layer专门负责view的视图渲染每一个UIView的对象中都有一个...layer这样的属性，并且layer会负责view中有关图形绘制的相关操作，例如我们设置view的背景颜色和设置layer的背景颜色都是有效的，并且，设置view的背景色依然是通过layer来展示的，我们可以写如下的测试代码...UIView其中的layer默认是CALyer类，我们也可以通过重写View中的如下方法来使其创建我们需要的layer类： +(Class)layerClass{ } 例如我们自定义一个View类，在自定义一个...，它可以分为两个方面： 1.不改变内容的原始大小这种模式中不会改变内容的原始大小，如果层的尺寸小于内容的尺寸，则内容会被切割，如果层的尺寸大于内容的尺寸，多出的部分将会显示层的背景颜色。...，这个属性不一定总会返回一个实体对象，只有当进行动画或者其他渲染的操作时，这个属性会返回一个在当前屏幕上的layer，不且每一次执行，这个对象都会不同，它是原layer的一个副本presentationLayer

1K2 0

iOS14开发-入门知识

Core Services 包含了多种核心服务提供给 App 使用，如网络、线程、定位等。...开发中的其他 UIView（及其子类）都放在该view上。 UIViewController中UIView的生命周期函数 viewDidLoad：View 完成内存加载。...UIView常见属性 backgroudColor：背景色。 frame：相对父视图的坐标和大小。 bounds：相对自身的坐标和大小，所以 bounds 的 x 和 y 永远为0。...center：相对父视图的中心点坐标。 alpha：透明度（0.0 ~ 1.0）。...注意代码的书写位置，往往有人由于书写的位置不对导致代码报错。 @IBOutlet与@IBAction 引入如何在代码中获取 Storyboard 中的自定义 UIView？

2.8K4 0

CALayer 图层概念二、CALayer属性二、方法

UIView负责监听和相应事件.UIView是更高层的封装在 iOS 中,你能看得见,摸得着的东西基本上都是UIView.比如一个按钮,一个文本标签,一个文本输入框, 一个图标等.这些都是UIView...,其实UIView之所以能显示在屏幕上,完全是因为它内部的一个图层,在创建UIView对象时, UIView内部会自动创建一个图层 (即CALayer对象), 通过UIView的layer属性即可访问这个图层....当UIView需要显示到屏幕上时,会调用drawRect:方法进行绘图,并且会将所有内容绘制在自己的图层上,绘图完毕后,系统会将图层拷贝到屏幕上,于是就完成了UIView得显示.换句话说,UIView...如 : bounds : 用于设置CALayer的宽度和高度,修改这个属性会产生缩放动画. background : 用户设置CALayer的背景色, 修改这个属性会产生背景色的渐变动画. position...--- 二、方法 1、创建自定义图层对象 + (instancetype)layer; 2、添加子图层 - (void)addSublayer:(CALayer *)layer; 3、将layer上的所有内容渲染到图形上下文中

1.4K7 0

OpenGL ES 2.0之初体验

在OpenGL ES开发中，我们主要使用的就是OpenGLES.framework。...不过这一次，我们要用到的只有CAEAGLLayer。加入到工程中： ?...类似于drawRect: 方法里的CGContextRef。 (3)设置layer 复写UIView的layerClass方法，改变UIView自带layer为CAEAGLLayer。...这样当我们调用self.layer时返回的就会是一个CAEAGLLayer对象，我们才能在其上描绘OpenGL内容。...，必须将它设为不透明才能让其可见 _eaglLayer.opaque = YES; // 设置描绘属性，在这里设置不维持渲染内容以及颜色格式为 RGBA8 _eaglLayer.drawableProperties

1.8K9 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

ARKit：增强现实技术在美团到餐业务的实践

ARKit示例 - 第2部分：平面检测+可视化

图像检测-如何通过扫描图像来制造幻觉

建立您的第一个AR体验

VR+全景播放器+头控讲解-06

iOS版使用ARKit和Swift创建交互式Domino游戏

Core Animation Programming

按钮与交互-使用按钮触发操作

平面检测-搜索真实世界的表面

ARKit 进阶：材质

iOS 事件处理机制与图像渲染过程

iOS ARKit教程：用裸露的手指在空中画画

ARKit 简介

iOS内存优化

iOS 渲染原理解析

【IOS开发基础系列】Table View开发专题

iOS开发CoreAnimation解读之二——对CALayer的分析

iOS14开发-入门知识

CALayer 图层概念二、CALayer属性二、方法

OpenGL ES 2.0之初体验

扫码

相关资讯

热门标签

活动推荐

运营活动

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐