当前位置: 首页 > article >正文

openFrameworks_如何使用ofxXmlSettings和ofxGui来创建识别界面

效果图:

代码及详解

1.添加两个插件的头文件:

#include "ofxGui.h"
#include "ofxXmlSettings/src/ofxXmlSettings.h"

2.添加GUI部分,然后在.h声明右边的openframeworks的UI部分,包括面板ofxPanel,按钮ofxButton,滑块ofxSlider,切换ofxToggle,组ofxGuiGroup:

ofxPanel panel;
ofxToggle ip;
ofxIntSlider port;
ofxIntSlider device;
ofxToggle cutFilter;
ofxGuiGroup depthGroup;
ofxToggle useDepth;
ofxToggle base;
ofxIntSlider deviceX;
ofxIntSlider deviceY;
ofxIntSlider gridX;
ofxIntSlider gridY;
ofxButton save;

int portInt = 3333;
int deviceXInt = 1;
int deviceYInt = 1;
int gridXInt = 2;
int gridYInt = 2;

3. 在ofApp::setup()函数中对变量赋值:

panel.setPosition(250, 0);
panel.setup("Values", "toolsConfig", 250, 0);
panel.setName("Values");
panel.add(ip.setup("ip", false));
panel.add(port.setup("port", 3333, 3333, 3350));
panel.add(device.setup("device", 0, 0, 3));
panel.add(cutFilter.setup("cutFilter", false));
depthGroup.setup("depthGroup");
depthGroup.setName("depthGroup");
depthGroup.add(useDepth.setup("useDepth", false));
depthGroup.add(base.setup("base", false));
depthGroup.minimize();
panel.add(&depthGroup);

panel.add(deviceX.setup("deviceX", 1, 1, 6));
panel.add(deviceY.setup("deviceY", 1, 1, 6));
panel.add(gridX.setup("gridX", 2, 2, 10));
panel.add(gridY.setup("gridY", 2, 2, 10));
panel.add(save.setup("save"));
panel.minimizeAll();

panel.loadFromFile("toolsConfig.xml");

gui.setPosition(250, 0);//设置panel的位置

gui.setup("Values", "toolsConfig", 250, 0);//设置名称,位置和config

panel.setName("Values");//设置panel的名称

panel.add(ip.setup("ip", false));//将ip的名字设置在UI上,并记录点击切换后的数值

panel.add(port.setup("port", 3333, 3333, 3350));//同上

panel.add(device.setup("device", 0, 0, 3));//同上

panel.add(cutFilter.setup("cutFilter", false));//同上

depthGroup.setup("depthGroup");//设置组

depthGroup.setName("depthGroup");//设置组名称

depthGroup.add(useDepth.setup("useDepth", false));//组内添加useDepth,并设置false

depthGroup.add(base.setup("base", false));//同上

depthGroup.minimize();//将组最小化

panel.add(&depthGroup);//将组添加到panel中

panel.add(deviceX.setup("deviceX", 1, 1, 6));//设置水平方向设备数量

panel.add(deviceY.setup("deviceY", 1, 1, 6));//设置竖直方向设备数量

panel.add(gridX.setup("gridX", 2, 2, 10));//设置调试点水平方向数量

panel.add(gridY.setup("gridY", 2, 2, 10));//设置调试点竖直方向数量

panel.add(save.setup("save"));//设置保存按钮及名称

panel.minimizeAll();

panel.loadFromFile("toolsConfig.xml");//加载一个名为"toolsConfig.xml"的配置文件到panel对象

//设置背景颜色

ofSetBackgroundColor(ofColor::cornflowerBlue);

//对滑块添加监听事件

device.addListener(this, &ofApp::deviceChange);

4.ofApp::draw()函数中对调用绘制方法:

panel.draw();

5.添加xml外部配置,在.h中声明ofxXmlSettings的变量

ofxXmlSettings xml;

6.在ofApp::setup()函数中对xml调用:

xml.loadFile("config.xml");

7.按保存按键对UI上的数值进行保存:

if(save){
   xml.setValue("ip", ip == false ? "127.0.0.1" : "192.168.0.2");
   xml.setValue("port", port);
   xml.setValue("device", device);
   xml.setValue("cutFilter", cutFilter);
   xml.setValue("useDepth", useDepth);
   xml.setValue("base", base);
   xml.setValue("gridX", gridXInt - 1);
   xml.setValue("gridY", gridYInt - 1);
   xml.setValue("deviceX", deviceXInt);
   xml.setValue("deviceY", deviceYInt);
   xml.saveFile("config.xml");
   panel.saveToFile("toolsConfig.xml");
}

//设置xml中相应的参数并存入xml外部配置中,其他的同理

xml.setValue("ip", ip == false ? "127.0.0.1" : "192.168.0.2");

 7.添加相应的介绍,在.h中声明函数:

	void description();

8.在ofApp::draw()函数中对调用介绍方法:

void ofApp::draw() {
	panel.draw();
	description();
}

9.description()方法中的代码如下:

void ofApp::description() {
	selectFont(18, DEFAULT_CHARSET, "宋体");
	ofSetColor(ofColor::white);
	drawCNString(ip == false ? "ip地址:127.0.0.1" : "ip地址:192.168.0.2", 20, 35);
	drawCNString(("端口号:" + ofToString(portInt)).c_str(), 20, 55);
	drawCNString(("设备类别:" + ofToString(deviceName)).c_str(), 20, 75);
	drawCNString(cutFilter == false ? "滤光片状态:初始不切换" : "滤光片状态:初始切换", 20, 95);
	drawCNString(useDepth ? "图像类别:深度图像" : "图像类别:红外图像", 20, 115);

	if (deviceType == 0 || deviceType == 1) {
		drawCNString("测距基准:无", 20, 135);
	}
	else {
		if (useDepth) {
			drawCNString(base ? "测距基准:识别设别" : "测距基准:被测环境", 20, 135);
		}
		else {
			drawCNString("测距基准:无", 20, 135);
		}
	}

	drawCNString(("水平摄像头数量:" + ofToString(deviceXInt)).c_str(), 20, 155);
	drawCNString(("垂直摄像头数量:" + ofToString(deviceYInt)).c_str(), 20, 175);
	drawCNString(("水平校准点数量:" + ofToString(gridXInt)).c_str(), 20, 195);
	drawCNString(("垂直校准点数量:" + ofToString(gridYInt)).c_str(), 20, 215);

}

10.切换device所执行的方法代码如下:

void ofApp::deviceChange(int& device)
{
	switch (device)
	{
	case 0:
		deviceName = "普通摄像头";
		useDepth = false;
		width = 640;
		height = 480;
		depthGroup.minimize();
		break;
	case 1:
		deviceName = "可切换滤光片";
		useDepth = false;
		width = 640;
		height = 480;
		depthGroup.minimize();
		break;
	case 2:
		deviceName = "Kinect2";
		useDepth = true;
		width = 512;
		height = 424;
		depthGroup.minimize();
		depthGroup.maximize();
		break;
	case 3:
		deviceName = "奥比中光";
		useDepth = true;
		width = 640;
		height = 480;
		depthGroup.minimize();
		depthGroup.maximize();
		break;
	default:
		break;
	}
}

最终的效果已经发在文章的开篇了

给个关注,接下来这些天我将手把手教你使用openframeworks制作一个多媒体互动的识别软件。


http://www.kler.cn/a/315268.html

相关文章:

  • Asp.Net FrameWork 4.7.2 WebAPI 使用WebSocket协议
  • KingbaseES(金仓数据库)入门学习
  • 网络安全概论——身份认证
  • UVM 验证方法学之interface学习系列文章(十二)virtual interface 终结篇
  • linux----文件访问(c语言)
  • flask flask-socketio创建一个网页聊天应用
  • 机器人的动力学——牛顿欧拉,拉格朗日,凯恩
  • C++ —— vector 的模拟实现
  • 【计算机网络】运输层协议解析
  • Flutter - Win32程序是如何执行main函数
  • jmeter得到的文档数据处理
  • 后端接收数组,集合类数据
  • 数据结构之算法复杂度
  • 基于BiGRU+Attention实现风力涡轮机发电量多变量时序预测(PyTorch版)
  • 软考中级软件设计师——数据结构与算法基础学习笔记
  • 【图灵完备 Turing Complete】游戏经验攻略分享 Part.5 编程
  • 【若依RuoYi-Vue | 项目实战】帝可得后台管理系统(二)
  • Linux自主学习篇
  • oracle中NUMBER(1,0)的字段如何映射到c#中
  • 【设计模式-适配】
  • SSC377/D, 5M30 64/128MB, 1Tops1. 支持双摄,甚至三摄;2. 夜视全彩;3. 省内存、省带宽;4. 算力较大,适合新的算法模型;
  • 图像处理与分析
  • Spring的任务调度
  • 怎么在路由器上使用tcpdump抓包
  • Redisson 分布式锁的使用详解
  • Vue3中shallowRef和ref区别