Faith & Code | Reflections by Errong

React Native iOS 修复：MaterialIcons 显示 “？”（字体未加载问题完整解决方案） 如果你的 React Native 应用在 iOS 上显示 ? 而不是 MaterialIcons 图标，通常是因为 iOS 没有正确加载图标字体导致的。 本文将讲解： 问题出现的原因 完整修复方法 常见坑：Multiple commands produce MaterialIcons.ttf 问题现象 你可能在代码中使用： import MaterialIcons from '@react-native-vector-icons/material-icons'; 并这样渲染图标： <MaterialIcons name="dashboard" size={24} color="#2563eb" /> 但在 iOS 上出现： 显示 ? 图标为空白 图标无法显示 根本原因 问题的核心是 MaterialIcons.ttf 没有被正确加载到 iOS App Bundle 中。 在 iOS 中，字体必须满足： 被加入 App 资源文件 在 Info.plist 中注册 如果缺少任何一步，iOS 就无法渲染字体图标，只会显示 ? 。 解决方案（推荐做法） 第一步：在 Info.plist 注册字体 打开文件： ios/<YourAppName>/Info.plist 添加以下内容： <key>UIAppFonts</key> <array> <string>MaterialIcons.ttf</string> </array> 如果已经存在 UIAppFonts ，只需追加： <string>MaterialIcons.ttf</string> 第二步：清理并重新构建 iOS 项目 修改 Info.plist 后必须重新编译 App。 方法一：Xcode Product → Clean Build F...

解决 React Native iOS 缺少 iPad 图标错误（152x152 / 167x167） 在提交 React Native iOS 应用到 App Store 时，如果你遇到类似错误： Missing required icon file. The bundle does not contain an app icon for iPad of exactly '152x152' pixels The bundle does not contain an app icon for iPad Pro of exactly '167x167' pixels 这个问题看起来很奇怪，因为你的 Xcode 项目中已经显示支持 iPad。 🔍 现象 你可能已经看到： Deployment Info 中有 iPad 配置 iPad Orientation 已启用 但是打开 Assets.xcassets → AppIcon 时： ❌ 没有 iPad 图标槽位 最终导致 App Store 校验失败。 🧠 根本原因 这是因为配置不一致导致的： 项目设置支持 iPad ✅ AppIcon 资源仍然是 iPhone-only ❌ 在很多 React Native 项目中，默认生成的 AppIcon 并不包含 iPad 图标槽位。 ✅ 解决方案（最简单有效） 重新创建 AppIcon： 打开 Assets.xcassets 删除当前的 AppIcon 右键 → New App Icon 命名为 AppIcon 新的 AppIcon 会自动包含： iPad 图标（152x152） iPad Pro 图标（167x167） 🖼️ 必须提供的图标 你至少需要提供： 152 × 152（iPad） 167 × 167（iPad Pro） 将对应 PNG 图片拖入即可。 ⚠️ 重要检查 确保项目确实支持 iPad： Build Settings → Targeted Device Family = 1,2 含义： 1 = iPhone 2 ...

Fix Missing iPad App Icon in React Native iOS (Xcode Validation Error) If you're submitting a React Native iOS app and encounter errors like: Missing required icon file. The bundle does not contain an app icon for iPad of exactly '152x152' pixels The bundle does not contain an app icon for iPad Pro of exactly '167x167' pixels This issue can be confusing — especially when your project already shows iPad support in Xcode. 🔍 The Confusing Part In Xcode, you may already see: iPad orientation settings enabled Deployment Info showing iPhone + iPad However, when opening Assets.xcassets → AppIcon , there are no iPad icon slots . This leads to App Store validation failure. 🧠 Root Cause This is caused by a mismatch between: Xcode project settings (which support iPad) Asset catalog configuration (which may still be iPhone-only) In many React Native projects, the default AppIcon set is created without iPad slots, even when the app later ...

解决 Xcode 报错：Sandbox rsync “Operation not permitted”（React Native / CocoaPods） 在使用 React Native 开发 iOS 应用时，如果你在 Xcode 中遇到类似如下错误： Sandbox: rsync deny(1) file-read-data Operation not permitted PhaseScriptExecution [CP] Embed Pods Frameworks 那么你踩到了 Xcode 15+ 中一个非常常见的坑。 🔍 问题原因 Xcode 15 引入了更严格的安全机制 —— User Script Sandboxing（用户脚本沙箱） 。 这个机制会限制构建过程中脚本的文件访问权限，而 CocoaPods 在编译时会执行一个脚本（Embed Pods Frameworks），使用 rsync 来复制 framework： ❌ 无法读取 framework 文件（如 React.framework） ❌ 无法写入 app bundle 最终导致 Operation not permitted 错误。 ✅ 解决方案（最有效） 关闭 Xcode 的 User Script Sandboxing ： 打开 Xcode 选择你的 Project（不是 Target） 进入 Build Settings 搜索： User Script Sandboxing 将其设置为： NO 然后执行清理并重新编译： Shift + Command + K 通常问题会立刻解决。 💡 原理说明 关闭脚本沙箱后，CocoaPods 的构建脚本将可以正常执行： 读取 framework 文件 复制到应用目录 保留签名信息（CodeSignature） ⚠️ 如果仍然报错（补充方案） 可以尝试以下操作： 给 Xcode 添加 Full Disk Access（完整磁盘权限） 删除 DerivedData 目录 重新执行 pod install 🚀 总结 这个问题并不是你的项目配置错误，而是： Xcode ...

Fix Xcode Sandbox rsync “Operation not permitted” Error (React Native / CocoaPods) If you are building a React Native iOS app and suddenly see errors like: Sandbox: rsync deny(1) file-read-data Operation not permitted PhaseScriptExecution [CP] Embed Pods Frameworks You are not alone. This issue is very common in Xcode 15+ due to stricter sandboxing rules. 🔍 Root Cause Xcode introduced User Script Sandboxing , which restricts scripts (like CocoaPods' framework embedding step) from accessing certain files. During build, rsync is used to copy frameworks (e.g. React.framework), but the sandbox blocks it: ❌ Cannot read framework files ❌ Cannot write into app bundle This results in the infamous Operation not permitted error. ✅ Solution (Works Instantly) Disable User Script Sandboxing in Xcode: Open your project in Xcode Select the project (not target) Go to Build Settings Search for: User Script Sandboxing Set it to: NO Then clean and r...

我们如何为 macOS 应用添加国际化和多语言支持 支持多语言对于拓展全球用户至关重要。本文将以我们的 macOS 应用 iTrans 为例，介绍我们如何通过 Swift 和 Xcode 实现国际化（i18n）和中文本地化。 1. 审查所有用户可见文本 第一步是查找代码中所有用户可见的字符串。我们在 SwiftUI 视图、模型和操作符中搜索所有硬编码文本。 2. 提取待本地化字符串 我们将所有硬编码字符串替换为支持本地化的 API： 在 SwiftUI 中， Text 视图使用 LocalizedStringKey 。 其他字符串使用 NSLocalizedString 。 Text(LocalizedStringKey("Unlock your iPhone")) // 或 NSLocalizedString("Untitled", comment: "File with no name") 3. 创建本地化文件 我们为每种支持的语言创建了 Localizable.strings 文件： en.lproj/Localizable.strings —— 英文 zh-Hans.lproj/Localizable.strings —— 简体中文 每个文件都包含所有用户可见文本的键值对。 英文示例： "Unlock your iPhone" = "Unlock your iPhone"; 中文示例： "Unlock your iPhone" = "解锁你的 iPhone"; 4. 将本地化文件添加到 Xcode 工程 为了让 Xcode 识别本地化文件： 我们通过项目导航器将 Localizable.strings 文件添加到工程。 在文件检查器中，启用本地化并勾选所有支持的语言。 5. 测试本地化效果 Xcode 让我们可以轻松测试不同语言下的应用效果： 在 Scheme 编辑器中，将应用语言设置为“简体中文”并运行应用。 我们还验证了所有界面文本在英文和中文下都能正确显示。 6. ...

How We Added Internationalization and Multi-Language Support to Our macOS App   Supporting multiple languages is essential for reaching a global audience. In this post, we’ll walk through how we added internationalization (i18n) and Chinese localization to our macOS app, iTrans , using Swift and Xcode. 1. Audit All User-Facing Text The first step was to identify all user-facing strings in our codebase. We searched through our SwiftUI views, models, and operators for any hardcoded text that would be visible to users. 2. Extract Strings for Localization We replaced all hardcoded strings with localization-friendly APIs: For SwiftUI, we used LocalizedStringKey in Text views. For other strings, we used NSLocalizedString . Text(LocalizedStringKey("Unlock your iPhone")) // or NSLocalizedString("Untitled", comment: "File with no name") 3. Create Localization Files We created Localizable.strings files for each supported language: en.l...

How I Set Up My Local Environment to Run a React Native iOS App Setting up a React Native project for iOS locally sounds simple—until you hit the usual roadblocks: Ruby versions, CocoaPods issues, Xcode configuration, and mysterious build failures. Here’s a clean, real-world setup that actually works. 🍎 Step 0 — Prepare Xcode (Critical but Easy to Miss) Even if you already installed Xcode from the App Store, your system may not be fully configured for command-line builds. I ran into issues until I completed these steps: 1. Select the Correct Xcode Path sudo xcode-select -s /Applications/Xcode.app/Contents/Developer xcode-select -p Expected output: /Applications/Xcode.app/Contents/Developer 2. Accept the Xcode License sudo xcodebuild -license Then: Press space to scroll through the license Type agree at the end Without this, builds may fail silently or with confusing errors. 3. Install Command Line Tools (if not already) xcode-select --install React Native i...