将图像转换为 SceneKit 节点

Convert an image to a SceneKit Node

我有一张位图图像:

(但是这应该适用于任意图像)

我想拍摄我的图像并将其制作成 3D SCNNode。我已经用这段代码完成了那么多。这会获取图像中的每个像素并创建一个具有 SCNBox 几何形状的 SCNNode。

static inline SCNNode* NodeFromSprite(const UIImage* image) {
  SCNNode *node = [SCNNode node];
  CFDataRef pixelData = CGDataProviderCopyData(CGImageGetDataProvider(image.CGImage));
  const UInt8* data = CFDataGetBytePtr(pixelData);
  for (int x = 0; x < image.size.width; x++)
  {
    for (int y = 0; y < image.size.height; y++)
    {
      int pixelInfo = ((image.size.width * y) + x) * 4;
      UInt8 alpha = data[pixelInfo + 3];
      if (alpha > 3)
      {
        UInt8 red   = data[pixelInfo];
        UInt8 green = data[pixelInfo + 1];
        UInt8 blue  = data[pixelInfo + 2];
        UIColor *color = [UIColor colorWithRed:red/255.0f green:green/255.0f blue:blue/255.0f alpha:alpha/255.0f];
        SCNNode *pixel = [SCNNode node];
        pixel.geometry = [SCNBox boxWithWidth:1.001 height:1.001 length:1.001 chamferRadius:0];
        pixel.geometry.firstMaterial.diffuse.contents = color;
        pixel.position = SCNVector3Make(x - image.size.width / 2.0,
                                        y - image.size.height / 2.0,
                                        0);
        [node addChildNode:pixel];
      }
    }
  }
  CFRelease(pixelData);
  node = [node flattenedClone];
  //The image is upside down and I have no idea why.
  node.rotation = SCNVector4Make(1, 0, 0, M_PI);
  return node;
}

但问题是我正在做的事情占用了太多内存!

我正在尝试找到一种使用更少内存的方法。

所有代码和资源都可以在以下位置找到: https://github.com/KonradWright/KNodeFromSprite

现在你把每个像素画成某种颜色的SCNBox,也就是说:

  • 每箱一次 GL 抽奖
  • 在相邻框之间绘制不必要的两个不可见面
  • 在可以绘制一个1x1xN的盒子的情况下,连续绘制N个相同的1x1x1的盒子

似乎是常见的类似 Minecraft 的优化问题:

  1. 把你的图像当做3维数组(这里的depth就是想要的图像挤压深度),每个元素代表某种颜色的立方体素。
  2. 使用greedy meshing algorithm (demo) and custom SCNGeometry为SceneKit节点创建网格。

跳过相邻立方体面的网格划分算法的伪代码(更简单,但不如贪婪网格划分有效):

#define SIZE_X = 16; // image width
#define SIZE_Y = 16; // image height

// pixel data, 0 = transparent pixel
int data[SIZE_X][SIZE_Y];

// check if there is non-transparent neighbour at x, y
BOOL has_neighbour(x, y) {
    if (x < 0 || x >= SIZE_X || y < 0 || y >= SIZE_Y || data[x][y] == 0)
        return NO; // out of dimensions or transparent
    else
        return YES; 
}

void add_face(x, y orientation, color) {
    // add face at (x, y) with specified color and orientation = TOP, BOTTOM, LEFT, RIGHT, FRONT, BACK
    // can be (easier and slower) implemented with SCNPlane's: https://developer.apple.com/library/mac/documentation/SceneKit/Reference/SCNPlane_Class/index.html#//apple_ref/doc/uid/TP40012010-CLSCHSCNPlane-SW8
    // or (harder and faster) using Custom Geometry: https://github.com/d-ronnqvist/blogpost-codesample-CustomGeometry/blob/master/CustomGeometry/CustomGeometryView.m#L84 
}

for (x = 0; x < SIZE_X; x++) {
    for (y = 0; y < SIZE_Y; y++) {

        int color = data[x][y];
        // skip current pixel is transparent
        if (color == 0)
            continue;

        // check neighbour at top
        if (! has_neighbour(x, y + 1))
            add_face(x,y, TOP, );

        // check neighbour at bottom
        if (! has_neighbour(x, y - 1))
            add_face(x,y, BOTTOM);

        // check neighbour at bottom
        if (! has_neighbour(x - 1, y))
            add_face(x,y, LEFT);

        // check neighbour at bottom
        if (! has_neighbour(x, y - 1))
            add_face(x,y, RIGHT);

        // since array is 2D, front and back faces is always visible for non-transparent pixels
        add_face(x,y, FRONT);
        add_face(x,y, BACK);

    }
}

很大程度上取决于输入图像。如果它不大并且没有多种颜色,我会选择 SCNNode 为可见面添加 SCNPlane,然后 flattenedClone() 结果。

一种类似于 Ef Dot 提出的方法:

  1. 为了尽可能减少绘图调用的数量,您需要尽可能减少 material 的数量。在这里,每种颜色需要一个 SCNMaterial
  2. 为了尽可能减少绘制调用的数量,请确保没有两个几何元素 (SCNGeometryElement) 使用相同的 material。换句话说,每个 material(颜色)使用一个几何元素。

因此您必须构建一个 SCNGeometry,其中包含 N 几何元素和 N materials,其中 N 是不同颜色的数量在你的形象中。

  1. 对于图像中的每种颜色,从该颜色的所有像素构建一个多边形(或一组不相交的多边形)
  2. 对每个多边形(或多边形组)进行三角剖分并使用该三角剖分构建几何元素。
  3. 从几何元素构建几何。

如果您对自己对多边形进行三角测量感到不自在,可以利用 SCNShape

  1. 为每个多边形(或多边形组)创建一个 UIBezierPath 并用它构建一个 SCNShape
  2. 将形状的所有几何源合并到一个源中,并重复使用几何元素来创建自定义 SCNGeometry

请注意,如果您使用 SCNShape 的集合来构建几何体,某些顶点将被复制。只需很少的努力,您就可以确保最终源中没有两个顶点具有相同的位置。相应地更新几何元素中的索引。

我还可以指导您访问 Nick Lockwood 的这个出色的 GitHub 回购协议:

https://github.com/nicklockwood/FPSControls

它将向您展示如何将网格生成为平面(而不是立方体),这是使用 "neighboring" 检查快速实现简单场景所需的方法。

如果你需要大型复杂场景,那么我建议你使用贪心网格算法使用 Ef Dot 提出的解决方案。