Re: making tree with custom tree view dynamicaly (c++)

понедельник, 3 декабря 2012 г., 4:57:43 UTC+4 пользователь reverendlinux написал:
> On Nov 25, 11:18 am, YuLo <[email protected]> wrote:
> 
> > воскресенье, 25 ноября 2012 г., 20:23:05 UTC+4 пользователь reverendlinux написал:
> 
> >
> 
> >
> 
> >
> 
> >
> 
> >
> 
> >
> 
> >
> 
> >
> 
> >
> 
> > > On Nov 25, 3:42 am, Neil <[email protected]> wrote:
> 
> >
> 
> > > > YuLo wrote:
> 
> >
> 
> > > > >i'd like to make a new tab in tabbox with tree widget dynamicaly.
> 
> >
> 
> > > > >I think i can insert nessesary xul tags in the DOM document.
> 
> >
> 
> > > > >But where can i get TreeBoxObject for this tree to assign my custom tree view object(XPCOM c++) to its view property.
> 
> >
> 
> > > > In JavaScript, simply write treeElement.view = theView;
> 
> >
> 
> > > > In C++, you need to QI your tree element to nsIDOMXULElement, then call
> 
> >
> 
> > > > GetBoxObject, then QI that to nsITreeBoxObject, then call SetView.
> 
> >
> 
> > > > --
> 
> >
> 
> > > > Warning: May contain traces of nuts.
> 
> >
> 
> > > Neil,
> 
> >
> 
> > > I've been working on something similar and gave up because I couldn't
> 
> >
> 
> > > get the trees to show in the tabboxes when the trees were created
> 
> >
> 
> > > dynamically.  My original post here in the forums is linked below.
> 
> >
> 
> > > I'm using the approach you mentioned above but no luck.  I'm posting
> 
> >
> 
> > > this because in hopes the original poster doesn't run into the same
> 
> >
> 
> > > issue.
> 
> >
> 
> > >  - John
> 
> >
> 
> > > Trees in Tabs? -
> 
> >
> 
> > >http://groups.google.com/group/mozilla.dev.tech.xul/browse_thread/thr...
> 
> >
> 
> > reverendlinux,
> 
> > Neil wrote it should work.
> 
> > I think you made a mistake.
> 
> > At first glance you wrote many times
> 
> > <treechildren id="child"> !!
> 
> > id should be unique.
> 
> > BTW, i meant "dynamicaly" to create new tab programmaticaly.
> 
> 
> 
> Yulo,
> 
> 
> 
> Thanks for pointing that out.  But even with that correction I still
> 
> can't get the tree in the tab populated dynamically via a function.
> 
> Take away the tab, and the function works.  So this one still has me
> 
> beat.
> 
> 
> 
> Thanks again,
> 
>  - reverendlinux

When i started with tree i made some tests in JS.
Then i work in c++.
I've found my old tests compiled from samples from internet.
Here are test with 2 tabs with trees, may be it helps you...
==============

<?xml version="1.0" encoding="utf-8"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd"> 

<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" onload="setView();" width="500px" height="500px" flex="1">
  <script type="application/x-javascript" src="chrome://test1/content/test.js"/>

<tabbox flex="1" align="stretch" handleCtrlPageUpDown="true" handleCtrlTab="true">
 <tabs>
  <tab label="tab2" flex="1"/>
  <tab label="tab4" flex="1"/> </tabs>
 <tabpanels flex="1">
  <tabpanel flex="1">
   <tree id="myTree2" seltype="cell" flex="1">
    <treecols>
     <treecol id="namecol" label="Name" width="105"/>
     <splitter resizeafter="closest" state="open" class="tree-splitter"/>
     <treecol id="datecol" label="Date" flex="1"/> </treecols> <treechildren/> </tree> </tabpanel>
  <tabpanel flex="1">
   <tree id="myTree4" pack="start" orient="vertical" editable="true" seltype="cell" flex="1">
    <treecols>
     <treecol id="namecol41" primary="true" label="mod" flex="1"/>
     <treecol id="namecol42" label="code" flex="1"/>
     <treecol id="namecol43" label="name" width="105" flex="1"/> </treecols>
    <treechildren/> </tree> </tabpanel> </tabpanels> </tabbox> </window>

---------------------------------

  var treeView2 = {
    rowCount : 10000,
    getCellText : function(row,column){
      if (column.id == "namecol")
        return "Row " + row;
      else
        return "February 20";},
    setTree: function(treebox){this.treebox = treebox;},
    isContainer: function(row){return false;},
    isSeparator: function(row){return false;},
    isSorted: function(row){return false;},
    getLevel: function(row){return 0;},
    getImageSrc: function(row,col){return null;},
    getRowProperties: function(row,props){},
    getCellProperties: function(row,col,props){},
    getColumnProperties: function(colid,col,props){}}
  var treeView4 = {
    childData:{
      Solids: ["Silver", "Gold", "Lead"],
      Liquids: ["Mercury"],
      Gases: ["Helium", "Nitrogen"] },
    visibleData:[
      ["Solids", true, false],
      ["Liquids", true, false],
      ["Gases", true, false] ],

    treeBox: null,
    selection: null,
    get rowCount()                     { return this.visibleData.length; },
    setTree: function(treeBox)         { this.treeBox = treeBox; },
    getCellText: function(idx, column) { return this.visibleData[idx][0]; },
    isContainer: function(idx)         { return this.visibleData[idx][1]; },
    isContainerOpen: function(idx)     { return this.visibleData[idx][2]; },
    isContainerEmpty: function(idx)    { return false; },
    isSeparator: function(idx)         { return false; },
    isSorted: function()               { return false; },
    isEditable: function(idx, column)  { return false; },
    getParentIndex: function(idx) {
      if (this.isContainer(idx)) return -1;
      for (var t = idx - 1; t >= 0 ; t--) {
        if (this.isContainer(t)) return t; } },
    getLevel: function(idx) {
      if (this.isContainer(idx)) return 0;
      return 1; },
    getImageSrc: function(idx, column) {},
    getProgressMode : function(idx,column) {},
    getCellValue: function(idx, column) {},
    cycleHeader: function(col, elem) {},
    selectionChanged: function() {},
    cycleCell: function(idx, column) {},
    performAction: function(action) {},
    performActionOnCell: function(action, index, column) {},
    getRowProperties: function(idx, prop) {},
    getCellProperties: function(idx, column, prop) {},
    getColumnProperties: function(column, element, prop) {},
    toggleOpenState: function(idx) {
      var item = this.visibleData[idx];
      
			if (!item[1]) return;
      if (item[2]){
        item[2] = false;

        var thisLevel = this.getLevel(idx);
        var deletecount = 0;
        for(var t = idx + 1; t < this.visibleData.length; t++) {
          if (this.getLevel(t) > thisLevel) deletecount++;
          else break; }
        if (deletecount) {
          this.visibleData.splice(idx + 1, deletecount);
          this.treeBox.rowCountChanged(idx + 1, -deletecount); } }
      else{
        item[2] = true;

        var label = this.visibleData[idx][0];
        var toinsert = this.childData[label];
        for (var i = 0; i < toinsert.length; i++) {
          this.visibleData.splice(idx + i + 1, 0, [toinsert[i], false]); }
        this.treeBox.rowCountChanged(idx + 1, toinsert.length); }
			Components.utils.reportError("Check:" + this.treeBox);
      this.treeBox.invalidateRow(idx); },
    hasNextSibling: function(idx, after) {
      var thisLevel = this.getLevel(idx);
      for(var t = after + 1; t < this.visibleData.length; t++){
        var nextLevel = this.getLevel(t);
        if (nextLevel == thisLevel) return true;
        if (nextLevel < thisLevel) break; }
      return false; } }
  function setView(){
    document.getElementById('myTree2').view=treeView2;
    document.getElementById('myTree4').view=treeView4; }
_______________________________________________
dev-tech-xul mailing list
[email protected]
https://lists.mozilla.org/listinfo/dev-tech-xul