01 常用UI组件

miot/ui/CameraRender

摄像机视频渲染组件

Export: public
Doc_name: 常用UI组件
Doc_index: 1
Doc_directory: ui
Since: 10031
Properties

Name	Type	Description
videoCodec	MISSCodec	接收视频的编码格式 默认：MISS_CODEC_VIDEO_H264
audioCodec	MISSCodec	对讲发送音频的编码格式 默认：MISS_CODEC_AUDIO_G711A
audioRecordSampleRate	MISSSampleRate	对讲音频的 sample rate 默认：FLAG_AUDIO_SAMPLE_8K
audioRecordChannel	MISSAudioChannel	对讲音频的 channel 默认：FLAG_AUDIO_CHANNEL_MONO
audioRecordDataBits	MISSDataBits	对讲音频的 data bits 默认：FLAG_AUDIO_DATABITS_16
audioRecordCodec	MISSCodec	对讲音频的codecId，默认与audioCodec一样。
videoRate	number	ios端录制视频时的帧率。
maximumZoomScale	number	最大缩放比例 默认2.0 ;only ios
minimumZoomScale	number	最小缩放比例 默认1.0 ;only ios
scale	number	缩放比例 默认1.0 ;only ios
useLenCorrent	bool	是否开启畸变矫正 default true
correctRadius	number	畸变矫正-radius default 1.1
osdx	number	畸变矫正-osdx default 0.0
osdy	number	畸变矫正-osdy default 0.0
fullscreenState	bool	是否是全屏状态 since 10033
forceSoftDecode	bool	强制软解 since 10033
recordingVideoParam	object	only for android;限制录制视频时的分辨率，开始录制视频前，要调整分辨率到指定分辨率。 since 10041 {width:111, height:111，fps： 20} fps指定录制视频时，对应的视频帧帧率，默认是20，不是20的需要手动指定；如果调整到固定帧率，依旧不work，则指定成-1，app端会按照收到视频帧的时间插入视频文件里。
isFull	boolean	画面是否填充满屏幕
whiteBackground	boolean	是否使用白色背景 @since 10047
playRate	number	android端播放直播/回看时的帧率，默认是20 since 10048

Example

<CameraRenderView
    style={{ width: 300, height: 300, backgroundColor: '#ffffff'}}
    maximumZoomScale={3.0}
    videoCodec={MISSCodec.MISS_CODEC_VIDEO_H264}
    audioCodec={MISSCodec.MISS_CODEC_AUDIO_G711A}
    audioRecordSampleRate={MISSSampleRate.FLAG_AUDIO_SAMPLE_8K}
    audioRecordChannel={MISSAudioChannel.FLAG_AUDIO_CHANNEL_MONO}
    audioRecordDataBits={MISSDataBits.FLAG_AUDIO_DATABITS_16}
    fullscreenState={false}
    videoRate={15} >
/>

• miot/ui/CameraRender
  • instance
    • .startRender()
    • .stopRender()
    • .startAudioPlay()
    • .stopAudioPlay()
    • .startAudioRecord()
    • .stopAudioRecord()
    • .hidesSurfaceView()
    • .startRecord(存储位置filePath, timeCallBackName, did)
    • .stopRecord()
    • .snapShot(存储位置filePath, did)
  • inner
    • ~onVideoClick : func
    • ~onScaleChanged
    • ~onPTZDirectionCtr
    • ~MISSCodec : object
      • .MISS_CODEC_VIDEO_H264
      • .MISS_CODEC_VIDEO_H265
      • .MISS_CODEC_AUDIO_G711A
      • .MISS_CODEC_AUDIO_AAC
      • .MISS_CODEC_AUDIO_PCM
    • ~MISSSampleRate : object
      • .FLAG_AUDIO_SAMPLE_8K
      • .FLAG_AUDIO_SAMPLE_16K
    • ~MISSDataBits : object
      • .FLAG_AUDIO_DATABITS_8
      • .FLAG_AUDIO_DATABITS_16
    • ~MISSAudioChannel : object
      • .FLAG_AUDIO_CHANNEL_MONO
      • .FLAG_AUDIO_CHANNEL_STERO

---

miot/ui/CameraRender.startRender()

开始渲染视频

Kind: instance method of miot/ui/CameraRender

---

miot/ui/CameraRender.stopRender()

停止渲染视频

Kind: instance method of miot/ui/CameraRender

---

miot/ui/CameraRender.startAudioPlay()

开始播放声音

Kind: instance method of miot/ui/CameraRender

---

miot/ui/CameraRender.stopAudioPlay()

停止播放声音

Kind: instance method of miot/ui/CameraRender

---

miot/ui/CameraRender.startAudioRecord()

开始录制声音

Kind: instance method of miot/ui/CameraRender

---

miot/ui/CameraRender.stopAudioRecord()

停止录制声音

Kind: instance method of miot/ui/CameraRender

---

miot/ui/CameraRender.hidesSurfaceView()

隐藏SurfaceView only for Android

Kind: instance method of miot/ui/CameraRender
Since: 10033

---

miot/ui/CameraRender.startRecord(存储位置filePath, timeCallBackName, did)

开始录像

Kind: instance method of miot/ui/CameraRender

Param	Type	Description
存储位置filePath	string	filePath必须是带 Host.file.storageBasePath前缀的path，native端会校验这个路径合法性。
timeCallBackName	string	录制时长回调
did	*

---

miot/ui/CameraRender.stopRecord()

停止录像

Kind: instance method of miot/ui/CameraRender

---

miot/ui/CameraRender.snapShot(存储位置filePath, did)

截屏

Kind: instance method of miot/ui/CameraRender

Param	Type	Description
存储位置filePath	string	filePath必须是带 Host.file.storageBasePath前缀的path，native端会校验这个路径合法性。
did	*

---

miot/ui/CameraRender~onVideoClick : func

用户单击回调

Kind: inner property of miot/ui/CameraRender

---

miot/ui/CameraRender~onScaleChanged

缩放的回调

Kind: inner property of miot/ui/CameraRender

---

miot/ui/CameraRender~onPTZDirectionCtr

提供给云台机，向左向右滑动view，让云台机跟着转动

Kind: inner property of miot/ui/CameraRender

---

miot/ui/CameraRender~MISSCodec : object

音视频codec

Kind: inner namespace of miot/ui/CameraRender

• ~MISSCodec : object
  • .MISS_CODEC_VIDEO_H264
  • .MISS_CODEC_VIDEO_H265
  • .MISS_CODEC_AUDIO_G711A
  • .MISS_CODEC_AUDIO_AAC
  • .MISS_CODEC_AUDIO_PCM

---

MISSCodec.MISS_CODEC_VIDEO_H264

H264

Kind: static constant of MISSCodec

---

MISSCodec.MISS_CODEC_VIDEO_H265

H265

Kind: static constant of MISSCodec

---

MISSCodec.MISS_CODEC_AUDIO_G711A

G711

Kind: static constant of MISSCodec

---

MISSCodec.MISS_CODEC_AUDIO_AAC

AAC

Kind: static constant of MISSCodec

---

MISSCodec.MISS_CODEC_AUDIO_PCM

PCM

Kind: static constant of MISSCodec
Since: 10047

---

miot/ui/CameraRender~MISSSampleRate : object

音频sample rate

Kind: inner namespace of miot/ui/CameraRender

• ~MISSSampleRate : object
  • .FLAG_AUDIO_SAMPLE_8K
  • .FLAG_AUDIO_SAMPLE_16K

---

MISSSampleRate.FLAG_AUDIO_SAMPLE_8K

8000

Kind: static constant of MISSSampleRate

---

MISSSampleRate.FLAG_AUDIO_SAMPLE_16K

16000

Kind: static constant of MISSSampleRate

---

miot/ui/CameraRender~MISSDataBits : object

音频 data bits

Kind: inner namespace of miot/ui/CameraRender

• ~MISSDataBits : object
  • .FLAG_AUDIO_DATABITS_8
  • .FLAG_AUDIO_DATABITS_16

---

MISSDataBits.FLAG_AUDIO_DATABITS_8

8bits

Kind: static constant of MISSDataBits

---

MISSDataBits.FLAG_AUDIO_DATABITS_16

16bits

Kind: static constant of MISSDataBits

---

miot/ui/CameraRender~MISSAudioChannel : object

音频 channel

Kind: inner namespace of miot/ui/CameraRender

• ~MISSAudioChannel : object
  • .FLAG_AUDIO_CHANNEL_MONO
  • .FLAG_AUDIO_CHANNEL_STERO

---

MISSAudioChannel.FLAG_AUDIO_CHANNEL_MONO

单通道

Kind: static constant of MISSAudioChannel

---

MISSAudioChannel.FLAG_AUDIO_CHANNEL_STERO

双通道

Kind: static constant of MISSAudioChannel

---

miot/ui/InputDialog

输入对话框

Export: public
Doc_name: 常用UI组件
Doc_index: 1
Doc_directory: ui
Properties

Name	Type	Description
visible	bool	是否可见
cancelable	bool	是否允许点击空白区域取消显示,仅限Android
singleLine	bool	是否单行显示
title	string	标题
message	string	副标题，内容
placeholder	string	输入框placeholder，默认为空
defaultText	string	输入框默认初始值，默认为空
cancel	string	取消标题
confirm	string	确认标题
onConfirm	func	确认点击回调
onCancel	func	取消点击回调
onDismiss	func	对话框消失回调
timeout	number	超时自动隐藏，设置0或者不设置不会自动隐藏

---

miot/ui/LoadingDialog

输入对话框

Export: public
Doc_name: 常用UI组件
Doc_index: 1
Doc_directory: ui
Properties

Name	Type	Description
visible	bool	是否可见
cancelable	bool	是否允许点击空白区域取消显示,仅限Android
title	string	标题
message	string	副标题，内容
onDismiss	func	对话框消失回调
timeout	number	超时自动隐藏，设置0或者不设置不会自动隐藏

---

miot/ui/MessageDialog

消息对话框

Export: public
Doc_name: 常用UI组件
Doc_index: 1
Doc_directory: ui
Properties

Name	Type	Description
visible	bool	是否可见
cancelable	bool	是否允许点击空白区域取消显示,仅限Android
title	string	标题
message	string	副标题，内容
cancel	string	取消标题
confirm	string	确认标题
onConfirm	func	确认点击回调
onCancel	func	取消点击回调
onDismiss	func	对话框消失回调

---

miot/ui/MultiChoseDialog : func

回调会带一个 object 的参数，object.position为点击第几个条目，object.check 为选中状态

Kind: global variable
Export: public
Doc_name: 常用UI组件
Doc_index: 1
Doc_directory: ui
Properties

Name	Type	Description
visible	bool	是否可见
cancelable	bool	是否允许点击空白区域取消显示,仅限Android
title	string	标题
timeout	number	超时自动隐藏，设置0或者不设置不会自动隐藏
dataSource	array	数据源，建议 array 的每个item 是一个 object，object 至少有展示条目名称、选中状态两个字段
dataKey	string	用于表示显示的字段名，dataSource每个条目显示名称 object 的字段名
checkKey	string	用于表示选中的字段名，dataSource每个条目选中状态 object 的字段名
cancel	string	取消标题
confirm	string	确认标题
onConfirm	func	确认点击回调
onCancel	func	取消点击回调
onDismiss	func	对话框消失回调
onCheck	func	某一行选中状态变更回调

Example

import {MultiChoseDialog} from 'miot/ui'
//dataSource列表数据中，dataKey所定义的值('dataKeyName') 对应项为展示的名称， 与checkKey所定义的值('checkKeyName') 对应的boolean值表示是否选中
<MultiChoseDialog 
dataSource = {[{'dataKeyName':'displayName1','checkKeyName':false}, {'dataKeyName':'displayName2','checkKeyName':true} ]}
dataKey = {'dataKeyName'}
checkKey = {'checkKeyName'}
/>

Example

某一行选中状态变更回调

Example

import {MultiChoseDialog} from 'miot/ui'
<MultiChoseDialog 
...
onCheck={res => {
 console.log('click at row ', res.position, ' with checked ', res.check)
}}
/>

---

miot/ui/ProgressDialog

进度对话框，当进度到达max设置之后自动消失

Export: public
Doc_name: 常用UI组件
Doc_index: 1
Doc_directory: ui
Properties

Name	Type	Description
visible	bool	是否可见
cancelable	bool	是否允许点击空白区域取消显示,仅限Android
title	string	标题
message	string	副标题，内容
max	number	最大进度值
progress	number	当前进度值
onDismiss	func	对话框消失回调
timeout	number	超时自动隐藏，设置0或者不设置不会自动隐藏

---

miot/ui/

RTSP视频渲染组件

Export: public
Doc_name: 常用UI组件
Doc_index: 1
Doc_directory: ui
Since: 10036

---

miot/ui/RobotMap

扫地机器人地图组件

Export: public
Doc_name: 常用UI组件
Doc_index: 1
Doc_directory: ui
Since: 10029
Properties

Name	Type	Description
imageSources	[ 'array' ].<object>	需要展示在地图上的图片
imageSources.source	source	图片resource，必传。
imageSources.name	string	图片名称，后续更新方便确定图片,必传
imageSources.bgSource	source	图片背景图，类似扫地机清扫时周边的那一圈，如果传了这个，一定会有动画
imageSources.position	string	图片相对位置，如果不传，则保持上一次的位置不动，但是首次必传
imageSources.size	string	图片在view中展示的大小，如果不传，则保持上一次的大小不动，同样首次必传
imageSources.rotation	number	图片的逆时针旋转角度 0-360，可不传 images=[{ image:url, bgImage:url1, position:{127,125}, size:{10,10}, rotation:180, name:charge }]
mapStyle.wallColor	string	文字颜色 默认值 #000000
mapStyle.floorColor	string	文字颜色 默认值 #000000
mapStyle.lineColor	string	文字颜色 默认值 #000000

Example

<MHRobotMap
    style={{ width: 300, height: 300, backgroundColor: '#ffffff'}}
    mapStyle={{wallColor: '#75c4fa',floorColor: '#468ad6',lineColor: '#9bc4e3'}}
    images={[{image:require(''),position:{125,125},size:{5,5},rotation:0,name:'charge'}]}
/>

---

miot/ui/SingleChoseDialog

单选对话框

Export: public
Doc_name: 常用UI组件
Doc_index: 1
Doc_directory: ui
Properties

Name	Type	Description
visible	bool	是否可见
cancelable	bool	是否允许点击空白区域取消显示,仅限Android
title	string	标题
timeout	number	超时自动隐藏，设置0或者不设置不会自动隐藏
dataSource	[ 'array' ].<string>	数据源
check	number	选中第几个数据源
cancel	string	取消标题
confirm	string	确认标题
onConfirm	func	确认点击回调
onCancel	func	取消点击回调
onDismiss	func	对话框消失回调
onCheck	func	某一行选中状态变更回调

Example

import {SingleChoseDialog} from 'miot/ui'
<SingleChoseDialog 
dataSource={['message0', 'message1', 'message2', 'message3', 'message4', 'message5', 'message6']}
...
/>

---

miot/ui/TitleBarBlack

Deprecated

黑色标题栏

Export: public
Doc_name: 常用UI组件
Doc_index: 1
Doc_directory: ui
Properties

Name	Description
leftTextStyle	左侧文字样式，和 leftText 一起使用，不设置使用米家默认值
leftText	左侧文字
onPressLeft	左侧点击事件，设置了才显示左侧文字或图片，如果设置了leftText则显示设置的文字，否则显示默认的返回按钮。
onPressLeft2	左侧的第二个点击事件，设置了才显示默认的关闭按钮，
rightTextStyle	右侧文字样式，和 rightText 一起使用，不设置使用米家默认值
rightText	右侧文字
onPressRight	右侧点击事件，设置了才显示右侧文字或图片，如果设置了 rightText 则显示设置的文字，否则显示默认的更多按钮。
onPressRight2	右侧的第二个点击事件，设置了才显示默认的分享按钮
title	中间的标题
subTitle	中间的子标题
onPressTitle	点击标题的事件
showDot	是否显示右侧更多按钮的空点

---

miot/ui/TitleBarWhite

Deprecated

白色标题栏

Export: public
Doc_name: 常用UI组件
Doc_index: 1
Doc_directory: ui
Properties

Name	Description
leftTextStyle	左侧文字样式，和 leftText 一起使用，不设置使用米家默认值
leftText	左侧文字
onPressLeft	左侧点击事件，设置了才显示左侧文字或图片，如果设置了leftText则显示设置的文字，否则显示默认的返回按钮。
onPressLeft2	左侧的第二个点击事件，设置了才显示默认的关闭按钮，
rightTextStyle	右侧文字样式，和 rightText 一起使用，不设置使用米家默认值
rightText	右侧文字
onPressRight	右侧点击事件，设置了才显示右侧文字或图片，如果设置了 rightText 则显示设置的文字，否则显示默认的更多按钮。
onPressRight2	右侧的第二个点击事件，设置了才显示默认的分享按钮
title	中间的标题
subTitle	中间的子标题
onPressTitle	点击标题的事件
showDot	是否显示右侧更多按钮的空点

---