ホームページ > 記事 > ウェブフロントエンド > uniAPPでシステムページを開く方法
uniAPP 開発では、システム ページを開く機能を実装する必要があることがよくあります。たとえば、カメラ、フォト アルバム、地図、ブラウザなどを呼び出します。この記事では、uniAPP がシステム ページを開く方法を紹介します。
1. カメラを開く
uniAPP でカメラを開きたい場合は、uni-app が提供するプラグイン「uni-app_camera」を使用できます。
1. プラグインのインストール
HBuilderX でプロジェクト ファイルを右クリックし、[Plug-in Market] を選択し、[uni-app_camera] プラグインを見つけてインストールします。
2. プロジェクトにプラグインを追加します。
プロジェクト フォルダーで manifest.json を見つけ、「app-plus」ノードに次のコードを追加します:
"camera ": {
"description": "相机", "interfaces": [{ "id": "takePhoto", "async": true }]
}
3. カメラ ページを開きます
カメラを呼び出す必要があるページでプラグインを導入し、uni の API を呼び出します:
'@/ js_sdk/uni-app_camera/js_sdk/uni-app_camera.js'からカメラをインポートします'
onChooseImage() {
camera.takePhoto({ quality: 'high', success: (res) => { console.log('拍照成功', res) }, fail: (err) => { console.log('拍照失败', err) } });
}
2. 写真を開きますalbum
uni-app が利用可能 付属プラグイン「uni-app_gallery」は、uniAPP でフォトアルバムを開く機能を実現するために使用します。
1. プラグインをインストールします
HBuilderX でプロジェクト ファイルを右クリックし、[プラグイン マーケット] を選択し、[uni-app_gallery] プラグインを見つけてインストールします。
2. プロジェクトにプラグインを追加します。
プロジェクト フォルダーで manifest.json を見つけ、「app-plus」ノードに次のコードを追加します:
"gallery ": {
"description": "相册", "interfaces": [{ "id": "chooseImage", "async": true }]
}
3. アルバム ページを開きます
アルバムを呼び出す必要があるページにプラグインを導入し、uni の API を呼び出します:
'@/ js_sdk/uni-app_gallery/js_sdk/uni-app_gallery.js'からギャラリーをインポートします'
onChooseImage() {
gallery.chooseImage({ count: 1, sizeType: ['original', 'compressed'], sourceType: ['album'], success: (res) => { console.log('选择成功', res) }, fail: (err) => { console.log('选择失败', err) } });
}
3. マップを開きます
uniAPP でマップを開くには、uni が提供する API を使用する必要があります。
1. システム マップを開く
uni.openLocation() メソッドを使用してシステム マップを開くことができます:
uni.openLocation({
latitude: 0, // 纬度 longitude: 0, // 经度 name: '', // 地址名称 scale: 18 // 缩放比例
} );
2. Baidu Map を開く
uni.navigateToMiniProgram() メソッドを使用して Baidu Map を開くことができます:
uni.navigateToMiniProgram({
appId: 'wxeb490c6f9b154ef9', // 百度地图appid path: 'pages/index/index', // 地图页面路径 success(res) { console.log(res) }
} );
4. ブラウザを開きます
uniAPP でブラウザを開くには、uni が提供する API を使用する必要があります。
1. 外部リンクを開く
uni.navigateBack() メソッドを使用して外部リンクを開くことができます:
uni.navigateBack({
delta: 1, success(res) { console.log(res) }, fail(err) { console.log(err) }
});
2. 内部 H5 ページを開く
uni.navigateTo() メソッドを使用して内部 H5 ページを開くことができます:
uni.navigateTo({
url: '/pages/webview/webview?url=' + encodeURIComponent(url), success(res) { console.log(res) }, fail(err) { console.log(err) }##) #});概要: 上記は、uniAPP でシステム ページを開く方法とコード例です。 uni-app_camera、uni-app_gallery、uni.openLocation()、uni.navigateToMiniProgram()、uni.navigateBack()、uni.navigateTo() などの API を使用すると、システム ページを開く機能を迅速に実装できます。
以上がuniAPPでシステムページを開く方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。