DuiLib中ComboBox和List控件使用

DuiLib中ComboBox和List控件使用

Duilib中ComboBox和List控件的使用

1.ComboBox控件使用

Duilib中ComboBox控件的Item类型为 ListLabelElement; Item选中的响应消息为:DUI_MSGTYPE_ITEMSELECT

1.可以直接在Combo标签内添加Item：

<Combo style="trade_common_combo_style" name="notice_type_combo" font="1400" width="168" height="30" dropbox="bordercolor=&quot;#FF4D4D50&quot; bordersize=&quot;1&quot; bkcolor=&quot;#FF4D4D50&quot;"><ListLabelElement text="全部" notifyType="0" height="20" selected="true" /><ListLabelElement text="供股通知" notifyType="1" height="20" /><ListLabelElement text="权益登记" notifyType="2" height="20" /><ListLabelElement text="公开配售" notifyType="3" height="20" /><ListLabelElement text="股份收购" notifyType="4" height="20" />
</Combo>

可以通过这种方式，拿到ComboBox的Item中的自定义”notifyType”属性

std::wstring GetNotifyType(){std::wstring searchType = "-1";if (notice_type_combo_) {auto index = notice_type_combo_->GetCurSel();if (index < 0 || index >= notice_type_combo_->GetCount()) {return searchType;}auto item = notice_type_combo_->GetItemAt(index);if (item == nullptr) {return searchType;}searchType = item->GetCustomAttribute(L"notifyType");}return searchType;
}

实现效果如图:

2.也可以在代码中直接new CListLabelElementUI，然后再添加到ComboBox中：

	if (!combo) return nullptr;CListLabelElementUI* element = new CListLabelElementUI;element->SetName(name.c_str());element->SetText(text.c_str());element->SetFixedHeight(26);combo->Add(element);return element;

2.List控件的使用

1.List控件分为ListHeader和具体的Item;List的Item类型为 ListContainerElement,配置ListHeader如下图所示：

<Style name="list_header_style" value="sepimage=&quot;res='hltrade_login?resproxy_framelist_header_sep.png'&quot; sepwidth=&quot;1&quot; dragable=&quot;false&quot; textcolor=&quot;#FF4D648E&quot; "/><List name="station_list" height="200" itemshowhtml="true" vscrollbar="true" hscrollbar="true" itemshowrowline="true" itemshowcolumnline="true" itemlinecolor="#FFD7D7D7" ><ListHeader height="35" bkcolor="#FFE6ECF7"><ListHeaderItem text="序号" width="60" style="list_header_style"/><ListHeaderItem text="主站名称" width="150" style="list_header_style"/><ListHeaderItem text="主站IP" width="130" style="list_header_style"/><ListHeaderItem text="端口" width="80" style="list_header_style"/><ListHeaderItem text="主站测速(ms)" width="115" style="list_header_style"/><ListHeaderItem text="主站状态" width="120" style="list_header_style"/><ListHeaderItem text="操作" style="list_header_style"/></ListHeader>
</List>

List的Item是在代码中使用XML文件动态创建,然后添加到List控件中去：

CDialogBuilder builder;
CListContainerElementUI* pListItem = static_cast<CListContainerElementUI*>(builder.Create(LIST_ITEM_XML, NULL, this, &m_pm, NULL));
if (pListItem) 
{CLabelUI* number_lbl = static_cast<CLabelUI*>(m_pm.FindSubControlByName(pListItem, _T("number_lbl")));CLabelUI* station_name_lbl = static_cast<CLabelUI*>(m_pm.FindSubControlByName(pListItem, _T("station_name_lbl")));CLabelUI* station_ip_lbl = static_cast<CLabelUI*>(m_pm.FindSubControlByName(pListItem, _T("station_ip_lbl")));CLabelUI* station_port_lbl = static_cast<CLabelUI*>(m_pm.FindSubControlByName(pListItem, _T("station_port_lbl")));CLabelUI* station_test_lbl = static_cast<CLabelUI*>(m_pm.FindSubControlByName(pListItem, _T("station_test_lbl")));CLabelUI* station_status_lbl = static_cast<CLabelUI*>(m_pm.FindSubControlByName(pListItem, _T("station_status_lbl")));station_list_->Add(pListItem);
}

Item的XML描述文件内容如下：

<?xml version="1.0" encoding="utf-8"?>
<Window ><ListContainerElement  name="list_item" height="30"><Label name="number_lbl" align="center"/><Label name="station_name_lbl" align="center"/><Label name="station_ip_lbl" align="center"/><Label name="station_port_lbl" align="center"/><Label name="station_test_lbl" align="center"/><Label name="station_status_lbl" align="center"/><HorizontalLayout childvalign="vcenter"><Control/><Button name="change_station_btn" text="修改" width="50" textcolor="#FF3287FF" disabledtextcolor="#FFC6DEFC" normalimage="file='hltrade_login?resproxy_framemodify_enable.png' source='0,0,14,14' dest='0,8,14,22'" disabledimage="file='hltrade_login?resproxy_framemodify_disable.png' source='0,0,14,14' dest='0,8,14,22'" textpadding="5,0,0,0" /><Button name="delete_station_btn"  text="删除" width="50" textcolor="#FF3287FF" disabledtextcolor="#FFC6DEFC" normalimage="file='hltrade_login?resproxy_framemodify_enable.png' source='0,0,14,14' dest='0,8,14,22'" disabledimage="file='hltrade_login?resproxy_framemodify_disable.png' source='0,0,14,14' dest='0,8,14,22'" textpadding="5,0,0,0" pandding="10,0,0,0"/><Control/></HorizontalLayout></ListContainerElement>
</Window>

效果如图：

再说一点: 如果Item里面的内容是固定不变的，那还可以直接在XML文件中填充List的Item，而不是像上面那样在代码中根据内容的不同，动态去添加 Item；比如：

<List name="sys_list" bkcolor="FF00FF00" itemhotbkcolor="#FFA9A9A9" itemselectedbkcolor="#FFFFFAFA"><ListContainerElement name="menu_Open" height="22" inset="40,0,0,0"><Label text="打开" mouse="false" textcolor="FFFFFFFF"/><Label text="标注" mouse="false" textcolor="FFFFFFFF"/><Label text="删除" mouse="false" textcolor="FFFFFFFF"/></ListContainerElement>
</List>

总结:

List控件可以实现自定义的样式，每一列不一定是一个数据，有可能是按钮，如上例子所示；
ComboBox控件的Item如果在XML文件中写了，就只能是很基础的类型，如第一个例子所示，无法实现像List的Item这种自定义效果； 至于ComboBox能否像List控件一样，使用DialogBuilder来自定义Item，还没有使用过，没有研究过，不知道是否可行,需要研究