我们重写了cvs包用来在手机端对gui的显示和设计，同时cvs继承了cv2（opencv for python）包和remi（python的跨平台的gui库）包的大部分功能，以下是cvs包的介绍：
from cvs import *| 函数名和变量 | 继承 | 参数 | 作用 | 返回 |
|---|---|---|---|---|
| imread | cv2 | same as cv2 | 读一张图 | mat图片数据 |
| read | cv2 | same as cv2 | 读一帧图 | mat图像数据 |
| imshow | cv2 | same as cv2 | 显示图片 | |
| VideoCapture | cv2 | same as cv2 | 打开摄像头 | 返回cam |
| openwin | custom | 无 | 打开一个窗体 | 无 |
| rectangle | cv2 | same as cv2 | 画矩形 | 无 |
| line | cv2 | same as cv2 | 画直线 | 无 |
| circle | cv2 | same as cv2 | 画椭圆 | 无 |
| putText | cv2 | same as cv2 | 在图像上写字 | 无 |
| GaussianBlur | cv2 | same as cv2 | 高斯模糊 | mat图像数据 |
| flip | cv2 | same as cv2 | 图像反转 | mat图像数据 |
| resize | cv2 | same as cv2 | 缩放图像尺寸 | mat图像数据 |
| setLbs | custom | str | 传递str参数 | 无 |
| getLbs | custom | 无 | 传递str参数 | str |
| waitKey | cv2 | same as cv2 | 等待延迟 | 无 |
| sleep | custom | 毫秒数 | 等待延迟 | 无 |
| initcv | custom | 函数名 | 初始化处理线程 | 无 |
| startcv | remi | gui的类名 | 启动gui界面 | 无 |
| App | remi | -- | 用于ui设计和显示 | 无 |
| gui | remi | -- | ui控件类 | 无 |
首先，导入cvs包 Import cvs library and some other useful stuff.
from cvs import *其次，定义一个子类继承“app”类，并声明一个“main”函数，该函数将成为应用程序的入口点。在主函数内部，您必须return the root widget。
Subclass the App class and declare a main function that will be the entry point of the application. Inside the main function you have to return the root widget.
class MyApp(App):
def __init__(self, *args):
super(MyApp, self).__init__(*args)
def main(self):
lbl = gui.Label("Hello world!", width=100, height=30)
# return of the root widget
return lbl最后，在主类之外，调用initcv(cvs.openwin)初始化窗口，调用函数“startcv”启动应用程序，并将前面声明的类的名称作为参数传递。
Outside the main class start the application calling the function startcv passing as parameter the name of the class you declared previously.
# starts the gui
initcv（cvs.openwin）
startcv(MyApp)Run the script，显示如下：
from cvs import *
class MyApp(App):
def __init__(self, *args):
super(MyApp, self).__init__(*args)
def main(self):
container = gui.VBox(width=220, height=200)
self.lbl = gui.Label('Hello world!')
self.bt = gui.Button('Press me!')
# setting the listener for the onclick event of the button
self.bt.onclick.do(self.on_button_pressed)
# appending a widget to another, the first argument is a string key
container.append(self.lbl)
container.append(self.bt)
# returning the root widget
return container
# listener function
def on_button_pressed(self, widget):
self.lbl.set_text('Button pressed!')
self.bt.set_text('Hi!')
# starts gui
initcv(cvs.openwin)
startcv(MyApp)这个例子先构建一个容器（container，类似与Android studio里的Layout），然后在容器里添加了按钮和文本显示控件，并且定义了一个消息用于处理按钮按下来的情况。显示如下：
点击后显示如下：
Widgets公开了在用户交互期间发生的一组事件。这些事件是定义应用程序行为的一种方便方法。每个Widgets都有自己的回调，这取决于它允许的用户交互类型。稍后将说明Widgets的具体回调。
为了将函数注册为事件侦听器，您必须调用一个像eventname.do（即onclick.do）这样的函数，该函数将作为参数传递将管理事件的回调。
from cvs import *
class MyApp(App):
def __init__(self, *args):
super(MyApp, self).__init__(*args)
def main(self):
container = gui.VBox(width=120, height=100)
self.lbl = gui.Label('Hello world!')
self.bt = gui.Button('Hello name!')
self.bt2 = gui.Button('Hello name surname!')
# setting the listener for the onclick event of the buttons
self.bt.onclick.do(self.on_button_pressed, "Name")
self.bt2.onclick.do(self.on_button_pressed, "Name", "Surname")
# appending a widget to another
container.append(self.lbl)
container.append(self.bt)
container.append(self.bt2)
# returning the root widget
return container
# listener function
def on_button_pressed(self, widget, name='', surname=''):
self.lbl.set_text('Button pressed!')
widget.set_text('Hello ' + name + ' ' + surname)
# starts the gui
initcv(cvs.openwin)
startcv(MyApp)显示如下：
在所示的示例中，self.bt.onclick.do（self.on_button_pressed）将self的on_button_pressed函数注册为按钮组件所显示的onclick事件的侦听器。Simple, easy.
侦听器的回调将首先接收发射器的实例，然后接收特定事件提供的所有其他参数。
除了标准事件注册（如上所述），还可以将用户参数传递给侦听器函数。这可以实现向do函数调用追加参数，这允许很大的灵活性，使用相同的事件侦听器定义获得不同的行为。
from cvs import *
import numpy as np
class MyApp(App):
def __init__(self, *args):
super(MyApp, self).__init__(*args)
def main(self):
#creating a container VBox type, vertical (you can use also HBox or Widget)
main_container = gui.VBox(width=360, height=680, style={'margin':'0px auto'})
self.aidcam = OpencvVideoWidget(self, width=340, height=480)
self.aidcam.style['margin'] = '10px'
self.aidcam.set_identifier("myimage_receiver")
main_container.append(self.aidcam)
# returning the root widget
return main_container
def process():
cap=cvs.VideoCapture(1)
while True:
sleep(30)
img =cap.read()
if img is None :
continue
cvs.imshow(img)
if __name__ == '__main__':
#init proceess thread
initcv(process)
#start gui show
startcv(MyApp)
运行后，显示界面如下：
In order to define a new style for your app, you have to do the following. Create a res folder and pass it to your App class constructor:
class MyApp(App):
def __init__(self, *args):
res_path = os.path.join(os.path.dirname(__file__), 'res')
super(MyApp, self).__init__(*args, static_file_path={'res':res_path})
Make a copy the standard style.css from the remi folder and paste it inside your res folder. Edit it in order to customize. This way the standard style.css file gets overridden by the one you created.
最后，我们建议界面部分开发，采用wizard进行触摸推拽式开发，自动生成类似上面的代码，更easy，更simple！ 请阅读Wizard--触摸拖拽式设计你的界面