Question

我正在开发一款应用程序，允许用户通过从提供的图像列表中选择各种身体/头发/衣服/眼睛/等样式来创建自己的2D头像（类似于Bitmoji）。到目前为止，我通过将几个UIImageViews层叠在一起来实现这一点，每个UIImageViews代表一个可定制的元素。用户可以通过首先从两个集合视图中选择元素类型，然后选择元素图像来选择要为每个UIImageView分配的图像。例如，如果用户在一个集合视图中单击头发类型类别，则可以从另一个集合视图中的数字列表中选择以更改hairTypeImageView的照片。

我认为这种方法的问题很明显：它需要大量的UIImageViews，这似乎会减慢应用程序的速度。此外，除此之外，我们还要求用户能够更改每个元素的基色，而无需更改其阴影或边框。到目前为止，我能够做到这一点的唯一方法是让应用程序为每个元素存储两个图像，一个用于底层填充颜色，另一个用于顶层阴影和边框，然后使用

        var list = Enumerable.Range(1, 10).ToList();
        //Start with reversing the order.
        var result = list.OrderByDescending(x => x)
            //Run a select overload with index so we can use position
            .Select((number, index) => new { number, index })
            //Only include items that are in the right intervals OR is the last item
            .Where(x => ((x.index + 1) % 3 == 0) || x.index == list.Count() - 1)
            //Select only the number to get rid of the index.
            .Select(x => x.number)
            .ToList();

        Assert.AreEqual(8, result[0]);
        Assert.AreEqual(5, result[1]);
        Assert.AreEqual(2, result[2]);
        Assert.AreEqual(1, result[3]);

更改填充颜色。这个解决方案有效，但它使应用程序的效率更低，因为它意味着我现在必须有两倍的UIImageViews（每个可自定义元素两个），而且我必须创建双重艺术作品，应用程序必须存储双倍的图像。

有没有更好的方法可以解决这个问题？

Answer 1

我将看看制作一个UIImageView子类，它覆盖 drawRect：调用以绘制头像的各个层。这将允许有一个能够绘制整个头像的UIImageView实例。

第二个选项是使用Core Graphics渲染你的头像。如果您需要更好地控制输出，这是一个不错的选择，因为Core Graphics框架提供了丰富的渲染工具和功能。

对我而言，决定可能取决于您需要做多少图像处理。如果只是将各种图像“堆叠”在一起并改变一些颜色，我可能会选择UIImageView子类。

对于其中任何一种方法，请查看https://developer.apple.com/library/content/documentation/2DDrawing/Conceptual/DrawingPrintingiOS/HandlingImages/Images.html

iOS - 如何为头像创建分层图像

1 个答案: