android页面显示波形图显示波形的app

转载

mob6454cc6d1c0b 2023-12-10 14:40:31

文章标签 android页面显示波形图控件 General 复选框 文章分类 Android 移动开发

目前很多串口示波器软件，比较著名的有VisualScope，这款软件界面清晰，友好，但是也有很多不足的地方，比如，无法实现看波形的同时调节参数，虽然有串口发送，但弹出来的框框是模态对话框，操作不便，而且发送窗口也不便于参数的调试。

关于能够实现示波器功能的控件和库相当多，基本上有NTGraph、TeeChart、 HightSpeedChart，ProEssentials还有Iocomp的iPlot 控件。

NTGraph是一个小巧且专门用来显示波形的控件，函数简单，直接给定X轴Y轴的值即可，中间的空档会自动连接，X轴显示时间或显示点数都可以，支持多条曲线，然后缺点只具有单一的显示曲线功能，外观单一，只能使用控件，没有开源文件，在其他电脑上使用需要先注册控件。

TeeChart是有名的图表控件，资料很多，一切都好，一路都有图形界面指导，但是不开源，使用需要注册。

HightSpeedChart和TeeChart差不多，完全开源，需要自定义控件，无需注册。

ProEssentials是一款专门用来做曲线图的，主要特点支持3D，然后MFC可用其DLL模式编程，无需注册，但必须是在文本程序中使用。也可以用控件模式编程，可以在对话框中当控件使用，但需要注册。

Iocomp是一个强大的工业控件，它包含各种各样的显示按钮，灯，图表，等等，它的iPlot控件是专门用来做曲线显示的，也是所有的这些图形控件中最美观的，而且编程简单。看外观估计VisualScope就是用的这个控件做的。

下面我就用iPlot控件来制作示波器：控件下载地址：http://download.eeworld.com.cn/detail/lb8820265/554171

接着上一讲，首先做好前期的工作，下载iocomp控件安装包，然后解压运行，如图：

安装成功后，在新建立的iPlotX对话框面板上右击，选择“插入ActiveX控件”然后不断取消，你将能够看到如下图所示的东西，说明IPlot控件已经成功安装好了。然后双iPlotX Control控件就显示在对话框上面了。

将IPlotX控件与对话框进行拉伸如下图所示：

然后右击控件点击“Properties IPlotX Control对象”在Control标签中修改相关属性，有如下属性必须更改：

1、一共建立4个Channel（通道）。

2、一共建立4个Y-Axes，并且将Y轴的Scale与Label颜色分别改成4个通道相同的颜色“红黄蓝紫”并且将Channel通道的Y轴名字分别对应刚刚新建的4个Y-Axes，将4个Y-Axes用234通道Visable前面的√去掉。

如下属性可以选择性更改：

1、Y-Axes与X-Axes标签中General中将复选框Restore Value On Resume√去掉。这个可以使得每次点击运行后不会回到初始状态。

2、Date View标签中General 中Grid中Y-Axis Name中选择All。这个可以显示所有通道的网格

3、Date View标签中General 中Grid中Axis Control将Enabled选上。这个可以使鼠标拖动示波器界面

4、Date View标签中Grid Lines中可以将网格线设置的颜色深一些。这样个人感觉会看的更舒服些。

5、Control中Title中的Visble√去掉，Legend中的Visble√去掉。这个我没用到去掉会更美观些

6、Control中General中User Can Edit Object√去掉。这样可以使在界面上右击弹不出Edit

7、Control中General中 Border Style中建议选择None感觉这样好看些

8、Channels中Marker中Style中针对不同的Channel选择不同的Sytle，然后将Show前面的√选上，然后将Size调整到2。这样做可以看到每个数据点，但又不至于过大。

下面是相关的设置截图：

接下来在iPlotX对话框上右击为控件添加成员变量，会弹出如下框框：

点击确定，然后如图：

给变量取名为m_iPlotX然后ok，会发现系统自动添加了许多文件在文件视图里面。

然后在lbDlg.cpp中添加几个头文件

#include "iPlotChannelX.h" 
#include "iPlottoolbarx.h"
#include "iPlotaxisx.h"

还有一个全局变量

double XValue;//设置X轴为全局变量

然后添加一下定时器消息函数，初始化消息函数如下图：

在定时器消息函数中添加如下函数：

double YRandom;
  YRandom = (rand()/(double)RAND_MAX)*50; // Generate Random data
  // AddXY - Is used for adding a data point and specifying both the X & Y value
  m_iPlotX.GetChannel(0).AddXY(XValue, YRandom );
  m_iPlotX.GetChannel(1).AddXY(XValue, YRandom + 10);
  m_iPlotX.GetChannel(2).AddXY(XValue, YRandom + 20);
  m_iPlotX.GetChannel(3).AddXY(XValue, YRandom + 30);
   XValue = XValue + 1;
       CDialog::OnTimer(nIDEvent);

图如下：

在初始化函数中添加SetTimer(1,100,NULL);如下图所示：

现在编译运行应该就能看到一条红色曲线了。

接下来就是添加复选框用来显示不同的曲线了，在控件上方添加4个复选框分别命名为CH1~CH4将ID分别改成IDC_CHECK_CH1~ IDC_CHECK_CH4如下图所示：

然后双击CH1复选框然后确定，为其添加函数：

CButton* pBtn = (CButton*)GetDlgItem(IDC_CHECK_CH1); 
int state = pBtn->GetCheck(); 
      if(state == 0) 
      { 
                  m_iPlotX.GetChannel(0).SetVisible(0);
      } 
      else 
      {  
                          m_iPlotX.GetChannel(0).SetVisible(1);
      }

如下图所示：

同样双击CH2 CH3 CH4控件为其添加函数

/CH2/
       CButton* pBtn = (CButton*)GetDlgItem(IDC_CHECK_CH2); 
int state = pBtn->GetCheck(); 
      if(state == 0) 
      { 
                  m_iPlotX.GetChannel(1).SetVisible(0);
                  m_iPlotX.GetYAxis(1).SetVisible(0);
      } 
      else 
      {  
                          m_iPlotX.GetChannel(1).SetVisible(1);
                          m_iPlotX.GetYAxis(1).SetVisible(1);
      }

/CH3/
       CButton* pBtn = (CButton*)GetDlgItem(IDC_CHECK_CH3); 
int state = pBtn->GetCheck(); 
      if(state == 0) 
      { 
                  m_iPlotX.GetChannel(2).SetVisible(0);
                  m_iPlotX.GetYAxis(2).SetVisible(0);
      } 
      else 
      {  
                          m_iPlotX.GetChannel(2).SetVisible(1);
                          m_iPlotX.GetYAxis(2).SetVisible(1);
      }
/CH4/
       CButton* pBtn = (CButton*)GetDlgItem(IDC_CHECK_CH4); 
int state = pBtn->GetCheck(); 
      if(state == 0) 
      { 
                  m_iPlotX.GetChannel(3).SetVisible(0);
                  m_iPlotX.GetYAxis(3).SetVisible(0);
      } 
      else 
      {  
                          m_iPlotX.GetChannel(3).SetVisible(1);
                          m_iPlotX.GetYAxis(3).SetVisible(1);
      }

在初始化函数中添加函数：

CButton* pBtn = (CButton*)GetDlgItem(IDC_CHECK_CH1);
       pBtn->SetCheck(1);

如下图所示：

现在已经完成其基本功能了，还需要加以完善，比如修改CH1~CH4的颜色，还有使其控件能够随着对话框的变大而变大。

右击IPlotX控件建立类向导添加颜色消息函数如下图所示：

在函数中添加代码如下：

switch(pWnd->GetDlgCtrlID())
{
       case IDC_CHECK_CH1:
       pDC->SetTextColor(RGB(255,0,0));         //字体颜色红
       //pDC->SetBkColor(RGB(255,255,200));      //文字背景颜色
       break;
       case IDC_CHECK_CH2:
       pDC->SetTextColor(RGB(255,255,0));         //字体颜色黄
       break;
       case IDC_CHECK_CH3:
       pDC->SetTextColor(RGB(0,0,255));         //字体颜色蓝
       break;
       case IDC_CHECK_CH4:
       pDC->SetTextColor(RGB(255,0,255));         //字体颜色紫
       break;
       }
       // TODO: Return a different brush if the default is not desired
       return hbr;
}

如图所示：

右击IPlotX对话框（非控件上）修改属性如图所示：

右击IPlotX控件建立类向导添加对话框大小改变消息函数如下图所示：

添加函数：（注：其中rect.top=55;为根据控件上方留有的空白大小来确定的与其相关的还有rect.left，rect.bottom可以设置）

CWnd *pWnd;
       pWnd=GetDlgItem(IDC_IPLOTX1);//获取控件
       if(nType==1) return;//如果是窗体最小化则什么都不做
       if(pWnd){//判断是否为空，因为对话框创建时会调用此函数，而当时控件还未创建
       CRect rect;//获取控件变化前大小
       pWnd->GetWindowRect(&rect);
       ScreenToClient(&rect);//将控件大小转换为在对话框中的区域坐标
       rect.right=cx;
       rect.top=55;
       rect.bottom=cy;
       pWnd->MoveWindow(rect);//设置控件大小
       }

如图所示：