{"id":206,"date":"2014-12-31T11:45:56","date_gmt":"2014-12-31T11:45:56","guid":{"rendered":"http:\/\/linguagemprisma.net\/?p=206"},"modified":"2017-09-03T11:11:43","modified_gmt":"2017-09-03T15:11:43","slug":"ig-caixa-fixa-botoes-e-dicas","status":"publish","type":"post","link":"https:\/\/linguagemprisma.br4.biz\/blog\/igprisma\/ig-caixa-fixa-botoes-e-dicas\/","title":{"rendered":"IG – caixa fixa, botoes e dicas"},"content":{"rendered":"

\"increase_decrease\"<\/a><\/p>\n

Segue o c\u00f3digo:<\/p>\n

\/\/example botao somar e diminuir\r\n\r\n\/\/o mesmo exemplo em C levaria muito mais tempo e linhas para ser feito!\r\ninclua 'igbr' \/\/inclui as fun\u00e7\u00f5es gr\u00e1ficas\r\n\r\ncontador = 0; \/\/inicia a variavel contador com o valor 0;\r\n\r\nfuncao somar( )  \/\/esta funcao acrescenta 1 e atualiza o texto do rotulo\r\n\r\n  contador = contador + 1; \/\/ incrementa 1\r\n  ig.rotulo_def_texto ( rotulo , convstring( contador )   ); \/\/define o texto do label\r\n  \/\/  a funcao 'convstring' converte numero para string\r\n\r\nfim\r\n\r\nfuncao diminuir ( ) \/\/esta funcao diminui 1 e atualiza o texto do rotulo\r\n\r\ncontador = contador - 1;   \/\/ diminui 1\r\n\r\n   ig.rotulo_def_texto (  rotulo , convstring(  contador )    ) ; \/\/define o texto do r\u00f3tulo\r\n\r\nfim\r\n\r\njanela = ig.janela ( ); \/\/cria uma janela\r\n\r\nig.janela_def_posicao ( janela , ig.jan_pos_centro );\r\n\r\nig.janela_def_tamanho_padrao ( janela , 270 , 180 ); \/\/define tamanho padrao para a janela\r\n\r\nig.janela_def_titulo ( janela , \"  +  - \" );   \/\/ definir titulo da janela\r\n\r\ncaixa_fixa = ig.fixo ( ); \/\/cria uma caixa que organiza os componentes em posicoes por coordenadas x y fixas\r\n\r\nig.ad ( janela , caixa_fixa ) ; \/\/ adiciona a caixa fixa na janela\r\n\r\nbt_mais = ig.botao( \"+\" ) ; \/\/ cria um botao com o texto '+'\r\nig.componente_def_dica_texto ( bt_mais , \"aumenta 1\"); \/\/mostra este texto quando o mouse parar em cima do componente\r\nig.componente_def_tamanho ( bt_mais , 80 , 35 ); \/\/define o tamanho do componente\r\n\r\nig.fixo_ad ( caixa_fixa , bt_mais ,  50 , 20 ); \/\/adiciona o botao mais na caixa fixa na posicao coluna 50 por linha 20;\r\n\r\n\/\/criando o botao menos\r\nbt_menos = ig.botao( \"-\" );\r\n\/\/definindo uma dica em makup, aceita tags como a do negrito <b><b>\r\nig.componente_def_dica_markup ( bt_menos, \"<b>diminui 1<\/b>\");\r\nig.componente_def_tamanho( bt_menos, 80 , 35 ); \/\/tamanho do botao\r\n\/\/adicionando botao menos dentro da caixa fixa:\r\nig.fixo_ad ( caixa_fixa , bt_menos , 50 , 80 );\r\n\r\nrotulo = ig.rotulo (\"0\") ; \/\/cria um rotulo com o texto '0'\r\nig.fixo_ad( caixa_fixa , rotulo , 190 , 58 );\r\n\/\/modifica a cor do texto ( rgb:  red = 22222222 , green = 0 e blue = 0 )\r\nig.componente_modifique_fg ( rotulo , ig.estado_normal , 2222222 , 0 , 0 );\r\nig.componente_modifique_fonte ( rotulo , 'Arial bold 56' ); \/\/define a fonte do rotulo como arial negrito tamanho 56;\r\n\r\nig.componente_mostre_todos ( janela ) ; \/\/mostra a janela e seus componentes\r\nig.conecte( janela , ig.destruido , \"ig.saia()\");\r\n\r\n\/\/conectando os botoes \u00e0s suas respctivas funcoes:\r\nig.conecte( bt_mais , ig.clique , [[ somar(rotulo)]]   );\r\nig.conecte ( bt_menos , ig.clique , [[ diminuir ( rotulo ) ]] );\r\n\r\nig.fimprograma(); \/\/inicia o la\u00e7o de eventos\r\n\r\n<\/pre>\n
 <\/p>\n
 <\/p>\n
———————————————————————<\/p>\n
A novidade aqui \u00e9 o componente caixa fixa, comando de cria\u00e7\u00e3o\u00a0 ig.fixo( )\u00a0 <\/strong><\/p>\n
Diferentemente das caixas verticais e horizontais que j\u00e1 vimos, este container n\u00e3o<\/p>\n
organiza automaticamente os componentes, ficando a cargo do programador definir<\/p>\n
o local em coordenadas de x e y (x = coluna , y = linha).<\/strong> <\/span>A fun\u00e7\u00e3o para adicionar<\/p>\n
componentes em caixas fixas \u00e9 : ig.fixo_ad ( caixa_fixa , componente, x , y )<\/strong><\/span><\/p>\n
Voc\u00ea pode querer mudar a posi\u00e7\u00e3o<\/strong> <\/span>de um componente dentro de uma caixa fixa,<\/em><\/p>\n
para isso use a fun\u00e7\u00e3o: ig.fixo_posicione( caixa_fixa, componente, x , y )<\/strong><\/span><\/p>\n
\u00c9 muito f\u00e1cil mexer com este tipo de caixa, mas muitas vezes ser\u00e1 melhor usar caixas <\/em><\/span><\/strong><\/p>\n
com organiza\u00e7\u00e3o autom\u00e1tica, principalmente em programas em que os componentes<\/em><\/span><\/strong><\/p>\n
devem se adequar ao tamanho da tela do usu\u00e1rio final.<\/em><\/span><\/strong><\/p>\n
convstring( numero ) – <\/strong>Esta fun\u00e7\u00e3o \u00e9 \u00fatil para converter n\u00fameros em strings,<\/p>\n
para depois usarmos como\u00a0 texto de algum componente;<\/p>\n
 ig.componente_def_dica_texto ( bt_mais , “aumenta 1”);
\n<\/strong><\/span><\/p>\n
Esta fun\u00e7\u00e3o \u00e9 muito boa para expor um box com texto dica quando o mouse ficar parado<\/p>\n
em cima do componente.<\/p>\n
 ig.componente_def_dica_markup ( bt_menos, “<b>diminui 1<\/b>”);<\/strong> <\/span><\/p>\n
Mesmo uso da fun\u00e7\u00e3o anterior, com a diferen\u00e7a de que esta aceita tags de linguagens de markup,<\/p>\n
tags simples como negrito <b>texto<\/b>,\u00a0 italico <i>texto<\/i> ou sublinhado <u>texto<\/u>
\n<\/strong><\/p>\n
 <\/p>\n
ig.componente_modifique_fg ( rotulo , ig.estado_normal , 2222222 , 0 , 0 );<\/span><\/strong><\/p>\n
esta muda o foreground (plano em relevo), isto \u00e9, no caso do rotulo \u00e9 o texto.<\/p>\n
vejamos cada par\u00e2metro:<\/p>\n
rotulo =<\/strong> componente edit\u00e1vel para mudar a cor de foreground<\/p>\n
ig.estado_normal<\/strong> = \u00e9 o estado, geralmente se usa o normal, isto \u00e9, o componente n\u00e3o est\u00e1 em foco ou sendo<\/p>\n
clicado. Tem tamb\u00e9m outro estado o ig.estado_foco, quando o mouse est\u00e1 sobre o componente.
\n<\/strong><\/p>\n
o estado pode ser escrito se preferir de outra maneira: ig[“estado_normal”]<\/span><\/p>\n
 2222222<\/span><\/strong> = \u00e9 o valor para a intensidade do vermelho;<\/p>\n
0<\/strong> <\/span>= intensidade da cor verde;<\/p>\n
0<\/strong> <\/span>= intensidade da com azul<\/p>\n
a cor \u00e9 a combina\u00e7\u00e3o do RGB (isto \u00e9 , red , green e blue).<\/p>\n
se quiser pode passar uma tabela como valor da cor, ficando assim o comando:<\/p>\n
cor = { red = 2222222, green = 0 , blue = 0 };\u00a0 <\/span><\/p>\n
ig.componente_modifique_fg( rotulo , ig.estado_normal , cor ); \/<\/span><\/span>\/passando a tabela cor como par\u00e2metro da cor;<\/span><\/p>\n
ig.componente_modifique_fonte ( rotulo , ‘Arial bold 56’ );<\/strong><\/span><\/p>\n
Aqui definimos a fonte, s\u00f3 funciona com edit\u00e1veis, n\u00e3o funciona com bot\u00f5es.<\/p>\n
rotulo =<\/span><\/strong> o componente a ser mudado a fonte.<\/p>\n
‘Arial bold 56’ =<\/strong><\/span> string de formata\u00e7\u00e3o da fonte. O nome da fonte sempre primeiro,<\/p>\n
o tamanho sempre deve ir por \u00faltimo e no meio podem ficar caracter\u00edsticas tais como<\/p>\n
bold (negrito) ou italic (italico);<\/p>\n
ig.conecte( janela , ig.destruido , “ig.saia()”); –<\/span><\/strong> se n<\/span>\u00e3o entendeu este comando ainda, leia com
\n<\/span><\/p>\n
aten\u00e7\u00e3o, ele \u00e9 simples:\u00a0 conecta uma fun\u00e7\u00e3o ao evento fechar janela (quando se clica no x de fechar),<\/p>\n
neste caso a fun\u00e7\u00e3o foi ig.saia()<\/strong> para fechar o aplicativo e n\u00e3o deix\u00e1-lo rodar em modo invis\u00edvel.<\/p>\n
Se n\u00e3o usar este comando conectado a janela principal, ao fechar a janela ele continua rodando,<\/p>\n
portanto nunca esque\u00e7a de us\u00e1-lo.<\/p>\n
 <\/p>\n
ig.conecte( bt_mais , ig.clique , [[ somar(rotulo)]]\u00a0\u00a0 ); <\/strong><\/span>
\n ig.conecte ( bt_menos , ig.clique , [[ diminuir ( rotulo ) ]] );<\/strong><\/span><\/p>\n
Aqui conectamos as fun\u00e7\u00f5es somar e diminuir aos devidos bot\u00f5es com<\/p>\n
o evento clique, para que quando clicados estas fun\u00e7\u00f5es sejam executadas.<\/p>\n
Note que passamos como par\u00e2metro das fun\u00e7\u00f5es conectadas a vari\u00e1vel rotulo,<\/p>\n
 <\/p>\n
ig.fimprograma(); \/\/inicia o la\u00e7o de eventos<\/strong><\/span><\/p>\n
este \u00e9 o \u00faltimo comando do programa, o c\u00f3digo principal sempre deve estar antes desse comando.<\/p>\n
 <\/p>\n
Bom \u00e9 isso, boas linhas de c\u00f3digo!<\/p>\n
Att. Adalberto<\/p>\n
 <\/p>\n
 <\/p>\n","protected":false},"excerpt":{"rendered":"
Segue o c\u00f3digo: \/\/example botao somar e diminuir \/\/o mesmo exemplo em C levaria muito mais tempo e linhas para ser feito! inclua ‘igbr’ \/\/inclui as fun\u00e7\u00f5es gr\u00e1ficas contador = 0; \/\/inicia a variavel contador com o valor 0; funcao somar( ) \/\/esta funcao acrescenta 1 e atualiza o texto do rotulo contador = contador…<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3,5],"tags":[],"class_list":["post-206","post","type-post","status-publish","format-standard","hentry","category-igprisma","category-interface_grafica"],"_links":{"self":[{"href":"https:\/\/linguagemprisma.br4.biz\/blog\/wp-json\/wp\/v2\/posts\/206","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/linguagemprisma.br4.biz\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/linguagemprisma.br4.biz\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/linguagemprisma.br4.biz\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/linguagemprisma.br4.biz\/blog\/wp-json\/wp\/v2\/comments?post=206"}],"version-history":[{"count":1,"href":"https:\/\/linguagemprisma.br4.biz\/blog\/wp-json\/wp\/v2\/posts\/206\/revisions"}],"predecessor-version":[{"id":3150,"href":"https:\/\/linguagemprisma.br4.biz\/blog\/wp-json\/wp\/v2\/posts\/206\/revisions\/3150"}],"wp:attachment":[{"href":"https:\/\/linguagemprisma.br4.biz\/blog\/wp-json\/wp\/v2\/media?parent=206"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/linguagemprisma.br4.biz\/blog\/wp-json\/wp\/v2\/categories?post=206"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/linguagemprisma.br4.biz\/blog\/wp-json\/wp\/v2\/tags?post=206"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}