Add UIView (from xib) with transparency to SceneKit

Question

I'm trying to load a UIView into SceneKit with a translucent background, but currently, it just fades to white as I decrease the opacity. I have a very simple UIView layout in a .xib file that I want to load into SceneKit. So far I can display the UIView in the SCNMaterial, change any text fields, images, etc inside the view without a problem. However, I cannot let it have transparency. If I change the alpha of the view it just fades to white.

most of the code is the below:

if let cardView = Bundle.main.loadNibNamed("OverlayCard", owner: self, options: nil)?.first as? OverlayCard {
  cardView.backgroundColor = UIColor(displayP3Red: 1.0, green: 0.4, blue: 0.9, alpha: 0.2)
  let newplane = SCNPlane()
  let newMaterial = SCNMaterial()
  cardView.alpha = 0.2
  cardView.isOpaque = false
  newMaterial.diffuse.contents = cardView
  newMaterial.blendMode = .add
  newplane.materials = [newMaterial]
  let viewNode = SCNNode(geometry: newplane)
  self.addChildNode(viewNode)
}

I've left in various things like assigning the blendMode, backgroundColor with 0.2 opacity as well as the entire view because these are all things I've tried but still get a white background with some of the view's elements on top of the white very faded out. Have also tried blendMode = .alpha to find no difference. 'self' here is a subclass of SCNNode.

Does anyone know how I can make this view's background fade to transparent, rather than fade to white? Or, another way to load a view into SceneKit.

The diffuse property only defines the color of the material, not the transparency. What happens if you set cardView as the transparent content of the material? — EmilioPelaez
Doing that just gives me back a white square where the view should be — maxxfrazer
I've tried to accomplish the same thing with mixed results. Setting both the diffuse and transparent colors seems like it should work, but it doesn't. However, setting the diffuse to the view and the transparent to an image generated from the view seems to work, though it may not be performant/scale well — Dfowj
@maxxfrazer I have the same problem, did you solve it or did you apply any workaround it would help me a lot, thanks — user1241006

matejmolnar matejmolnar · Accepted Answer · 2018-07-31T07:01:29

Try setting the layer of the view as diffuse.contents instead of the view itself.

newMaterial.diffuse.contents = cardView.layer

Add UIView (from xib) with transparency to SceneKit

1 Answers