167 lines
3.8 KiB
Vue
167 lines
3.8 KiB
Vue
<template>
|
|
<view>
|
|
</view>
|
|
</template>
|
|
<script lang="uts">
|
|
import { UIView } from "UIKit"
|
|
import { CameraView } from "./camera";
|
|
import { CameraConfig } from '../interface'
|
|
import { CameraManager } from "./CameraManager";
|
|
|
|
//原生提供以下属性或方法的实现
|
|
export default {
|
|
data() {
|
|
return {
|
|
};
|
|
},
|
|
/**
|
|
* 组件名称，也就是开发者使用的标签
|
|
*/
|
|
name: "xf-camera",
|
|
/**
|
|
* 组件涉及的事件声明，只有声明过的事件，才能被正常发送
|
|
*/
|
|
emits: ['stop', 'error', 'ready'],
|
|
/**
|
|
* 属性声明，组件的使用者会传递这些属性值到组件
|
|
*/
|
|
props: {
|
|
"mode": {
|
|
type: String,
|
|
default: "normal"
|
|
},
|
|
"resolution": {
|
|
type: String,
|
|
default: "medium" // low | high
|
|
},
|
|
"position": {
|
|
type: String,
|
|
default: "back" // front前置 |back 后置
|
|
},
|
|
"flash": {
|
|
type: String,
|
|
default: "auto" // auto, on, off, torch
|
|
},
|
|
"frameSize": {
|
|
type: String,
|
|
default: "medium" // small|large
|
|
}
|
|
},
|
|
/**
|
|
* 属性变化监听器实现
|
|
*/
|
|
watch: {
|
|
"position": {
|
|
/**
|
|
* 这里监听属性变化，并进行组件内部更新
|
|
*/
|
|
handler(newValue : String, _oldValue : String) {
|
|
CameraManager.getInstance().getCameraView()?.switchCamera(newValue)
|
|
},
|
|
/**
|
|
* 创建时是否通过此方法更新属性，默认值为false
|
|
*/
|
|
immediate: false
|
|
},
|
|
"flash": {
|
|
/**
|
|
* 这里监听属性变化，并进行组件内部更新
|
|
*/
|
|
handler(newValue : String, _oldValue : String) {
|
|
CameraManager.getInstance().getCameraView()?.setFlash(newValue)
|
|
},
|
|
/**
|
|
* 创建时是否通过此方法更新属性，默认值为false
|
|
*/
|
|
immediate: false
|
|
}
|
|
},
|
|
/**
|
|
* 规则：如果没有配置expose，则methods中的方法均对外暴露，如果配置了expose，则以expose的配置为准向外暴露
|
|
* ['publicMethod'] 含义为：只有 `publicMethod` 在实例上可用
|
|
*/
|
|
expose: [],
|
|
methods: {
|
|
|
|
},
|
|
|
|
|
|
/**
|
|
* 组件被创建，组件第一个生命周期，
|
|
* 在内存中被占用的时候被调用，开发者可以在这里执行一些需要提前执行的初始化逻辑
|
|
* [可选实现]
|
|
*/
|
|
created() {
|
|
|
|
},
|
|
/**
|
|
* 对应平台的view载体即将被创建，对应前端beforeMount
|
|
* [可选实现]
|
|
*/
|
|
NVBeforeLoad() {
|
|
|
|
},
|
|
/**
|
|
* 创建原生View，必须定义返回值类型
|
|
* 开发者需要重点实现这个函数，声明原生组件被创建出来的过程，以及最终生成的原生组件类型
|
|
* [必须实现]
|
|
*/
|
|
NVLoad() : UIView {
|
|
let previewView = new UIView()
|
|
previewView.tag = 9527
|
|
return previewView
|
|
},
|
|
|
|
/**
|
|
* 原生View已创建
|
|
* [可选实现]
|
|
*/
|
|
NVLoaded() {
|
|
|
|
},
|
|
/**
|
|
* 原生View布局完成
|
|
* [可选实现]
|
|
*/
|
|
NVLayouted() {
|
|
let previewView = this.$el as UIView;
|
|
let cameraView = new CameraView(previewView, this, {
|
|
resolution: this.resolution,
|
|
frameSize: this.frameSize,
|
|
devicePosition: this.position,
|
|
flash: this.flash
|
|
} as CameraConfig)
|
|
CameraManager.getInstance().setCameraView(cameraView);
|
|
},
|
|
/**
|
|
* 原生View将释放
|
|
* [可选实现]
|
|
*/
|
|
NVBeforeUnload() {
|
|
let ret : Map<string, any> = new Map();
|
|
let detail : Map<string, any> = new Map();
|
|
detail.set("detail", ret)
|
|
this.$emit("stop", detail);
|
|
|
|
CameraManager.getInstance().getCameraView()?.unbindCamera()
|
|
},
|
|
/**
|
|
* 原生View已释放，这里可以做释放View之后的操作
|
|
* [可选实现]
|
|
*/
|
|
NVUnloaded() {
|
|
CameraManager.getInstance().dispose()
|
|
},
|
|
/**
|
|
* 组件销毁
|
|
* [可选实现]
|
|
*/
|
|
unmounted() {
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
|
|
</style> |