nim_duilib(11)之menu（1）
阿新 • • 發佈：2020-12-11
introduction
xml檔案新增程式碼
基於上一篇, 繼續向basic.xml中新增下面的程式碼。 xml完整原始碼在文末。
這段程式碼新增到最小化按鈕的上面
<HBox width="stretch" height="35" bkcolor="bk_wnd_lightcolor"> <Control /> <!--設定按鈕--> <Button class="btn_wnd_settings" name="settings" margin="4,6,0,0"/> <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>
核心程式碼是
<!--設定按鈕-->
<Button class="btn_wnd_settings" name="settings" margin="4,6,0,0"/>
專案檔案配置
menu控制元件來自另一個專案ui_components, 而ui_component又依賴專案libcef_dll_wrapper。libcef_dll_wrapper位於資料夾third_party下。
stage 1
從原始碼目錄拷貝ui_component和libcef_dll_wrapper和libs資料夾到先前建立好的kit的資料夾下，此時目錄結構如下：
.kit ├─base ├─build ├─duilib ├─libs ├─third_party └─ui_components
stage 2
習慣將專案輸出到VS預設輸出的目錄Debug, 所以將專案ui_components、libcef_dll_wrapper的輸出目錄和中間目錄改為如下：
| name | value |
|---|---|
| 輸出目錄 | $(SolutionDir)$(Configuration)\ |
| 中間目錄 | $(Configuration)\ |
stage 3
設定ui_components專案連結lib目錄指向 kit\libs\。 開啟ui_components屬性->庫管理器->常規->附加庫目錄->編輯，改為下面的值：
$(SolutionDir)kit\libs\
Note
stage 4
為什麼要做上面的配置？ 因為 專案ui_components需要依賴libs目錄下的nim_libcef庫
程式碼中關聯
BasicForm.h
- 開啟BasicForm.h，類中新增下面的程式碼用於關聯介面控制元件。
// settings按鈕
ui::Button* psettings_;
監聽選擇子項事件
類中繼續新增下面的程式碼，用於監聽滑塊的值發生變化
// settings按鈕點選事件
bool OnSettingsBtnClicked(ui::EventArgs* msg);
BasicForm.cpp
InitWindow函式
- 轉到BasicForm.cpp，找到 InitWindow 函式，向其增加下面的程式碼
void BasicForm::InitWindow()
{
......
// 12.關聯設定按鈕
//----------------------------------------------------------------------------------------
psettings_ = dynamic_cast<ui::Button*>(FindControl(L"settings"));
// 關聯點選事件
if (psettings_)
{
psettings_->AttachClick(nbase::Bind(&BasicForm::OnSettingsBtnClicked, this, std::placeholders::_1));
}
}
OnSettingsBtnClicked
OnSettingsBtnClicked函式原始碼如下：
bool BasicForm::OnSettingsBtnClicked(ui::EventArgs* msg)
{
// 點選設定按鈕，彈出選單
RECT rect = msg->pSender->GetPos();
ui::CPoint point;
point.x = rect.left - 175;
point.y = rect.top + 10;
ClientToScreen(m_hWnd, &point);
nim_comp::CMenuWnd* pmenu = new(std::nothrow) nim_comp::CMenuWnd(NULL);
if (pmenu)
{
ui::STRINGorID xml(L"settings_menu.xml");
pmenu->Init(xml, _T("xml"), point);
}
return false;
}
執行結果
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_settings" name="settings" margin="4,6,0,0"/>
<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'"/>
<HBox>
<RichEdit class="simple input" name="rich_edit_1" text="輸入演示" height="30" margin="0,3" padding="6,6,6" promptmode="true" prompttext="Single line text control" promptcolor="lightcolor"/>
<CheckBox class="checkbox_font12" name="rich_edit_readonly" text="read only" margin="0,5,0,10"/>
</HBox>
</VBox>
<HBox>
<VBox>
<!-- Progress -->
<HBox margin="0,10" height="32">
<Progress class="progress_blue" name="progress" value="0" margin="10"/>
</HBox>
<!-- Slider -->
<HBox margin="0,0,0,10" height="32">
<Slider class="slider_green" name="slider" value="0" margin="10"/>
</HBox>
</VBox>
<VBox width="120">
<CircleProgress name="circle_progress" circular="true" height="80" width="80"
circlewidth="10" bgcolor="gray" fgcolor="green" value="0" clockwise="true" min="1" max="100" margin="10"
textpadding="10,32,10,10" normaltextcolor="darkcolor" indicator="logo_18x18.png"/>
</VBox>
</HBox>
</HBox>
</VBox> <!--下面是中間的控制元件 結束-->
</VBox>
</Window>