152 lines
3.6 KiB
Vue
152 lines
3.6 KiB
Vue
<template>
|
||
<view>
|
||
</view>
|
||
</template>
|
||
|
||
<script lang="uts">
|
||
import { CameraView } from './camera';
|
||
import { CameraConfig } from '../interface'
|
||
import { CameraManager } from './CameraManager';
|
||
|
||
//原生提供以下属性或方法的实现
|
||
export default {
|
||
/**
|
||
* 组件名称,也就是开发者使用的标签
|
||
*/
|
||
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
|
||
}
|
||
},
|
||
/**
|
||
* 组件内部变量声明
|
||
*/
|
||
data() {
|
||
return {}
|
||
},
|
||
/**
|
||
* 属性变化监听器实现
|
||
*/
|
||
watch: {
|
||
"position": {
|
||
/**
|
||
* 这里监听属性变化,并进行组件内部更新
|
||
*/
|
||
handler(newValue : string, _ : string) {
|
||
this.$el?.switchCamera(newValue)
|
||
},
|
||
immediate: false // 创建时是否通过此方法更新属性,默认值为false
|
||
},
|
||
"flash": {
|
||
/**
|
||
* 这里监听属性变化,并进行组件内部更新
|
||
*/
|
||
handler(newValue : string, _ : string) {
|
||
this.$el?.setFlash(newValue)
|
||
},
|
||
immediate: false // 创建时是否通过此方法更新属性,默认值为false
|
||
|
||
}
|
||
},
|
||
/**
|
||
* 规则:如果没有配置expose,则methods中的方法均对外暴露,如果配置了expose,则以expose的配置为准向外暴露
|
||
* ['publicMethod'] 含义为:只有 `publicMethod` 在实例上可用
|
||
*/
|
||
expose: [],
|
||
methods: {
|
||
|
||
},
|
||
/**
|
||
* [可选实现] 组件被创建,组件第一个生命周期,
|
||
* 在内存中被占用的时候被调用,开发者可以在这里执行一些需要提前执行的初始化逻辑
|
||
*/
|
||
created() {
|
||
|
||
},
|
||
/**
|
||
* [可选实现] 对应平台的view载体即将被创建,对应前端beforeMount
|
||
*/
|
||
NVBeforeLoad() {
|
||
|
||
},
|
||
/**
|
||
* [必须实现] 创建原生View,必须定义返回值类型
|
||
* 开发者需要重点实现这个函数,声明原生组件被创建出来的过程,以及最终生成的原生组件类型
|
||
* (Android需要明确知道View类型,需特殊校验)
|
||
*/
|
||
NVLoad() : CameraView {
|
||
let previewView = new CameraView(this.$androidContext!, this)
|
||
previewView.setTag("9527");
|
||
CameraManager.getInstance().setCameraView(previewView);
|
||
return previewView
|
||
|
||
},
|
||
/**
|
||
* [可选实现] 原生View已创建
|
||
*/
|
||
NVLoaded() {
|
||
|
||
},
|
||
/**
|
||
* [可选实现] 原生View布局完成
|
||
*/
|
||
NVLayouted() {
|
||
this.$el?.setConfig({
|
||
resolution: this.resolution,
|
||
frameSize: this.frameSize,
|
||
flash: this.flash
|
||
} as CameraConfig)
|
||
this.$el?.switchCamera(this.position)
|
||
},
|
||
/**
|
||
* [可选实现] 原生View将释放
|
||
*/
|
||
NVBeforeUnload() {
|
||
let ret : Map<string, any> = new Map();
|
||
this.$emit('stop', ret)
|
||
|
||
this.$el?.unbindCamera()
|
||
},
|
||
/**
|
||
* [可选实现] 原生View已释放,这里可以做释放View之后的操作
|
||
*/
|
||
NVUnloaded() {
|
||
CameraManager.getInstance().dispose();
|
||
},
|
||
/**
|
||
* [可选实现] 组件销毁
|
||
*/
|
||
unmounted() {
|
||
|
||
},
|
||
}
|
||
</script>
|
||
|
||
<style>
|
||
|
||
</style> |