Отображение вертикальных линий со стрелками на панели Ext Tree - PullRequest
Новая
       9

Отображение вертикальных линий со стрелками на панели Ext Tree

1 голос
/ 20 января 2020

Как полностью реализовать вертикальную линию и стрелки в Ext Tree?

Я создал скрипку, используя оба свойства useArrows и lines, но не применяется одновременно. 

     Ext.create('Ext.tree.Panel', {
        title: 'Simple Tree',
        width: 200,
        height: 200,
        store: store,
        rootVisible: true,
        lines:true,
        useArrows: true,
        renderTo: Ext.getBody()
    });

Скрипка

Ответы [ 2 ]

1 голос
/ 20 января 2020

useArows и lines в дереве имеют взаимоисключающие свойства

enter image description here

Но вы можете использовать следующий хак - установить useArrow и вручную установить linesCls и переопределить некоторые css классы.

Посмотри на мою скрипку

1 голос
/ 20 января 2020

Как вы можете видеть в исходном коде для Ext.tree.Panel Ext Js не будет давать панели дерева строки CSS, если @cfg useArrows истинно. 

initComponent: function() {
    var me = this,
        cls = [me.treeCls],
        store, autoTree, view;

    if (me.useArrows) {
        cls.push(me.arrowCls);
        me.lines = false;
    }

    if (me.lines) {
        cls.push(me.linesCls);
    } else if (!me.useArrows) {
        cls.push(me.noLinesCls);
    }
....}

На мой взгляд, у вас есть два варианта:

  1. Вы переопределяете метод initComponent для этого Ext.tree.Panel
  2. Вы можете переопределить css классы для реализации изображений со стрелками

Я сделал Fiddle для второго случая. Это то, что вы хотели?

...