How Capacitor Handles Platform Differences

Capacitor 帮助开发者使用相同的代码库为iOS和Android开发应用程序，解决平台特有的差异。它简化了原生功能的集成，确保了遵守平台指南，优化了性能。主要亮点：

• 平台检测: 使用 Capacitor.getPlatform() 来应用特定于平台的code。
• 内置插件: 为像摄像头、存储和地理位置等功能提供统一的API。
• 自定义插件: 为独特需求添加本机code。
• UI调整: 遵循iOS（例如， SF符号，圆角按钮）和Android（例如， Material图标，左对齐按钮)。
• 配置: 在两种平台上调整设置。 capacitor.config.json 实时更新
• : 使用 Capgo，即刻部署更新，无需等待应用商店审核，实现 95% 的用户采用率在 24 小时内。

快速比较

Capacitor

跨平台开发：探索CapacitorJS…

如何 Capacitor Code

Capacitor offers tools to manage platform-specific code, allowing developers to create tailored experiences for iOS and Android using a single API.

Code提供了管理平台特定__CAPGO_KEEP_1__的工具，使开发者能够使用单一__CAPGO_KEEP_2__为iOS和Android创建定制化的体验。

With Capacitor’s built-in platform API, detecting the current platform is simple. The Capacitor.getPlatform() __CAPGO_KEEP_0__

import { Capacitor } from '@capacitor/core';

const platform = Capacitor.getPlatform();
if (platform === 'ios') {
  // Code specific to iOS
} else if (platform === 'android') {
  // Code specific to Android
}

__CAPGO_KEEP_0__ 生物识别认证, iOS可能使用 Face ID and Android relies on Fingerprint Authentication. Along with platform detection, Capacitor’s built-in plugins simplify native integration.

内置平台功能

Capacitor comes with a set of core plugins that handle platform-specific differences seamlessly. These plugins manage the complexities of native implementations while providing a consistent JavaScript interface:

每个插件都自动使用平台的本机API，确保平滑的性能和功能。

构建自定义平台插件

当内置插件无法满足您的需求时，您可以创建自定义插件来访问特定的本机API。以下是如何做到的:

1. 定义插件

   @Plugin({
     name: 'CustomFeature',
     platforms: ['ios', 'android']
   })

2. 添加本机Code

   @PluginMethod()
   async customFunction(): Promise<void> {
     if (Capacitor.getPlatform() === 'ios') {
       // Add iOS-specific code
     } else {
       // Add Android-specific code
     }
   }

3. 实现平台处理器

   • iOS (Swift):

     @objc func customFunction(_ call: CAPPluginCall) {
       // Add native iOS functionality
     }

   • Android (Kotlin):

     @PluginMethod
     fun customFunction(call: PluginCall) {
       // Add native Android functionality
     }

自定义插件允许访问本机功能，同时保持API一致且易于使用。这确保了性能和功能性，而不会复杂化开发过程。

平台特定UI指南

iOS与Android设计规则

在设计iOS和Android时，遵循本机设计模式非常重要。每个平台的用户对导航、字体、按钮、标题和图标等方面的期望都不同。以下是它们的比较:

跨平台设计标准

虽然每个平台都有自己的规则，但在两者之间保持一致的品牌身份至关重要。以下是如何确保一致性的方法:

const sharedStyles = {
  primaryColor: '#007AFF', // iOS blue
  androidPrimaryColor: '#6200EE', // Material Design purple
  borderRadius: Capacitor.getPlatform() === 'ios' ? '10px' : '4px'
};

:root {
  --app-header-height: var(--platform-header-height, 56px);
  --app-safe-area-top: var(--platform-safe-area-top, 0px);
}

使用Capacitor，您可以将平台特定的UI组件集成到应用程序中，同时保持功能的一致性。它还可以帮助管理系统级设置，如暗色模式和动态类型。要完成此过程，请确保您的平台特定构建设置与这些指南相一致。

平台设置和配置

管理好平台code后，正确的配置至关重要，以确保应用程序在iOS和Android上运行得平滑。

在文件中定义关键平台特定设置: capacitor.config.json

以下是需要考虑的配置选项: capacitor.config.json 选项

{
  "appId": "com.example.app",
  "appName": "MyApp",
  "ios": {
    "contentInset": "always",
    "backgroundColor": "#ffffff",
    "scheme": "myapp",
    "preferredContentMode": "mobile"
  },
  "android": {
    "backgroundColor": "#FFFFFF",
    "allowMixedContent": true,
    "captureInput": true,
    "webContentsDebuggingEnabled": true
  }
}

iOS

一旦运行时设置就位，调整您的构建设置以为每个平台提高性能。

平台特定构建设置

精细调整构建设置以优化您的应用程序以适应iOS和Android。

对于iOS，更新 Info.plist 文件：

<key>NSCameraUsageDescription</key>
<string>Required for document scanning</string>
<key>NSLocationWhenInUseUsageDescription</key>
<string>Required for store locator</string>

对于Android，修改 android/app/build.gradle:

android {
    defaultConfig {
        minSdkVersion 21
        targetSdkVersion 33
        versionCode 1
        versionName "1.0"
    }
    buildTypes {
        release {
            minifyEnabled true
            proguardFiles getDefaultProguardFile('proguard-android.txt')
        }
    }
}

以下是某些关键构建考虑因素:

文件 Capgo

__CAPGO_KEEP_0__实时更新控制台界面 Capacitor apps Capgo应用程序

更新iOS和Android应用程序的效率至关重要。Capgo提供了一个实时更新系统，它与两种平台的指南保持一致。

Capgo has delivered 23.5 million updates, achieving a 95% active user update rate within 24 hours [1]这些功能使得 更新管理 更流畅，更高效

Capgo Platform Management

Capgo’s channel system makes updates easier to manage. Developers can test iOS-specific features with beta users, roll out Android updates in stages, and track performance metrics seamlessly.

该平台遵循苹果和谷歌的即时更新要求 [1].

Currently, 750 production apps rely on Capgo, maintaining an 82% global update success rate [1]。其 CI/CD 集成简化了部署，回滚功能允许开发者在出现问题时立即回滚到之前的版本。实时分析提供了更新性能的见解，并有助于保持应用程序的稳定性

结论

平台管理优势

有效地管理Capacitor中的平台差异可以增强跨平台开发。其内置的平台检测和配置工具允许开发者为iOS和Android创建smooth的体验，同时尊重每个平台独特的设计标准和功能。

通过专注于合适的平台管理，开发团队可以更快地发布更新并提高用户满意度。工具如Capgo已经展示了如何通过一致的平台处理来实现更高的更新成功率和更好的用户体验 [1].

“我们实行敏捷开发，@Capgo在为用户持续交付方面是 mission-critical 的！”
– Rodrigo Mantica [1]

这些见解可以指导您在实践中进行改进。

下一步

为了最大限度地实现这些优势，请考虑实施以下策略:

对于希望提高工作流程效率的开发者来说，工具如Capgo可以简化过程。具有端到端加密和CI/CD集成的功能有助于团队保持一致性，同时高效地部署更新。

成功的平台管理取决于使用合适的工具并遵循平台特定的指南。通过关注强大的检测和管理策略，开发者可以确保应用程序在iOS和Android上都能顺畅运行。

Keep going from How Capacitor Handles Platform Differences

如果您正在使用 How Capacitor Handles Platform Differences 为了规划原生媒体和界面行为，连接它 使用@capgo/capacitor-live-activities 原生能力在使用@capgo/capacitor-live-activities @capgo/capacitor-live-activities 在@capgo/capacitor-live-activities中实现细节 使用@capgo/capacitor-video-player 原生能力在使用@capgo/capacitor-video-player @capgo/capacitor-video-player 在@capgo/capacitor-video-player中实现细节， 使用@capgo/capacitor-native-navigation 原生能力在使用@capgo/capacitor-native-navigation