---
title: Cordova結合原生開發的應用程式
tags: cordova, native
description: Cordova結合原生開發的應用程式
Author: [e-mail]
---
## 需求: Cordova結合原生開發的應用程式
- 使用Cordova開發, 但攝影機功能需要結合廠商的sdk開發, 需要寫native code(objective c & java)
- 步驟:
1.結合廠商的sdk開發
2.把他寫成plugin, 將開發的功能結合進來
- 問題:
- 這個需要顯示畫面,不是只有提供功能,所以單純的plugin需求無法滿足
- 解法:
- 尋找能從Cordova轉畫面到原生視窗的開發方式
- [cordova-plugin-nativeview](https://github.com/mfdeveloper/cordova-plugin-nativeview) 這套可以滿足需求
- 安裝:
- iOS

# Objective-C version (Default)
pod 'cordova-plugin-nativeview', '~> 1.0.7'

# Swift version (needs update to latest Objective-c implementations)
pod 'cordova-plugin-nativeview', :git => 'https://github.com/mfdeveloper/cordova-plugin-nativeview.git', :branch => 'swift'

- Android

allprojects {
    repositories {
        ...
        maven { url 'https://jitpack.io' }
    }
}

implementation ('com.github.mfdeveloper:cordova-plugin-nativeview:1.0.7')

- 使用方式

document.addEventListener("deviceready", function() {

    /*
     * 給Storyboard跟ViewControlller的名稱即可
     */
    cordova.plugins.NativeView.show('Main', 'vcCameraCCTV')
    .then(function() {
      
      /**
       * 做完要接著做的動作寫在這裡
       */
    });

}, false);

- Xcode畫面

- Cordova APP

- 攝影機畫面(Objective C撰寫)