码迷,mamicode.com
首页 > Web开发 > 详细

DHTMLX 前端框架 建立你的一个应用程序教程(四)--添加一个工具条toolbar

时间:2014-10-18 00:36:11      阅读:1076      评论:0      收藏:0      [点我收藏+]

标签:style   blog   http   color   io   ar   使用   sp   文件   

 

工具条例子

 

  样本如下:

  bubuko.com,布布扣

 

  这里我们使用的是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“文件

  bubuko.com,布布扣

 

  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");

 

 bubuko.com,布布扣

  

DHTMLX 前端框架 建立你的一个应用程序教程(四)--添加一个工具条toolbar

标签:style   blog   http   color   io   ar   使用   sp   文件   

原文地址:http://www.cnblogs.com/DemoLee/p/4032256.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!