CONTEÚDO
- Visão Geral
- Procedures do Include ut-4gltreeview.i (facilitador)
- Procedures e Funções do Componente
- Exemplo de Utilização
- Dicas de Conversão do OCX para o 4glTreeView
- Telas do TreeView
- Documentação Complementar do Componente
01. VISÃO GERAL
Este componente TreeView4glTreeView, feito em progress, tem como objetivo substituir o componente TreeView fornecido pela Microsoft (mscomctrl.ocx), pois este OCX não possui compatibilidade com o OpenEdge 64Bits.
...
- Performático, onde testamos mais de 5000 nós e não houve perda de performance.
- Temos um include ut-4gltreeview.i que possui algumas procedures "facilitadoras" para manipulação do TreeView.
- Feito totalmente em progress.
- Possuímos o código fonte, onde podemos customizá-lo de acordo com as nossas necessidades.
02. PROCEDURES DO INCLUDE ut-4gltreeview.i (facilitador) Âncora |
---|
| include_4gltreeview |
---|
| include_4gltreeview |
---|
|
Foi disponibilizado o include ut-4gltreeview.i para facilitar a utilização do TreeView, que possui as seguintes variáveis e procedures:
Variável | Tipo | Descrição |
---|
h-treeview4gltreeview | Handle | Contem o handle da instância do treeviewTreeView |
c-codigo-node | Char | Contem o pcKe (chave) do node selecionado |
cImage | Char | Contem a imagem que será apresentada utilizada como ícone no node |
cFgColor | Char | Contem a cor de frente do node |
cFont | Char | Contem o código da fonte utilizada no node |
cExpClp | Char | Expande ou fecha o node |
Procedure | Parâmetros | Descrição | Exemplo/Utilização |
---|
pi- |
atualizaTreeviewFaz uma atualização/refresh do treeview. | RUN pi-atualizaTreeview. | pi-create-node | Parâmetros | Tipo | Descrição |
---|
pcKe (I) |
|
pcKe | Char | Chave do node | pcKePar (I |
|
pcKePar) | Char | Pai do node | pcLabel (I |
|
pcLabel) | Char | Label do node | pcIco(I) |
|
pcIco | Char | Ícone do node | pcOptn (I) |
|
pcOptn | treeviewTreeView. O pcOptn é uma lista de parâmetros que são separados por chr(1). Valores válidos para o |
pcOtnpcOptn: Parâmetro | Descrição |
---|
expanded | Inicia o node expendido | collapsed | Inicia o node fechado (não expandido) - opção default | selected | Seleciona o node ate o próximo refresh | refresh | Realiza o refresh do |
|
treeviewTreeView | AutoSort=yes/no | Liga ou desliga a ordenação do |
|
treeviewTreeView | font=n | Define uma fonte para o node | fgcolor=n | Define uma cor de frente para o node | bgcolor=n | Define uma cor de fundo para o node | tooltip=xxx | Define um help para o node |
| DO ON ERROR UNDO, LEAVE: RUN pi-create-node |
NO-ERROR ("n2","","node 2","","expanded")
|
NO-ERROR. END. |
pi-update-node | Parâmetro | Tipo | Descrição |
---|
pcKe (I |
|
cChave) | Char | Chave do node a mover | pcFieldNames (I |
|
cFieldNames) | Char | Lista de campos, exemplo: "lab,ico" | pcFieldValues (I) |
|
cFieldValues | Char | Lista de valores separados por chr(1) | pcOptn (I) |
|
cParam | | Atualiza o label, ícone ou a lista de opções de um determinado node. Para remover um item do pcOptn existente, coloque "!" na frente da opção, conforme o exemplo abaixo: pcOptn="!font" A opção acima removerá o fonte definido para o node. | ASSIGN cFgColor = "font=1". RUN pi-update-node (c-codigo-node, "", "", cFgColor). RUN |
NOERRORParâmetro | tvNodeEvent | pi-atualizaTreeview |
| Faz uma atualização/refresh do TreeView. | RUN pi-atualizaTreeview. |
tvNodeEvent | |
pcEvent | Char | Evento que aconteceu | pcNodeKey (I) |
|
pcNodeKey | | Procedure auxiliar que é assinada no |
treeviewTreeView, onde todos os eventos que ocorrerem no |
treeview TreeView chamarão esta procedure. Você não precisa chamar esta procedure diretamente, pois quem irá chamá-la é o |
treeview serão alimentados as variáveis será alimentada a variável c-codigo |
-node e h o pcNodeKey, que é a chave do node selecionado. |
|
pi-ClickTreeview |
Esta é uma procedure que é
| Procedure que será chamada pelo tvNodeEvent |
e deve ser criada no seu programa, pois neste ponto que você deverá utilizar o sempre que ocorrer um evento de "select" (click em um node) no TreeView. Caso queria capturar este evento, esta Procedure deve ser definida no seu programa. A variável c-codigo-node |
e h-node, que é node, e fazer os seus procedimentos necessários para atualizar frames e utilizar o Card documentos |
---|
Informacao | Você tem que criar a pi-ClickTreeview quando utilizar o ut-treeview.i, senão ocorrerá erro durante a execução do seu programa. |
---|
Titulo | IMPORTANTE! |
---|
|
Card documentos |
---|
Informacao | Não se esqueça de eliminar o treeview da memória no final do seu programa!!! |
---|
Titulo | IMPORTANTE! |
---|
|
03. PROCEDURES DO COMPONENTE
O componente TreeView.w possui um código altamente documentado que pode ser utilizado.
Aconselhamos utilizar o include facilitador, pois ele possui variáveis e algumas procedures que vão facilitar o desenvolvimento.
Abaixo temos as principais procedures do TreeView:
...
Adiciona um node no treeview.
Se o node for adicionado a um
node pai, ele será o último filho.
...
DO ON ERROR UNDO, LEAVE:
RUN addNode IN h-treeview ("n1","","node1","","") NO-ERROR.
RUN addNode IN h-treeview ("n2","","node2","","expanded") NO-ERROR.
RUN addNode IN h-treeview ("n21","n2","node21","","") NO-ERROR.
RUN addNode IN h-treeview ("n22","n2","node22","","expanded").
RUN addNode IN h-treeview ("n221","n22","node221","image/book02.bmp","").
RUN addNode IN h-treeview ("n222","n22","node222","image/book02.bmp","").
RUN addNode IN h-treeview ("n3","","node3","present1.bmp","expanded").
RUN addNode IN h-treeview ("n31","n3","node31","image/$.bmp","").
RUN addNode IN h-treeview ("n4","","node4","image/smile56.bmp","").
END.
...
RUN applyEntry IN h-treeview (INPUT "").
...
RUN deleteNode IN h-treeview (c-codigo-node, "refresh").
...
IF VALID-HANDLE(h-treeview) THEN DO:
RUN destroyObject IN h-treeview.
DELETE PROCEDURE h-treeview NO-ERROR.
END.
...
RUN emptyTree IN h-treeview NO-ERROR.
...
RUN enableObject IN h-treeview NO-ERROR.
...
RUN expandBranch IN h-treeview (c-codigo-node) NO-ERROR.
RUN pi-atualizaTreeview.
Obs: Ao fazer o expandBranch não esqueça de fazer o Refresh para atualizar o treeview na tela.
...
RUN getFrameTreeview IN h-treeview (OUTPUT hFrameTV).
...
RUN getNodeDetails IN h-treeview (c-codigo-node, OUTPUT hNdBf).
MESSAGE
"id:" hNdBf:BUFFER-FIELD("id"):BUFFER-VALUE SKIP
"label:" hNdBf:BUFFER-FIELD("lab"):BUFFER-VALUE SKIP
"ico:" hNdBf:BUFFER-FIELD("ico"):BUFFER-VALUE SKIP
"level:" hNdBf:BUFFER-FIELD("level"):BUFFER-VALUE SKIP
"parent:" hNdBf:BUFFER-FIELD("par"):BUFFER-VALUE SKIP
"prev-sibling:" hNdBf:BUFFER-FIELD("pre"):BUFFER-VALUE SKIP
"next-sibling:" hNdBf:BUFFER-FIELD("nex"):BUFFER-VALUE SKIP
"expanded:" hNdBf:BUFFER-FIELD("expanded"):BUFFER-VALUE SKIP
"optn:" hNdBf:BUFFER-FIELD("optn"):BUFFER-VALUE
VIEW-AS ALERT-BOX INFO BUTTONS OK.
DELETE OBJECT hNdBf.
PROCEDURE pi-ClickTreeView: MESSAGE "Chave do Nó: " + c-codigo-node VIEW-AS ALERT-BOX. END PROCEDURE. |
pi-CtrlPopupTreeview | Parâmetro | Tipo | Descrição |
---|
pcAction (I) | Char | Ação do Popup: "build" ou "choose" | pcEvent (I) | Char | Item do Popup escolhido | pcNodeKey (I) |
| Chave do node |
| Procedure utilizada para criar e controlar o Popup Menu do TreeView. Caso queria definir um Popup Menu para a TreeView, esta Procedure deve ser definida no seu programa. Ela será chamada pelo tvNodeEvent em dois momentos: 1) Criação do Popup Menu Executada na momento em que o componente é criado. Passando como parâmetro o Ação "build". Neste momento a Procedure deverá retornar uma String com a lista dos itens a serem apresentados no Popup. A lista deve utilizar o separador "chr(1)" e ser composta por Label e Valor de cada item. Exemplo: "Label Item1" + chr(1) + "valoritem1" + chr(1) + "Label ItemN" + chr(1) + "valoritemN". É possível acrescentar uma régua entre os itens, para isto, basta incluir um item com o Label "RULE" e o valor igual a branco. Obs: O parâmetro pcNodeKey irá conter a chave do node selecionado, caso queira criar um Popup Menu personalizado para cada node. 2) Clique no Item do Popup Menu Executada no momento em que algum item do Popup é clicado. Passando como parâmetro a Ação "choose" e o valor do item clicado no parâmetro pcEvent. | PROCEDURE pi-CtrlPopupTreeview: DEF INPUT PARAM pcAction AS CHAR NO-UNDO. DEF INPUT PARAM pcEvent AS CHAR NO-UNDO. DEF INPUT PARAM pcNodeKey AS CHAR NO-UNDO. // Criação do Popup Menu IF pcAction = "build" THEN DO: RETURN "Muda Cor" + CHR(1) + "menuMudaCor" + CHR(1) + "Deleta Nó" + CHR(1) + "menuDelNode" + CHR(1) + "RULE" + CHR(1) + "" + CHR(1) + "Detalhes" + CHR(1) + "menuDetalhe". END. // Clica em um Item do Popup Menu IF pcAction = "choose" THEN DO: CASE pcEvent: WHEN "menuMudaCor" THEN DO: MESSAGE "MUDANDO A COR DO NÓ !" VIEW-AS ALERT-BOX. END. WHEN "menuDelNode" THEN DO: MESSAGE "DELETANDO O NÓ !" VIEW-AS ALERT-BOX. END. WHEN "menuDetalhe" THEN DO: MESSAGE "MOSTRANDO DETALHES !" VIEW-AS ALERT-BOX. END. END CASE. RETURN. END. END PROCEDURE. |
pi-GenericEventTreeview | Parâmetro | Tipo | Descrição |
---|
pcEvent (I) | Char | Evento que aconteceu | pcNodeKey (I) | Char | Chave do node |
| Procedure que será chamada pelo tvNodeEvent para todos os eventos do TreeView que não sejam o evento de "select" (tratado pela PI pi-ClickTreeview) e os eventos de Popup Menu (tratados pela PI pi-CtrlPopupTreeview). Caso queria capturar algum evento específico do TreeView, esta Procedure deve ser definida no seu programa. O parâmetro pcEvent irá conter o evento que ocorreu, por exemplo "expand", que ocorre quando o node é expandido. | PROCEDURE pi-GenericEventTreeview: DEF INPUT PARAM pcEvent AS CHAR NO-UNDO. DEF INPUT PARAM pcNodeKey AS CHAR NO-UNDO.
MESSAGE "OCORREU O EVENTO: " + pcEvent SKIP "PARA O NÓ: " + pcNodeKey VIEW-AS ALERT-BOX. END PROCEDURE. |
Card documentos |
---|
Informacao | Não se esqueça de eliminar o TreeView da memória no final do seu programa !!! |
---|
Titulo | IMPORTANTE! |
---|
|
03. PROCEDURES E FUNÇÕES DO COMPONENTE Âncora |
---|
| procedures_funcoes |
---|
| procedures_funcoes |
---|
|
O componente 4glTreeView possui um código altamente documentado que pode ser utilizado.
Aconselhamos utilizar o include facilitador, pois ele possui variáveis e algumas procedures que vão facilitar o desenvolvimento.
Abaixo temos as principais procedures e funções do TreeView:
Procedure | Parâmetros | Descrição | Exemplo/Utilização |
---|
addNode *
| Parâmetros | Tipo | Descrição |
---|
pcKe (I) | Char | Chave do node | pcKePar (I) | Char | Chave Pai do node | pcLabel (I) | Char | Label do node | pcIco (I) | Char | Ícone do node | pcOptn (I) | Char | Parâmetros do node |
| Adiciona um node no TreeView. Se o node for adicionado a um node pai, ele será o último filho. | DO ON ERROR UNDO, LEAVE: RUN addNode IN h-4gltreeview ("n1","","node1","",""). RUN addNode IN h-4gltreeview ("n2","","node2","","expanded"). RUN addNode IN h-4gltreeview ("n21","n2","node21","",""). RUN addNode IN h-4gltreeview ("n22","n2","node22","","expanded"). RUN addNode IN h-4gltreeview ("n221","n22","node221", "image/treeview/tvpics/book02.bmp",""). RUN addNode IN h-4gltreeview ("n222","n22","node222", "image/treeview/tvpics/book02.bmp",""). RUN addNode IN h-4gltreeview ("n3","","node3", "image/treeview/tvpics/present1.bmp","expanded"). RUN addNode IN h-4gltreeview ("n31","n3","node31", "image/treeview/tvpics/SDO.bmp",""). RUN addNode IN h-4gltreeview ("n4","","node4", "image/treeview/tvpics/smile56.bmp",""). END. |
updateNode *
| Parâmetro | Tipo | Descrição |
---|
pcKe (I) | Char | Chave do node a mover | pcFieldNames (I) | Char | List de campos, exemplo: "lab,ico" | pcFieldValues (I) | Char | Lista de valores separados por chr(1) | pcOptn (I) | Char | Parâmetros do node |
| Atualiza o label, ícone ou a lista de opções de um determinado node. | RUN updateNode IN h-4gltreeview (c-codigo-node, "", "", cFgColor). |
deleteNode | Parâmetro | Tipo | Descrição |
---|
pcKe (I) | Char | Chave do node | pcOptn (I) | Char | Parâmetros do node |
| Elimina o node informado. | RUN deleteNode IN h-4gltreeview (c-codigo-node, "refresh"). |
moveNode | Parâmetro | Tipo | Descrição |
---|
pcKe (I) | Char | Chave do node a mover | pcToKe (I) | Char | Mover para o node | pcMode (I) | Char | Modos possíveis: after, before, parent | pcOptn (I) | Char | Opção possível: refresh |
| Move um node origem, como filho de outro node destino. Caso o pcMode = "parent" e o node destino seja em branco, ele jogara o node origem como o último node do nível 0. | RUN moveNode IN h-4gltreeview (c-codigo-node, c-codigo-node-pai, "after", "refresh"). |
enableObject |
| Habilita o TreeView. | RUN enableObject IN h-4gltreeview. |
initializeObject |
| Inicializa o TreeView. | RUN initializeObject IN h-4gltreeview. |
destroyObject |
| Elimina o TreeView da memória. | IF VALID-HANDLE(h-4gltreeview) THEN DO: RUN destroyObject IN h-4gltreeview. DELETE PROCEDURE h-4gltreeview. END. |
getFrameTreeview | Parâmetro | Tipo | Descrição |
---|
hFrame (O) | Handle | Handle da frame do TreeView |
| Retorna o handle da frame do TreeView. | RUN getFrameTreeview IN h-4gltreeview (OUTPUT hFrameTV). |
emptyTree |
| Zera o conteúdo da TreeView. | RUN emptyTree IN h-4gltreeview. |
expandBranch | Parâmetro | Tipo | Descrição |
---|
pcKe (I) | Char | Chave do node |
| Expande o node e todos os seus filhos. Obs: Caso queria expandir apenas o node (e não os filhos), use a função "expandNode". | RUN expandBranch IN h-4gltreeview (c-codigo-node). RUN pi-atualizaTreeview.
|
getNodeDetails | Parâmetro | Tipo | Descrição |
---|
pcKe (I) | Char | Chave do node |
| Retorna detalhes do node do informado. | RUN getNodeDetails IN h-4gltreeview (c-codigo-node, OUTPUT hNdBf). MESSAGE "id:" hNdBf:BUFFER-FIELD("id"):BUFFER-VALUE SKIP "label:" hNdBf:BUFFER-FIELD("lab"):BUFFER-VALUE SKIP "ico:" hNdBf:BUFFER-FIELD("ico"):BUFFER-VALUE SKIP "level:" hNdBf:BUFFER-FIELD("level"):BUFFER-VALUE SKIP "parent:" hNdBf:BUFFER-FIELD("par"):BUFFER-VALUE SKIP "prev-sib:" hNdBf:BUFFER-FIELD("pre"):BUFFER-VALUE SKIP "next-sib:" hNdBf:BUFFER-FIELD("nex"):BUFFER-VALUE SKIP "expand:" hNdBf:BUFFER-FIELD("expanded"):BUFFER-VALUE SKIP "optn:" hNdBf:BUFFER-FIELD("optn"):BUFFER-VALUE VIEW-AS ALERT-BOX INFO BUTTONS OK. DELETE OBJECT hNdBf. |
hasNodes | Parâmetro | Tipo | Descrição |
---|
pcHasN (O) | Logical | Existe node |
| Retorna Verdadeiro ou False se o TreeView possuir nodes. | IF DYNAMIC-FUNCTION('hasNodes' IN h-4gltreeview) THEN DO: MESSAGE "Existe Nós no Treeview" VIEW-AS ALERT-BOX. END. |
getTreeCount | Parâmetro | Tipo | Descrição |
---|
pcCount (O) | Integer | quantidade nodes |
| Retorna a quantidade de nodes do TreeView. | ASSIGN iTreeCount = DYNAMIC-FUNCTION('getTreeCount' IN h-4gltreeview). MESSAGE "A Treeview possui " + string(iTreeCount) + " nós !" VIEW-AS ALERT-BOX. |
getNodeParentKey | Parâmetro | Tipo | Descrição |
---|
pcKe (I) | Char | Chave do node | pcKePar (O) | Char | Chave do node Pai |
| Retorna a chave do node Pai do node informado. | ASSIGN cParentKey = DYNAMIC-FUNCTION('getNodeParentKey' IN h-4gltreeview, c-codigo-node). |
selectNode | Parâmetro | Tipo | Descrição |
---|
pcKe (I) | Char | Chave do node | pcOk (O) | Logical | Indica se foi possível selecionar o node. |
| Seleciona o node informado. | ASSIGN lOk = DYNAMIC-FUNCTION('selectNode' IN h-4gltreeview, c-codigo-node). |
collapseNode | Parâmetro | Tipo | Descrição |
---|
pcKe (I) | Char | Chave do node | pcOptn (I) | Char | Opção possível: refresh | pcOk (O) | Logical | Indica se foi possível contrair o node. |
| Contrai o node informado. | ASSIGN lOk = DYNAMIC-FUNCTION('collapseNode' IN h-4gltreeview, c-codigo-node, "refresh"). |
expandNode | Parâmetro | Tipo | Descrição |
---|
pcKe (I) | Char | Chave do node | pcOptn (I) | Char | Opção possível: refresh | pcOk (O) | Logical | Indica se foi possível expandir o node. |
| Expande o node informado. Obs: Os filhos não serão expandidos. Para isto, utilize a procedure "expandBranch". | ASSIGN lOk = DYNAMIC-FUNCTION('expandNode' IN h-4gltreeview, c-codigo-node, "refresh"). |
isNodeExpanded | Parâmetro | Tipo | Descrição |
---|
pcKe (I) | Char | Chave do node | pcExpend (O) | Logical | Indica se o node informado está expandido. |
| Retorno YES ou NO indicando se o node está expandido. | IF DYNAMIC-FUNCTION('isNodeExpanded' IN h-4gltreeview, c-codigo-node) THEN MESSAGE "O NÓ ESTÁ EXPANDIDO" VIEW-AS ALERT-BOX. ELSE MESSAGE "O NÓ NÃO ESTÁ EXPANDIDO" VIEW-AS ALERT-BOX. |
setNodeTag | Parâmetro | Tipo | Descrição |
---|
pcKe (I) | Char | Chave do node | pcTag (I) | Char | Uma informação qualquer | pcOk (O) | Logical | Indica se foi possível gravar a Tag no node. |
| Atualiza a TAG do node. A TAG é um campo "coringa", onde pode ser gravada qualquer informação para recuperar depois. | ASSIGN lOk = DYNAMIC-FUNCTION('setNodeTag' IN h-4gltreeview, c-codigo-node, "minha informação"). |
getNodeTag | Parâmetro | Tipo | Descrição |
---|
pcKe (I) | Char | Chave do node | pcTag (O) | Char | A informação gravada na Tag do node. |
| Retornar a TAG gravada no node. | ASSIGN cNodeTag = DYNAMIC-FUNCTION('getNodeTag' IN h-4gltreeview, c-codigo-node). MESSAGE "TAG do Nó: " + cNodeTag VIEW-AS ALERT-BOX. |
* = Procedures chamadas pelo facilitador
04. EXEMPLO DE UTILIZAÇÃO
Segue abaixo um programa exemplo, construído em thin-templates, que utiliza o componente 4glTreeView, utilizando grande parte das procedures e funções existentes nestas documentação.
View file |
---|
name | exemplo-ut-4gltreeview.p |
---|
height | 250 |
---|
|
Bloco de código |
---|
title | Exemplo de utilização do TreeView |
---|
linenumbers | true |
---|
|
// Deficoes do treeview
{utp/ut-4gltreeview.i}
PROCEDURE afterDisplayFields :
RUN carregaTreeView.
RUN criaTreeView.
END PROCEDURE.
// Carregando o componente treeview
PROCEDURE carregaTreeView :
IF NOT VALID-HANDLE(h-4gltreeview) THEN DO:
// Instancia o treeview
RUN utp/ut-4gltreeview.w PERSISTENT SET h-4gltreeview.
// Indica a Frame "Pai" do componente
RUN setParentFrame IN h-4gltreeview (INPUT FRAME fPage0:HANDLE).
// Inicializa o treeview
RUN initializeObject IN h-4gltreeview.
// Faz a subscricao dos eventos do treeview
SUBSCRIBE TO "tvNodeEvent" IN h-4gltreeview.
// Reposiciona o treeview
RUN repositionObject IN h-4gltreeview (6.35, 2.00).
// Ajusta o tamanho do treeview
RUN resizeObject IN h-4gltreeview (10.70, 28.00).
END.
END PROCEDURE.
// Cria os nodes no treeview
PROCEDURE criaTreeView :
// Limpa o treeview
RUN emptyTree IN h-4gltreeview.
ASSIGN c-codigo-node = "".
// Logica para criar nos nodes do treeview
...
RUN pi-create-node (cNodeId, cNodeIdPai, cDescNode, cImage, cOptn).
...
// Faz o refresh do treeview
RUN pi-atualizaTreeview.
END PROCEDURE.
// Procedure executada toda vez que ocorrer um evento de click em um node
PROCEDURE pi-ClickTreeView :
MESSAGE c-codigo-node VIEW_AS ALERT-BOX.
END PROCEDURE.
// Retira o treeview da memoria
PROCEDURE beforeDestroyInterface :
IF VALID-HANDLE(h-4gltreeview) THEN DO:
RUN destroyObject IN h-4gltreeview.
DELETE PROCEDURE h-4gltreeview.
END.
RETURN "OK".
END PROCEDURE. |
05. DICAS DE CONVERSÃO DO OCX PARA O 4GLTREEVIEW
Segue abaixo uma tabela com algumas dicas para facilitar o processo de conversão dos programas que atualmente utilizar o TreeView OCX.
Processo | OCX | 4glTreeView |
---|
Definição de Variáveis | DEFINE VARIABLE chTreeView AS COM-HANDLE NO-UNDO. DEFINE VARIABLE CtrlFrame AS WIDGET-HANDLE NO-UNDO. DEFINE VARIABLE chCtrlFrame AS COMPONENT-HANDLE NO-UNDO. | // Definições Treeview {utp/ut-4gltreeview.i} |
Carregar o TreeView | Carrega o OCX através da procedure "control_load". | Criar um procedure como exemplo da "carregaTreeView" apresentada no tópico de exemplo. |
Posicionar a TreeView na tela | CREATE CONTROL-FRAME CtrlFrame ASSIGN FRAME = FRAME fpage0:HANDLE ROW = 2.46 COLUMN = 1 HEIGHT = 13.5 WIDTH = 31 HIDDEN = NO SENSITIVE = YES. | RUN repositionObject IN h-4gltreeview (2.46, 1.00). RUN resizeObject IN h-4gltreeview (13.5, 31.00). |
Menu Popup | DEFINE VARIABLE pop-menu AS WIDGET-HANDLE NO-UNDO. CREATE MENU pop-menu ASSIGN popup-only = TRUE TITLE = "POPUP". CtrlFrame:POPUP-MENU = pop-menu. | Criar a procedure "pi-CtrlPopupTreeview" apresentada no tópico de procedures da include. |
Apagar todos os nós do TreeView | ChTreeView:Nodes:Clear(). | RUN emptyTree IN h-4gltreeview. |
Expandir o node e seus filhos | DO i-cont = 1 TO chTreeView:Nodes:Count: ASSIGN chTreeView:Nodes(i-cont):Expanded = TRUE. END. | RUN expandBranch IN h-4gltreeview (c-codigo-node). RUN pi-atualizaTreeview. |
Selecionar um node | ASSIGN chTreeView:SelectedItem = chTreeView:Nodes(cNodeId). IF NOT ERROR-STATUS:ERROR THEN RUN CtrlFrame.TreeView.NodeClick (INPUT chTreeView:Nodes:Item(cNodeId)). | ASSIGN lOk = DYNAMIC-FUNCTION('selectNode' IN h-4gltreeview, c-codigo-node). |
Verificar se existem nodes | IF chTreeView:Nodes:COUNT > 0 THEN DO: ... END. | IF DYNAMIC-FUNCTION('hasNodes' IN h-4gltreeview) THEN DO: ... END. |
Verificar se o node está expandido | IF chTreeView:SelectedItem:Expanded THEN DO: ... END. | IF DYNAMIC-FUNCTION('isNodeExpanded' IN h-4gltreeview, c-codigo-node) THEN DO: ... END. |
Pegar a chave do node selecionado | ASSIGN cNodeId = chTreeView:SelectedItem:key(). | ASSIGN cNodeId = c-codigo-node. |
Monitorar o evento de click | PROCEDURE CtrlFrame.TreeView.NodeClick : ... END PROCEDURE. | Criar a procedure "pi-ClickTreeView" apresentada no tópico de procedures da include. |
Incluir um node | chTreeView:Nodes:Add (cNodeIdPai, 4, cNodeId, cNodeLabel, iNodeimage). | RUN pi-create-node (cNodeId, cNodeIdPai, cNodeLabel, cNodeImage, cNodeOptn). |
Gravar e recuperar a TAG | // Gravar TAG ASSIGN chTreeView:Nodes:Item(cNodeId):Tag = STRING(ROWID(ttDados)).
// Recuperar TAG ASSIGN rRowid = TO-ROWID(hTreeView:Nodes:Item(cNodeId):Tag). | // Gravar TAG ASSIGN lOk = DYNAMIC-FUNCTION('setNodeTag' IN h-4gltreeview, cNodeId, STRING(ROWID(ttDados)).
// Recuperar TAG ASSIGN rRowid = TO-ROWID(DYNAMIC-FUNCTION('getNodeTag' IN h-4gltreeview, cNodeId))). |
Criar um relacionamento entre a TreeView e a TempTable de Negócio | De preferencia por utilizar o Rowid como chave do Node, desta forma, fica mais fácil de achar o Node a partir da Temp-Table. Mas, também é possível utilizar a TAG para armazenar o Rowid. | De preferencia por utilizar o Rowid como chave do Node, desta forma, fica mais fácil de achar o Node a partir da Temp-Table. Mas, também é possível utilizar a TAG para armazenar o Rowid. |
Definir um ícone para o node | Utiliza o componente ImageList para determinar o ícone do node, informando o arquivo de imagem e associando a um índice numérico. No momento de criar o node, envia este índice:
FILE-INFO:FILE-NAME = SUBSTRING(SEARCH("image\conecta.ico"),1, R-INDEX(SEARCH("image\conecta.ico"),"~\")). chImageList:ListImages:Add(5,, LOAD-PICTURE(FILE-INFO:PATHNAME + "/" + "conecta.ico")). chTreeView:Nodes:Add(,, cNodeId, cNodeLabel, 5). | Os arquivos de imagem, utilizados pelo componente para determinar o ícone do node, estão disponíveis na pasta: image\treeview\tvpics
Sendo que, para cada ícone, existe um conjunto de 4 arquivos de imagem. Por exemplo, para o ícone "user", são utilizados os seguintes arquivos de imagens: user.bmp - Somente ícone (raiz) userMinus.bmp - Símbolo de menos e ícone (expandido com filhos) userNoSign.bmp - Ícone com deslocamento p/ direita (sem filhos) userPlus.bmp - Símbolo de mais e ícone (contraído com filhos)
No momento de criar o node, deve-se sempre informar o arquivo raiz, desta forma o componente irá carregar os demais arquivos conforme a necessidade: RUN pi-create-node (cNodeId, "", cNodeLabel, "image/treeview/tvpics/user.bmp", "").
Caso o ícone necessário não exista, deverão ser criados os arquivos de imagem, na pasta descrita acima, e seguindo o mesmo padrão de nomenclatura de ícone e sufixos (Minus, NoSign e Plus). |
06. TELAS DO TREEVIEW
Image AddedImage Added
Image AddedImage Added
07. DOCUMENTAÇÃO COMPLEMENTAR DO COMPONENTE
...
RUN initializeObject IN h-treeview.
...
RUN moveNode IN h-treeview
(c-codigo-node, c-codigo-node-pai, "after", "refresh") NO-ERROR.
updateNode *
...
RUN updateNode IN h-treeview
(c-codigo-node, "", "", cFgColor) NO-ERROR.
* = Procedures chamadas pelo facilitador
04. EXEMPLO DE UTILIZAÇÃO
Estamos disponibilizando um exemplo de um programa com thin-templates que utiliza esse componente de treeview.
Bloco de código |
---|
title | Exemplo de utilização do TreeView |
---|
linenumbers | true |
---|
collapse | true |
---|
|
// definition do treeview
{utp/ut-4gltreeview.i}
// carregando o componente treeview
PROCEDURE afterDisplayFields :
IF NOT VALID-HANDLE(h-4gltreeview) THEN DO:
// instancia o treeview
RUN utp/ut-4gltreeview.w PERSISTENT SET h-4gltreeview.
// Indica a Frame "Pai" do componente
RUN setParentFrame IN h-4gltreeview (INPUT FRAME fPage0:HANDLE).
// inicializa o treeview
RUN initializeObject IN h-4gltreeview.
// faz a subscricao do evento de click dentro do treeview
SUBSCRIBE TO "tvNodeEvent" IN h-4gltreeview.
// reposiciona o treeview
RUN repositionObject IN h-4gltreeview ( 6.35 , 2.00 ) NO-ERROR.
// ajusta o tamanho do treeview
RUN resizeObject IN h-4gltreeview ( 10.70 , 28.00 ) NO-ERROR.
END.
// carrega os itens do treeview
RUN pi-loadNodes.
// faz o refresh do treeview
RUN pi-atualizaTreeview IN THIS-PROCEDURE.
// coloca o cursor no treeview
RUN applyEntry IN h-4gltreeview (INPUT "").
END PROCEDURE.
// esta procedure sera executada toda vez que ocorrer um evento de click em um determinado nó
PROCEDURE pi-ClickTreeView :
MESSAGE c-codigo-node VIEW_AS ALERT-BOX.
END PROCEDURE.
// retira o treeview da memoria
PROCEDURE beforeDestroyInterface :
IF VALID-HANDLE(h-4gltreeview) THEN DO:
RUN destroyObject IN h-4gltreeview.
DELETE PROCEDURE h-4gltreeview NO-ERROR.
END.
RETURN "OK":U.
END PROCEDURE. |
Programas de exemplo no produto que estão utilizando este componente:
$/EMS2/Fontes_Doc/Sustentacao/V11/V11/progress/src/wmp/wm0370.w
$/EMS2/Fontes_Doc/Sustentacao/V11/V11/progress/src/wmp/wm0430.w
$/EMS2/Fontes_Doc/Sustentacao/V11/V11/progress/src/wmp/wm0510.w
05. TELAS DO TREEVIEW
Image RemovedImage Removed
Image RemovedImage Removed
...
View file |
---|
name | pure4glTv.pdf |
---|
height | 250 |
---|
|
View file |
---|
name | pureabltv.zip |
---|
height | 250 |
---|
|
...