DHTMLX 前端框架 建立你的一個應用程序教程(四)--添加一個工具條toolbar


 

工具條例子

 

  樣本如下:

  

 

  這里我們使用的是dhtmlxToolbar 組件。

 

添加工具欄到布局中:

 

  1.使用attachToolbar() 方法初始化頁面 添加代碼到index.html中

  

dhtmlxEvent(window,"load",function(){
    var layout = new dhtmlXLayoutObject(document.body,"2U");
    layout.cells("a").setText("Contacts");
    layout.cells("b").setText("Contact Details");
    layout.cells("b").setWidth(500); 
    var menu = layout.attachMenu();
    menu.setIconsPath("icons/");
    menu.loadStruct("data/menu.xml");
    var toolbar = layout.attachToolbar(); 
});

  

  2.在data文件夾中添加”toolbar.xml“文件

  

 

  3.添加代碼到xml文件中

  

<?xml version="1.0"?>
<toolbar>
   <item id="newContact" type="button" img="add_contact.gif"/>
   <item id="delContact" type="button" text="Delete" img="delete_contact.gif"/>
   <item id="sep01" type="separator"/>         
   <item id="help" type="button" text="Help"/>
</toolbar>

  

  4.設置自定義圖片路徑

  

toolbar.setIconsPath("icons/");

  

  5.用loadStruct() 方法加載數據

  

toolbar.loadStruct("data/toolbar.xml");

 

 

  


注意!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系我们删除。



 
  © 2014-2022 ITdaan.com 联系我们: