Visor arbolado Tree Widget


([N1] lsmsusvilla) #1

Hola, una sujerencia alguien podria poner un ejemplo de como alimentar un control Tree Widget con JavaScrip, ya que no hay ningun ejemplo en todo el foro o por lo menos no lo he encontrado.
Gracias


([N1] wikan) #2

Buenas,

justo al final tienes un ejemplo usando los patrones
http://velneo.es/info_v7_717_es/velneo_vdevelop_v7/scripts/clases/core/vitemregisterpattern/

Eso es para trabajar con listas, si quieres añadir contenido personalizado debes trabajar con las dos últimas clases de final de esta página http://velneo.es/info_v7_717_es/velneo_vdevelop_v7/scripts/clases/core/widget/


([N1] lsmsusvilla) #3

Ok muchas gracias voy a ver si consigo algo con eso porque no hya nada por ningun sitio.


([N1] wikan) #4

Si es una lista, con los patrones verás que realmente fácil.

  • Creas el patrón
  • Defines los campos a visualizar, los formularios
  • Le pasas la lista al TreeWidget

([N1] lsmsusvilla) #5

Uffss te parecera facil para ti pero para mi ya te digo es la primera vez que me meto con esto y… me pierdo


([N3] pacosatu) #6

Hola lsmsusvilla.

Una vez le pedí a nuestro amigo Rafael Cueto un ejemplo de procesamiento XML con la función XmlReader y me pasó un ejemplo con el que matamos 2 pájaros de un tiro, procesamos un XML y lo mostramos en un treeWidget.

Con esto ves claramente cómo montar la estructura del árbol.


importClass("VXmlReader");
importClass("VFile");
importClass("VImage");

// -------------------------------------------------------
// Parseador de ficheros XML en formato xbel 1.0
// -------------------------------------------------------

// Se preparan los iconos a usar en el árbol
var iconFolder = new VImage();
iconFolder.loadResource("demo_velneov7_716_app/CARPETA");
var iconBook = new VImage();
iconBook.loadResource("demo_velneov7_716_app/LIBRO");

// Preparamos el control treewidget
var treeWidget = theRoot.dataView().control("TREE_WIDGET");
treeWidget.clear();

// Leemos el fichero desde la senda del control
var fileEdit = theRoot.dataView().control("FILE");
var inFile = new VFile( fileEdit.text );
inFile.open(VFile.OpenModeReadOnly);

// Preparamos el objeto para parsear el XML
var xml = new VXmlReader();
xml.setFile(inFile);

// Leemos el primer elemento del fichero para comprobar que es de tipo xbel versión 1.0
if (xml.readNextStartElement()) 
{
    if (xml.name() == "xbel" && xml.attributeValue("version") == "1.0")
    {
        // XBEL read
        while (xml.readNextStartElement()) 
        {
            if (xml.name() == "folder")
                readFolder(treeWidget, 0, xml);
            else if (xml.name() == "bookmark")
                readBookmark(treeWidget, 0, xml);
            else if (xml.name() == "separator")
                readSeparator(treeWidget, 0, xml);
            else
                xml.skipCurrentElement();
        };
    }
    else
        xml.raiseError("Este fichero no es un XBEL 1.0");
};

// Ajusta las columnas al contenido
treeWidget.resizeColumnToContents(0);
treeWidget.setFocus();

// --------------------------
// Lectura de la carpeta
// --------------------------
function readFolder(tree, item, xml)
{
    var itemFolder;
    if (item)
        itemFolder = item.addChild();
    else
        itemFolder = tree.addTopLevelItem();

    itemFolder.setIcon(0, iconFolder);

    var folded = (xml.attributeValue("folded") != "no");
    itemFolder.setExpanded(!folded);

    while (xml.readNextStartElement()) 
    {
        if (xml.name() == "title")
            readTitle(itemFolder, xml);
        else if (xml.name() == "folder")
            readFolder(tree, itemFolder, xml);
        else if (xml.name() == "bookmark")
            readBookmark(tree, itemFolder, xml);
        else if (xml.name() == "separator")
            readSeparator(tree, itemFolder, xml);
        else
            xml.skipCurrentElement();
    };
};

// ----------------------
// Lectura del  título
// ----------------------
function readTitle( item, xml )
{
    var title = xml.readElementText();
    item.setText(0, title);
};

// ---------------------------
// Lectura del  bookmark
// ---------------------------
function readBookmark(tree, item, xml)
{
    var itemBookmark;
    if (item)
        itemBookmark = item.addChild();
    else
        itemBookmark = tree.addTopLevelItem();

    itemBookmark.setFlags(0 | itemBookmark.flags() | VTreeItem.ItemIsEditable);
    itemBookmark.setIcon(0, iconBook);
    itemBookmark.setText(0, "Título desconocido");
    itemBookmark.setText(1, xml.attributeValue("href"));

    while (xml.readNextStartElement()) 
    {
        if (xml.name() == "title")
            readTitle(itemBookmark, xml);
        else
            xml.skipCurrentElement();
    };
};

// --------------------------
// Lectura del separador
// --------------------------
function readSeparator(tree, item, xml)
{
    var itemSeparator;
    if (item)
        itemSeparator = item.addChild();
    else
        itemSeparator = tree.addTopLevelItem();

    itemSeparator.setText(0, "...............................................................................");
    xml.skipCurrentElement();
};

Saludos
Paco Satué


([N1] lsmsusvilla) #7

Muchas gracias seh, pero me sigue pareciendo un laberinto sin salida el tema de los objetos o controles basados en javascrip. Mejora o atraso, no lo se para mi de momento lo segundo. Si de lo que se trata es de optimizar y hacer que la creación de objetos sea rápida e intuitiva como hasta ahora, cosa de lo que se jacta Velneo, creo que con esto se esta alejando mucho de esta linea, que para algo tan simple como crear una lista arbolada haya que escribir tanto código manual sin una depuración eficiente. Al final tenemos controles muy eficientes que hacen de todo pero al final no hacen nada. Es como tener un F18 aparcado en el garaje de tan complicado que es manejarlo nunca lo sacas.