如何在SwiftUI列表滑动操作中修改SF Symbol的字重？

开发者阿泽

2026-6-20

SwiftUI List滑动操作中SF Symbol粗体渲染问题解决

问题说明

在SwiftUI的List滑动操作（swipeActions）内，无法通过常规方式将SF Symbol的对勾图标设置为粗体——iOS会强制覆盖fontWeight(.bold)等样式设置，图标始终以常规字重显示，甚至自动切换为填充变体。

常规设置SF Symbol粗体的代码在普通场景有效，但在滑动操作中失效：

// 普通场景有效
Image(systemName: "checkmark").fontWeight(.bold)

// 滑动操作中失效
List {
  ForEach(events) { event in
    Text(event)
      .swipeActions(edge: .leading) {
        Button(action: {}) {
          Image(systemName: "checkmark")
            .fontWeight(.bold) // 此设置被系统忽略
        }
      }
  }
}

尝试过的其他无效写法：

Image(systemName: "checkmark").font(.title.weight(.bold))
将图标嵌入Text并设置粗重
直接给嵌套图标的Text设置fontWeight

简洁解决方案

通过UIImage预先生成带粗体配置的SF Symbol，再转换为SwiftUI的Image，绕过系统对滑动操作图标的样式强制覆盖，同时完美适配动态类型：

步骤1：扩展Image实现粗体系统图标

import SwiftUI

extension Image {
    static func boldSystemImage(_ name: String) -> Image {
        let symbolConfig = UIImage.SymbolConfiguration(weight: .bold)
        guard let uiImage = UIImage(systemName: name, withConfiguration: symbolConfig) else {
            return Image(systemName: name) // 加载失败时返回常规图标
        }
        return Image(uiImage: uiImage)
    }
}

步骤2：在滑动操作中调用

List {
  ForEach(events) { event in
    Text(event)
      .swipeActions(edge: .leading) {
        Button(action: {}) {
          Image.boldSystemImage("checkmark") // 直接使用粗体图标
        }
      }
  }
}

该方案的优势：