避免 UIImage 填充颜色渗入 UIImageView

Question

我想将包含透明部分的 UIImage 填充到 UIImageView 中（即填充到 UIImageView space 中，因为图像具有“Scale Aspect Fit”设置)

如何做到？

我尝试绘制 masks/contexts，将 masksToBounds/clipsToBounds/isOpaque 设置为 true/false，但它会流血（或者整个东西变成一个纯色框）。

我想要的（注意内部是白色的，但图像周围是透明的，因此是主要颜色。此屏幕截图来自 iOS 15 设置应用程序）：

我目前拥有的（图像填充颜色在图像外渗出。这是我的应用程序）：

Notes:

I am using SF Symbols for the images

The images have a transparent section inside, which is what I want to fill with a color other than the main background color of the UIImageView (while I want the UIImageView background to be transparent)

使用顺丰符号：

                     checkmark.square.fill
                     divide.square.fill"
                     arrow.up.and.down.square.fill
                     questionmark.square.fill
                     arrow.right.square.fill
                     arrow.left.square.fill

Answer 1

SF 符号将内部的透明封闭形状识别为可以填充颜色的单独形状。

正在寻找的是填充复选标记形状的渲染模式（例如）。 SF符号默认使用单色渲染模式，您可以使用调色板渲染或多色渲染（SF符号2.0部分支持，3.0完全支持）

4 rendering modes 分别为单色、分层、调色板和多色。

警告：一些 SF 符号受版权保护，不能使用，Apple 也警告不要让 SF 符号看起来像系统图标。

您可以使用 SF symbols 应用程序查看版权、渲染模式和颜色符号，您可以从这里下载 https://developer.apple.com/sf-symbols/

编辑：

对于您的具体情况，并且因为您要使用的所有符号都有一个圆角矩形，您可以在 UIImage 后面添加一个白色圆角矩形图像（比原始符号略小）。

Answer 2

我最后做的是为每个图标添加一个容器视图，将图标放在容器中，给容器一个cornerRadius，从图标到容器的约束，从背景颜色到图标，以及白色背景颜色到容器。这是一些信息：

    // MARK: Properties

    let myDataSource = [Const.Title.check,
                        Const.Title.factorize,
                        Const.Title.list,
                        Const.Title.random,
                        Const.Title.next,
                        Const.Title.previous]
    let myImageSource = ["checkmark",
                         "divide",
                         "arrow.up.and.down",
                         "wand.and.stars",
                         "arrow.right",
                         "arrow.left"]
    let tintColorsArray: [UIColor] = [
        .systemGreen,
        .systemBlue,
        .systemPurple,
        .systemOrange,
        .systemTeal,
        .systemTeal
    ]


    // MARK: Table

    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

        let cell = tableView.dequeueReusableCell(withIdentifier: menuCell) as! MainMenuTableViewCell
        cell.myLabel.text = myDataSource[(indexPath as NSIndexPath).row]
        let aConfig = UIImage.SymbolConfiguration(weight: .bold)
        let aImage = UIImage(systemName: myImageSource[(indexPath as NSIndexPath).row], withConfiguration: aConfig)
        cell.newImageView.image = aImage
        cell.newImageView.tintColor = .white
        cell.imageViewContainer.backgroundColor = tintColorsArray[(indexPath as NSIndexPath).row]
        cell.imageViewContainer.layer.cornerRadius = 6
        cell.accessoryType = .disclosureIndicator

        return cell
    }

避免 UIImage 填充颜色渗入 UIImageView

Avoid UIImage fill color from bleeding into UIImageView

uiimageview

uicolor

sf-symbols

ios15

xcode13