nim_duilib（8）之combo

introduction

• 更多控件用法，请参考 here 和 源码。
• 本文的代码基于这里
• combo的更多用法，请参考源码中combo.h提供的函数，文末添加其提供的公有函数

xml文件添加代码

基于上一篇, 继续向basic.xml中添加下面关于combo的代码。 xml完整源码在文末。

<!--第二行控件开始-->
<HBox height="85">
<VBox>
	<!--combobox-->
	<Combo class="list" name="combo" height="30" margin="0,12,0,0" padding="6" bkimage="file='../public/combo/normal.png' corner='5,5,30,5'"/>
</VBox>
</HBox>

这里，创建了一个combo控件，背景来自global.xml同级目录下public文件夹中的资源。

代码中关联

BasicForm.h

• 打开BasicForm.h，类中添加下面的代码用于关联界面控件。

/// combobox
ui::Combo	*pcombo_;

监听选择子项事件

类中继续添加下面的代码，用于监听当选择下拉选项

	// 监听combo子项被选择事件
	bool OnComboItemSelected(ui::EventArgs* mgs);

BasicForm.cpp

InitWindow函数

• 转到BasicForm.cpp，找到 InitWindow 函数，向其增加下面的代码

void BasicForm::InitWindow()
{
  	......
	// 7.关联combo控件
	//----------------------------------------------------------------------------------------
	pcombo_ = dynamic_cast<ui::Combo*>(FindControl(L"combo"));
	// 增加下拉选项
	if (pcombo_)
	{
		for (auto index = 0; index < 5; ++index)
		{
			ui::ListContainerElement* pelement = new(std::nothrow) ui::ListContainerElement;
			if (pelement)
			{
				// 设置属性
				pelement->SetClass(L"listitem");
				pelement->SetFixedHeight(30);
				pelement->SetBkColor(L"white");
				pelement->SetTextPadding({ 6,0,6,0 });
				pelement->SetText(nbase::StringPrintf(L"index %d", index));

				pcombo_->Add(pelement);
			}
			else
			{
				;
			}
		}

		// 添加结束，设置默认选择第一项
		int count = pcombo_->GetCount();
		if (0 < count)
			pcombo_->SelectItem(0);

		// 设置向上弹出下拉选项
		pcombo_->SetPopupTop(true);

		// 设置监听下拉选项被监听
		pcombo_->AttachSelect(nbase::Bind(&BasicForm::OnComboItemSelected, this, std::placeholders::_1));
	}
}

OnComboItemSelected

OnComboItemSelected函数源码如下：

bool BasicForm::OnComboItemSelected(ui::EventArgs* msg)
{
	if (pcombo_)
	{
		std::wstring str = std::wstring(L"选择的文本：") + pcombo_->GetText() + std::wstring(L"\n\n");
		LPCWSTR result = str.c_str();
		OutputDebugString(result);

		str = std::wstring(L"当前索引：") + nbase::StringPrintf(L"%d\n\n", pcombo_->GetCurSel()) ;
		result = str.c_str();
		OutputDebugString(result);
	}

	return false;
}

运行结果

combo的其他公有函数

其公有的函数如下，包括增加和删除.....

	/// 重写父类方法，提供个性化功能，请参考父类声明
	virtual bool Add(Control* pControl) override;
	virtual bool Remove(Control* pControl) override;
	virtual bool RemoveAt(std::size_t iIndex) override;
	virtual void RemoveAll() override;
	virtual void Activate() override;
	virtual void SetAttribute(const std::wstring& strName, const std::wstring& strValue) override;
	virtual void PaintText(IRenderContext* pRender) override;

	/**
	 * @brief 获取当前选择项文本
	 * @return 返回当前选择项文本
	 */
    std::wstring GetText() const;

	/**
	 * @brief 获取当前所属的 List 对象
	 * @return 返回所属的 List 对象指针
	 */
	ListBox* GetListBox() { return m_pLayout.get(); }

	/**
	 * @brief 获取下拉框属性信息
	 * @return 返回字符串形式的属性信息
	 */
    std::wstring GetDropBoxAttributeList();

	/**
	 * @brief 设置下拉框的属性信息
	 * @param[in] pstrList 转义后的 XML 格式属性列表
	 * @return 无
	 */
    void SetDropBoxAttributeList(const std::wstring& pstrList);

	/**
	 * @brief 获取下拉框容器大小
	 * @return 返回容器大小
	 */
    CSize GetDropBoxSize() const;

	/**
	 * @brief 设置下拉框容器大小
	 * @param[in] szDropBox 要设置的大小信息
	 * @return 无
	 */
    void SetDropBoxSize(CSize szDropBox);

	/**
	 * @brief 设置 Combobox 是否向上弹出
	 * @param[in] top 为 true 则向上弹出，false 为默认向下弹出
	 * @return 无
	 */
	void SetPopupTop(bool top) { m_bPopupTop = top; };

	/**
	 * @brief 判断 Combobox 弹出模式是否是向上弹出
	 * @return 返回 true 表示向上弹出，否则为 false
	 */
	bool IsPopupTop() const { return m_bPopupTop; };

	/**
	 * @brief 选择一个子项
	 * @param[in] iIndex 要选择的子项索引
	 * @return 返回 true 表示成功，否则为 false
	 */
	bool SelectItem(int iIndex);

	/**
	 * @brief 获取指定索引下的子项控件
	 * @param[in] iIndex 要获取的子项索引
	 * @return 返回控件指针
	 */
	Control* GetItemAt(int iIndex);

	/**
	 * @brief 获取当前选择项索引
	 * @return 返回当前选择项索引
	 */
	int GetCurSel() const { return m_iCurSel; }

	/**
	 * @brief 获取所有子项数量
	 * @return 返回所有子项数量
	 */
	virtual int GetCount() const { return m_pLayout->GetCount(); }

	/**
	 * @brief 监听子项被选择事件
	 * @param[in] callback 子项被选择后触发的回调函数
	 * @return 无
	 */
	void AttachSelect(const EventCallback& callback) { m_pLayout->AttachSelect(callback); }

xml完整源码

<?xml version="1.0" encoding="UTF-8"?>
<Window size="900,600" caption="0,0,0,35">
  <VBox bkcolor="bk_wnd_darkcolor">
    <HBox width="stretch" height="35" bkcolor="bk_wnd_lightcolor">
      <Control />
        <Button class="btn_wnd_min" name="minbtn" margin="4,6,0,0" />
        <Box width="21" margin="4,6,0,0">
          <Button class="btn_wnd_max" name="maxbtn"/>
          <Button class="btn_wnd_restore" name="restorebtn" visible="false"/>
        </Box>
      <Button class="btn_wnd_close" name="closebtn" margin="4,6,8,0"/>
    </HBox>

    <!--下面是中间的控件-->
    <VBox padding="30, 30, 30, 30" >
      <HBox height="120">
        <VBox>
          <!-- Buttons -->
          <Button class="btn_global_blue_80x30" name="btn_blue" text="blue" />
          <Button class="btn_global_white_80x30" name="btn_white" text="white"/>
          <Button class="btn_global_red_80x30" name="btn_red" text="red"/>
        </VBox>

        <!--checkbox-->
        <VBox>
          <CheckBox class="checkbox_font12" name="checkbox1" text="checkbox1" margin="0,5,0,10" selected="true"/>
          <CheckBox class="checkbox_font12" name="checkbox2" text="checkbox2" margin="0,5,0,10"/>
          <CheckBox class="checkbox_font12" name="checkbox3" text="checkbox3" margin="0,5,0,10"/>
        </VBox>

        <!-- option-->
        <VBox>
          <Option class="circle_option_2" name="option1" group="option_group" text="option1" margin="0,3,0,10" selected="true"/>
          <Option class="circle_option_2" name="option2" group="option_group" text="option2" margin="0,3,0,10"/>
          <Option class="circle_option_2" name="option3" group="option_group" text="option3" margin="0,3,0,10"/>
        </VBox>

        <HBox>
          <!-- List -->
          <VListBox class="list" name="list" padding="5,3,5,3">
          </VListBox>
          <VBox>

            <!-- Buttons -->
            <CheckBox class="checkbox_font12" name="list_checkbox_add_to_top" text="add to top" margin="0,5,0,10"/>
            <Button class="btn_global_blue_80x30" name="list_btn_add" text="add" />

            <CheckBox class="checkbox_font12" name="list_checkbox_remove_all" text="del all?" margin="0,5,0,10"/>
            <Button class="btn_global_white_80x30" name="list_btn_remove" text="remove"/>
          </VBox>
        </HBox>

        <!-- TreeView -->
        <TreeView class="list" name="tree" padding="5,3,5,3" margin="20">
        </TreeView>
      </HBox>

      <!--第二行控件开始-->
      <HBox height="85">
        <VBox>
          <!--combobox-->
          <Combo class="list" name="combo" height="30" margin="0,12,0,0" padding="6" bkimage="file='../public/combo/normal.png' corner='5,5,30,5'"/>
        </VBox>
      </HBox>

    </VBox> <!--下面是中间的控件 结束-->
  </VBox>
</Window>