button控件:工控软件图形界面-控件实现（报警Led/状态Led/Button控件）

介绍
工控软件Software开发过程中Led是非常重要个表现形式环节如何能够直观反映模拟工控现场各种按钮或者指示灯是非常重要种人机软件Software实现思路方法这里提供静态Led和按钮两种Control控件能够更好模拟现场环境增加人机界面人性化希望对寻求相关开发人有帮助

前段时间我在vchelp专栏发表了些有关工控Control控件编写思路方法文章这些时间直有很多朋友给我来邮件感谢很多网络朋友对我支持同时很多人提出:他们在使用工控现场模拟按钮或者指示灯等Control控件中发现可能有关这些方面Control控件不是很多或者不是很形象现在正好项目空闲有些时间在研究了许多工控软件Software界面表现形式和开源代码实现基础上完成了现在两个Control控件编写读者如果有兴趣可以在上面进行扩展完成更多更好效果
Control控件演示效果见下:提供了静态Led效果和按钮指示效果其中静态LedControl控件提供了On(打开) Off(关闭) Flash(闪烁) 3种效果


静态LedControl控件采用重绘背景形式实现根据设定状态进行区别背景采用绘制外框内框内部灯渐变思路方法进行绘制这样能够形成实现效果上凹凸立体效果具体绘制思路方法可以见下面代码
方形Control控件绘制思路方法
voidCLightCtrl::DrawStateRectangle(CDC*pDC,CRect&rect)
{
CPenpNewPen,*pOldPen;
Color_R,Color_G,Color_B;

Color_R=()GetRValue(m_BorderColor)/m_nBorderWidth;
Color_G=()GetGValue(m_BorderColor)/m_nBorderWidth;
Color_B=()GetBValue(m_BorderColor)/m_nBorderWidth;

pNewPen.CreatePen(PS_SOLID,0,RGB(255,255,255));
pOldPen=(CPen*)pDC->SelectObject(&pNewPen);

//画外框
for(i=0;i<m_nBorderWidth;i)
{
pNewPen.DeleteObject;
pNewPen.CreatePen(PS_SOLID,0,RGB(Color_R*i,Color_G*i,Color_B*i));
pDC->SelectObject(&pNewPen);
pDC->MoveTo(i,i);
pDC->LineTo(i+rect.Width-2*i,i);
pDC->LineTo(i+rect.Width-2*i,i+rect.Height-2*i);
pDC->LineTo(i,i+rect.Height-2*i);
pDC->LineTo(i,i);
}

//画内框
(m_enumStateIS_OFF)
{
Color_R=(0.6*()GetRValue(m_LightOffColor)/m_nLightWidth);
Color_G=(0.6*()GetGValue(m_LightOffColor)/m_nLightWidth);
Color_B=(0.6*()GetBValue(m_LightOffColor)/m_nLightWidth);
}
(m_enumStateIS_ON) [Page]
{
Color_R=(0.6*()GetRValue(m_LightOnColor)/m_nLightWidth);
Color_G=(0.6*()GetGValue(m_LightOnColor)/m_nLightWidth);
Color_B=(0.6*()GetBValue(m_LightOnColor)/m_nLightWidth);
}

for(i=0;i<m_nLightWidth;i)
{
pNewPen.DeleteObject;
(m_enumStateIS_OFF)
{
pNewPen.CreatePen(PS_SOLID,0,RGB(GetRValue(m_LightOffColor)*0.4+Color_R*i,
GetGValue(m_LightOffColor)*0.4+Color_G*i,


GetBValue(m_LightOffColor)*0.4+Color_B*i));
}
(m_enumStateIS_ON)
{
pNewPen.CreatePen(PS_SOLID,0,RGB(GetRValue(m_LightOnColor)*0.4+Color_R*i,
GetGValue(m_LightOnColor)*0.4+Color_G*i,
GetBValue(m_LightOnColor)*0.4+Color_B*i));
}

pDC->SelectObject(&pNewPen);
pDC->MoveTo(i+m_nBorderWidth,i+m_nBorderWidth);
pDC->LineTo(i+m_nBorderWidth+rect.Width-2*(i+m_nBorderWidth),
i+m_nBorderWidth);
pDC->LineTo(i+m_nBorderWidth+rect.Width-2*(i+m_nBorderWidth),
i+m_nBorderWidth+rect.Height-2*(i+m_nBorderWidth));
pDC->LineTo(i+m_nBorderWidth, [Page]
i+m_nBorderWidth+rect.Height-2*(i+m_nBorderWidth));
pDC->LineTo(i+m_nBorderWidth,i+m_nBorderWidth);
}

//填充灯
CBrushpBackBrush,*pOldBrush;
(m_enumStateIS_OFF)
{
pBackBrush.CreateSolidBrush(m_LightOffColor);
}
(m_enumStateIS_ON)
{
pBackBrush.CreateSolidBrush(m_LightOnColor);
}
pOldBrush=(CBrush*)pDC->SelectObject(&pBackBrush);
pDC->FillRect(CRect(m_nBorderWidth+m_nLightWidth,
m_nBorderWidth+m_nLightWidth,
rect.Width-(m_nBorderWidth+m_nLightWidth)+2,
rect.Height-(m_nBorderWidth+m_nLightWidth)+2),
&pBackBrush);
pDC->SelectObject(pOldBrush);
pBackBrush.DeleteObject;

//写降标题
pDC->SetTextColor(RGB(255,255,255));
pDC->SetBkMode(TRANSPARENT);
CRectrcTitle(m_nBorderWidth+m_nLightWidth,
m_nBorderWidth+m_nLightWidth,
rect.Width-(m_nBorderWidth+m_nLightWidth)+2,


rect.Height-(m_nBorderWidth+m_nLightWidth)+2);
pDC->DrawText(m_strCaption,&rcTitle,DT_CENTER|DT_SINGLELINE|DT_VCENTER);

//恢复设置
pDC->SelectObject(pOldPen);
pNewPen.DeleteObject;
}

圆形Led绘制原理大致同方形Led绘制详细思路方法就不在叙述可以参考代码

按钮绘制原理采用方形按钮绘制外观思路方法进行采用按钮自绘思路方法根据按钮当前鼠标状态进行区别状态绘制这里增加了鼠标选中和非选中效果来模拟现场按钮按下效果具体可以见方形按钮状态绘制
voidCLightButton::DrawStateRectangle(LPDRAWITEMSTRUCTlpDrawItemStruct)
{
CDC*pDC=CDC::FromHandle(lpDrawItemStruct->hDC); [Page]
CRectm_rectClient=lpDrawItemStruct->rcItem;
UINTnState=lpDrawItemStruct->itemState;

CPenpNewPen,*pOldPen;
Color_R,Color_G,Color_B;

Color_R=()GetRValue(m_BorderColor)/m_nBorderWidth;
Color_G=()GetGValue(m_BorderColor)/m_nBorderWidth;
Color_B=()GetBValue(m_BorderColor)/m_nBorderWidth;

pNewPen.CreatePen(PS_SOLID,0,RGB(255,255,255));
pOldPen=(CPen*)pDC->SelectObject(&pNewPen);

CRectrcTitle(0,0,m_rectClient.Width,m_rectClient.Height);

//画外框
for(i=0;i<m_nBorderWidth;i)
{
Color_R=()255/m_nBorderWidth;
Color_G=()255/m_nBorderWidth;
Color_B=()255/m_nBorderWidth;

pDC->Draw3dRect(m_rectClient.left+i,
m_rectClient.top+i,
m_rectClient.Width-2*i,
m_rectClient.Height-2*i,
RGB(255-Color_R*i,255-Color_G*i,255-Color_B*i),
RGB(Color_R*i,Color_G*i,Color_B*i));

}

//画内框
Color_R=(0.6*()GetRValue(m_ButtonColor)/m_nLightWidth);
Color_G=(0.6*()GetGValue(m_ButtonColor)/m_nLightWidth);
Color_B=(0.6*()GetBValue(m_ButtonColor)/m_nLightWidth);

for(i=0;i<m_nLightWidth;i)
{
(lpDrawItemStruct->itemState&ODS_SELECTED)
{
pNewPen.DeleteObject;
pNewPen.CreatePen(PS_SOLID,0,RGB(GetRValue(m_ButtonColor)*0.4+Color_R*(m_nLightWidth-i),
GetGValue(m_ButtonColor)*0.4+Color_G*(m_nLightWidth-i), [Page]
GetBValue(m_ButtonColor)*0.4+Color_B*(m_nLightWidth-i)));



rcTitle=CRect(4,2,m_rectClient.Width,m_rectClient.Height);
}

{
pNewPen.DeleteObject;
pNewPen.CreatePen(PS_SOLID,0,RGB(GetRValue(m_ButtonColor)*0.4+Color_R*i,
GetGValue(m_ButtonColor)*0.4+Color_G*i,
GetBValue(m_ButtonColor)*0.4+Color_B*i));

}

pDC->SelectObject(&pNewPen);
pDC->MoveTo(i+m_nBorderWidth,i+m_nBorderWidth);
pDC->LineTo(i+m_nBorderWidth+m_rectClient.Width-2*(i+m_nBorderWidth),
i+m_nBorderWidth);
pDC->LineTo(i+m_nBorderWidth+m_rectClient.Width-2*(i+m_nBorderWidth),
i+m_nBorderWidth+m_rectClient.Height-2*(i+m_nBorderWidth));
pDC->LineTo(i+m_nBorderWidth,
i+m_nBorderWidth+m_rectClient.Height-2*(i+m_nBorderWidth));
pDC->LineTo(i+m_nBorderWidth,i+m_nBorderWidth);
}

//填充按钮
pDC->FillSolidRect(m_nBorderWidth+m_nLightWidth,
m_nBorderWidth+m_nLightWidth,
m_rectClient.Width-2*(m_nBorderWidth+m_nLightWidth)+2,
m_rectClient.Height-2*(m_nBorderWidth+m_nLightWidth)+2, [Page]
m_ButtonColor);
pDC->SelectObject(&pNewPen);

//写降标题
CFontpNewFont,*pOldFont;
pNewFont.CreatePoFont(120,\"Impat\",pDC);
pOldFont=(CFont*)pDC->SelectObject(&pNewFont);
pDC->SetTextColor(RGB(255,255,255));
pDC->SetBkMode(TRANSPARENT);
GetWindowText(m_strCaption,MAXNAMELENGTH);
pDC->DrawText(m_strCaption,&rcTitle,DT_CENTER|DT_SINGLELINE|DT_VCENTER);

//恢复设置
pDC->SelectObject(pOldFont);
pNewFont.DeleteObject;
pDC->SelectObject(pOldPen);
pNewPen.DeleteObject;
}

使用思路方法:在要使用Control控件界面上将相关Control控件变量定义成完成Control控件变量对象然后根据Control控件接口进行先关参数设定就可以完成效果了
这里Led和按钮都采用同样展现形式进行绘制如果各位有更好或者更美观实现思路方法可以在上面基础上完成也希望您能够将您效果和源代码共享出来希望能和我联系.
QQ:5516853
EM:[email protected]

延伸阅读