在BREW中打造自己的GUI（6）－单选框与复选框的实现

还有一个常用的UI控件是单选框与复选框。可惜BREW也不提供，所以，只能自己做一个了。

先看一下每个选项的结构定义，我们用图片来做那个选中和未选中的显示，这样才能做出更多更美观的界面效果，所以在结构中有两个成员pCkImage和pNrImage，同时，isSelected用来记录此项是否被选中：

typedefstruct
...{
intnItemID;
AECHAR*pText;

IImage*pCkImage;
IImage*pNrImage;

constchar*pszResFile;
uint16wCkImage;
uint16wNrImage;

booleanisSelected;
}TGBOption;

而整个控件的结构如下：

struct_IGButton...{

constAEEVTBL(IGButton)*pvt;

uint32m_nRefs;
IShell*m_pIShell;
IDisplay*m_pIDisplay;
IModule*m_pIModule;

booleanm_isActive;
AEERectm_Rect;

uint32props;

AECHAR*pTitle;
AEEFonttitleFont;
RGBVALtitleColor;

IImage*pBkImage;

TQueueList*pOptionList;
intm_Index;

};

同样是用 TQueueList来保存一个选项的链表，当前少不了m_Index当前项了。

需要的接口函数定义如下：

AEEINTERFACE(IGButton)
...{
DECLARE_IBASE(IGButton)

DECLARE_ICONTROL(IGButton)

boolean(*SetTitle)(IGButton*po,AECHAR*szText,AEEFontfont,RGBVALcolor);
boolean(*SetBkImage)(IGButton*po,IImage*img);
boolean(*AddOption)(IGButton*po,TGBOption*opt);
boolean(*IsChecked)(IGButton*po,intidx);
int(*GetSel)(IGButton*po);
int(*GetItemCount)(IGButton*po);

};

下面来看看实现，同样的先看HandleEvent，需要处理上下方向键，修改m_Index以改变当前项；处理SELECT键处理选中/取消选中的操作。

在Redraw函数中呢？遍历一下那个pOptionList链表，根据每个项是否选中，绘制出来即可。

staticbooleanIGButton_Redraw(IGButton*pMe)
...{
inti,j,height,h,a,b;
intxx,yy,dxx,dyy;
AEERectrec;
AEEImageInfoinfIc;
RGBVALoldColor;

TQueueList*p=pMe->pOptionList;

h=IDISPLAY_GetFontMetrics(pMe->m_pIDisplay,AEE_FONT_NORMAL,&a,&b);

IDISPLAY_EraseRect(pMe->m_pIDisplay,&pMe->m_Rect);

if(pMe->pBkImage)
...{
IIMAGE_SetDrawSize(pMe->pBkImage,pMe->m_Rect.dx,pMe->m_Rect.dy);
IIMAGE_Draw(pMe->pBkImage,pMe->m_Rect.x,pMe->m_Rect.y);
}

oldColor=IDISPLAY_SetColor(pMe->m_pIDisplay,CLR_USER_TEXT,MAKE_RGB(0,0,0));

i=0;
height=pMe->m_Rect.y;
while(p)
...{
IImage*img;
TGBOption*pData=(TGBOption*)p->pData;

if(pData->isSelected)
img=pData->pCkImage;
else
img=pData->pNrImage;

ZEROAT(&infIc);
if(img)
...{
IIMAGE_GetInfo(img,&infIc);
IIMAGE_Draw(img,pMe->m_Rect.x,height);
}

xx=pMe->m_Rect.x+infIc.cx;
yy=height+(infIc.cy-h)/2;
dxx=pMe->m_Rect.x+pMe->m_Rect.dx-xx;
dyy=h;
SETAEERECT(&rec,xx,yy,dxx,dyy);
IDISPLAY_DrawText(pMe->m_pIDisplay,AEE_FONT_NORMAL,pData->pText,-1,xx,yy,&rec,IDF_TEXT_TRANSPARENT);

if(i==pMe->m_Index)
...{
xx=pMe->m_Rect.x;
yy=height;
dxx=infIc.cx+IDISPLAY_MeasureText(pMe->m_pIDisplay,AEE_FONT_NORMAL,pData->pText);;
dyy=infIc.cy;
SETAEERECT(&rec,xx,yy,dxx,dyy);

IDISPLAY_DrawRect(pMe->m_pIDisplay,&rec,MAKE_RGB(0,0,250),0,IDF_RECT_FRAME);
}

height+=infIc.cy;

p=p->pNext;
i++;

}


IDISPLAY_Update(pMe->m_pIDisplay);
IDISPLAY_SetColor(pMe->m_pIDisplay,CLR_USER_TEXT,oldColor);

returnTRUE;
}

还有一件事，如果在程序中取到这个组件的结果呢？如果是单选就可以直接GetSel了，如果是复选则循环一下一个个判断是否选中IsChecked即可：

staticbooleanIGButton_IsChecked(IGButton*pMe,intidx)
...{
if(pMe->props&0x01==GBTN_STYLE_CHECK)
...{
TGBOption*pData=(TGBOption*)Queue_Get(pMe->pOptionList,idx);
if(pData)
...{
returnpData->isSelected;
}
}
returnFALSE;
}
staticintIGButton_GetSel(IGButton*pMe)
...{
if((pMe->props&0x01)==GBTN_STYLE_RADIO)
...{
TQueueList*p=pMe->pOptionList;
//inti=0;
while(p)
...{
TGBOption*pData=(TGBOption*)p->pData;
if(pData&&pData->isSelected)
returnpData->nItemID;
//i+=1;
p=p->pNext;
}
}
return-1;
}

OK，基本上搞定。