PBToolboxAI v5 ← Site

angulargauge — u_pbt_angulargauge #

← Referência dos componentes · Índice do guia

Mostrador: um valor lido numa escala circular — um ponteiro, um arco cheio ou uma marca no rebordo, intervalos coloridos que dizem se está bem, um objetivo, uma leitura no formato à sua escolha.

▶ Ver ao vivo — Aplicação de demonstração, mosaico Angular gauge : a pré-visualização, o código que o produz e esta página, lado a lado.


Em resumo #

Userobjectu_pbt_angulargauge
Classe de itensn_pbt_angulargauge_range (of_range(key))
Serve paraLer uma grandeza num relance — velocidade, temperatura, grau de cumprimento de um objetivo, botão de termóstato
PrincípioVocê dá uma escala, um valor e intervalos; as marcas, os números, as cores e a animação são connosco
FamíliaGémeo de gauge: os mesmos métodos, os mesmos eventos e, geometria à parte, as mesmas propriedades — aqui os ângulos e as pontas arredondadas, ali a orientação e a colocação dos intervalos

Arranque rápido #

// A scale from 0 to 240, a number every 20
uo_dial.id_maximum = 240
uo_dial.id_tick_step = 20

// Three ranges of the scale, each with the tone of what it means
uo_dial.of_add_range(/*key*/ "city", /*from*/ 0, /*to*/ 130)
uo_dial.of_add_range(/*key*/ "fast", /*from*/ 130, /*to*/ 180)
uo_dial.of_add_range(/*key*/ "limit", /*from*/ 180, /*to*/ 240)
uo_dial.of_range(/*key*/ "city").is_tone = u_pbt_angulargauge.TONE_SUCCESS
uo_dial.of_range(/*key*/ "fast").is_tone = u_pbt_angulargauge.TONE_WARN
uo_dial.of_range(/*key*/ "limit").is_tone = u_pbt_angulargauge.TONE_DANGER

// The unit, and the value : the needle turns to it
uo_dial.is_unit = "km/h"
uo_dial.id_value = 96

A escala, o valor e os intervalos #

A escala vai de id_minimum a id_maximum (de 0 a 100 por omissão). O valor id_value relê-se tal como o deu: fora da escala é desenhado no batente da ponta mais próxima e a leitura escreve-o na mesma — um indicador que reescrevesse em silêncio o que a aplicação mediu mentiria duas vezes. Definido pelo código não lança nenhum evento, como SetItem: ue_value_changed diz o que o utilizador fez. NULL é ignorado: o valor anterior fica — teste uma medida que pode faltar (GetItemNumber devolve NULL) antes de a definir.

Os números seguem is_format, o formato de apresentação de um DataWindow (#,##0.0, $#,##0, 0% escreve a PARTE da escala — 50 em 0..200 dá 25 %, como a barra de progresso), com os separadores da língua de apresentação. Sem formato, é a escala que escolhe as casas decimais da leitura — duas para uma escala de 0 a 1, nenhuma para 0 a 100 —, nunca o valor, que escreveria 43 num segundo e 42,55 no seguinte; os números da escala tomam as do seu passo.

Um intervalo colore uma parte da escala: a sua cor é a que dá, senão a do seu tom (TONE_SUCCESS, TONE_WARN, TONE_DANGER, TONE_INFO = o acento do tema, TONE_NEUTRAL — um conjunto de cores por modo claro ou escuro), senão a da paleta. Os intervalos sobrepõem-se pela ordem em que foram acrescentados; of_current_range() diz em qual está o valor. Sob um ponteiro são a banda; sob um arco cheio, um anel no interior. Um intervalo contém o seu início mas não o seu fim: no limite que dois intervalos partilham (60 entre 0–60 e 60–85), o valor está no que começa aí, seja qual for a ordem em que foram acrescentados; a ponta da escala pertence ao intervalo que a atinge. A cor de paleta de um intervalo fica fixada quando é acrescentado: retirar um não muda a cor dos outros. Um intervalo inteiramente fora da escala não é desenhado.

Os ângulos contam-se em graus, 0 em cima, no sentido dos ponteiros do relógio: por omissão a escala começa em -135 (em baixo à esquerda) e cobre 270 graus — um velocímetro. ii_start_angle = -90 e ii_sweep_angle = 180 dão meio mostrador, desenhado duas vezes maior. Um mostrador é um instrumento de medida: não se inverte numa aplicação da direita para a esquerda.


Propriedades #

PropriedadeTipoOmissãoFunção
is_titlestring""O título, acima do mostrador. Marcação aceite; também nomeia o componente para um leitor de ecrã. Sem título, nomeia-o o texto simples da dica (is_super_tooltip_title, senão is_tooltip), senão a palavra « Medidor » na língua de apresentação
id_valuedouble0O valor. Desliza para o seu lugar; fora da escala, desenhado no batente e relido tal qual. Definido pelo código, mudo; NULL é ignorado, o valor anterior fica
id_minimumdouble0O início da escala. Uma escala cujo mínimo não está abaixo do máximo está vazia: nem marca, nem número, nem intervalo, nem indicador, nem objetivo, e of_current_range() devolve uma cadeia vazia. Para inverter uma escala, ib_reversed
id_maximumdouble100O fim da escala
is_formatstring""O formato de apresentação de todos os números — leitura, escala, extremos de um intervalo —, com a sintaxe de um formato de DataWindow (#,##0.00, $#,##0, 0%), separadores da língua de apresentação. Vazio = a leitura toma as casas decimais da escala (duas para 0 a 1, nenhuma para 0 a 100), os números da escala as do seu passo (0,0, 0,2… 1,0)
is_unitstring""Escrito depois do valor na leitura (%, km/h)
ib_show_valuebooleantrueMostra a leitura — o valor e a sua unidade — sob o pivô de um ponteiro (sob os números das duas pontas num mostrador pequeno), no meio de um arco cheio. Sem leitura, um mostrador de ponteiro é desenhado maior
id_tick_stepdouble0O passo entre duas marcas numeradas. 0 = escolhido pela escala: um passo redondo (1, 2, 2,5 ou 5 vezes uma potência de dez, depois 3, 4,5 ou 6) que cai nas duas pontas quando existe — de 0 a 90 de 10 em 10, de −50 a 50 de 25 em 25, de 0 a 360 de 60 em 60 —, senão contado a partir do mínimo (de 32 a 212 de 20 em 20). Um passo que der conta-se sempre a partir do mínimo; um passo que desenharia mais de 200 marcas volta ao automático. Cada ponta tem uma marca numerada. Quando os números não cabem todos, escreve-se um em cada k para manter um passo regular, e as duas pontas são sempre escritas. Os números tomam as casas decimais do seu passo. O passo escolhido nunca é mais fino do que o que is_format escreve (de 0 a 3 no formato #,##0: 0, 1, 2, 3); um passo que dá continua a ser o seu, e o formato arredonda os seus números. Num mostrador demasiado pequeno para um círculo de números não se escreve nenhum; num arco cheio pequeno a leitura desloca-se para manter as duas pontas
ii_minor_ticksinteger4Marcas pequenas entre duas numeradas (0 a 9)
ib_show_ticksbooleantrueMostra as marcas
ib_show_labelsbooleantrueMostra os números da escala; num mostrador demasiado pequeno para um círculo de números não se escreve nenhum — a leitura e os intervalos continuam a falar
id_targetdouble0Um objetivo — uma meta, um limiar —, marcado de través sobre a banda enquanto ib_show_target for verdadeiro
ib_show_targetbooleanfalseMostra a marca de id_target
is_pointerstringneedleComo o valor se mostra (constantes POINTER_*): NEEDLE, um ponteiro; BAR, a banda cheia desde o mínimo — um indicador cheio, o número ao centro; MARKER, um triângulo no rebordo. Desconhecido = NEEDLE
il_value_colorlong-1A cor do valor — o ponteiro, o arco cheio ou a marca; -1 = o acento do tema
il_track_colorlong-1A cor de a banda; -1 = um tom da cor do texto do tema
ii_thicknessinteger0A espessura da banda, em píxeis (0 a 80, nunca mais de metade do raio); 0 = automática: uma parte do raio, mantida entre 6 e 24 px sob um ponteiro ou uma marca, entre 8 e 36 px para um arco cheio — um mostrador grande continua a ser um mostrador. Os números da escala (11 a 16 px) e a leitura crescem com ele
ib_reversedbooleanfalseO máximo no início do arco: a escala roda no sentido contrário ao dos ponteiros do relógio. Direita e Cima continuam a rodar no sentido dos ponteiros: num mostrador invertido baixam o valor
ii_start_angleinteger-135Onde começa a escala, em graus: 0 em cima, 90 à direita, -90 à esquerda (450 relê-se 90)
ii_sweep_angleinteger270Quanto do círculo a escala cobre, em graus (10 a 360). Um ângulo negativo vale o seu valor absoluto: para a escala rodar no outro sentido, ib_reversed. O mostrador ajusta-se ao espaço que o ângulo ocupa
ib_editablebooleanfalseO utilizador move o valor: rodar a agulha em torno do pivô, clicar no mostrador, setas, Page Up / Down (dez passos), Home e End. Um clique perto do pivô, na leitura ou longe do mostrador (para lá da faixa e das marcas ao lado) não põe nada; durante um arrasto a mão pode sair do mostrador, o valor fica na ponta de onde vem e nunca salta a abertura. Direita e Cima rodam no sentido horário, como um botão rotativo, por onde quer que passe o arco (num mostrador invertido baixam o valor). Cada gesto lança ue_value_changed uma vez — uma tecla, como a mão, põe o valor de uma vez, e um arrasto interrompido (caixa de mensagem, Alt+Tab) termina como ao largar; Esc durante um arrasto repõe o valor (um valor escrito pelo seu código entretanto fica) sem premir o botão Cancelar da janela; a tecla Menu nomeia o intervalo em que está o valor
id_stepdouble0O passo da mão e das teclas; 0 = a precisão que a leitura mostra (as casas decimais de is_format, ou as que a escala escolhe): numa escala de 0 a 7 a mão dá 2,6, nunca um 2,61 que o utilizador não leu; uma tecla avança um centésimo da escala, nunca menos de um algarismo mostrado. As duas pontas continuam alcançáveis quando o passo não divide a escala: de 0 a 100 de 30 em 30, o valor passa por 0, 30, 60, 90, 100
ib_track_dragbooleanfalseCom ib_editable, opcional: enquanto o utilizador arrasta o valor, ue_value_tracking segue a mão — um volume ouvido em direto, uma pré-visualização redesenhada. ue_value_changed continua a chegar uma só vez, ao largar; quando um arrasto é interrompido (Esc, ib_editable ou ib_enabled postos a false pelo código), ue_value_tracking diz também o valor de onde partiu
ib_value_tooltipbooleantrueO painel que nomeia o intervalo sob o ponteiro, com os seus extremos. Não é is_tooltip, a dica do componente inteiro. A dica de um intervalo (o seu is_tooltip) é escrita neste painel, mesmo a false
ib_value_follows_rangebooleanfalseOpcional: o valor — a agulha, o arco cheio ou a marca — toma a cor do intervalo em que está (o desenhado por cima se dois se sobrepõem): vermelho na zona vermelha. Fora de qualquer intervalo mantém il_value_color, senão o acento do tema. Enquanto o valor desliza, a cor segue o valor desenhado
ib_roundedbooleanfalseOpcional: pontas arredondadas na faixa, no arco cheio e nos intervalos. Cada um é encurtado meia espessura em cada ponta para ficar na sua parte da escala; um intervalo mais curto do que a sua própria espessura torna-se um ponto. Um círculo completo mantém a faixa fechada
ib_pointer_tooltipbooleanfalseOpcional: o painel nomeia também o valor sob o rato — na agulha, no arco cheio ou na marca — e o objetivo, com o seu número no formato da leitura. Os intervalos mantêm o seu próprio painel (ib_value_tooltip)
id_origindouble0Onde começa o arco cheio (POINTER_BAR): um valor abaixo da origem enche no outro sentido — um desvio, uma variância, uma escala de −50 a 50 que começa em 0. Enquanto não for definida — ou depois de reposta a NULL —, o arco começa no mínimo e a propriedade relê o mínimo; fora da escala, na ponta mais próxima. O gémeo de id_origin de gauge
ib_auto_heightbooleanfalseO componente anuncia a sua altura ideal e o userobject ajusta-se (ue_auto_height). A largura dita-a: meio mostrador tem metade da altura
ib_enabledbooleantrueA cinzento continua a mostrar o seu valor mas deixa de responder: nem clique, nem teclas, nem arrasto, e sai da ordem de tabulação
ib_animatedbooleantrueO valor desliza para o seu lugar, imagem a imagem — o ponteiro roda —, e chega desde o início da escala (o seu mínimo) quando o componente se desenha. Uma propriedade alterada durante o deslize (título, unidade, cor, tamanho) não o interrompe. Um posto configurado para reduzir animações nunca anima; a mão do utilizador nunca é animada; um valor definido sob of_set_redraw(false) desliza ao retomar
ii_anim_durationinteger450Duração do deslize, em milissegundos (0 a 5000)
is_anim_easingstringease-outA curva do deslize (constantes EASING_*, os nomes de LiveCharts2): back-out passa e volta, bounce-out ressalta, elastic-out estala. Uma ultrapassagem fica na escala. Desconhecido = ease-out
is_theme_stylestring""Estilo visual do componente (constantes THEME_STYLE_*); vazio = o da aplicação, seguido a cada mudança
is_theme_modestring""Variante clara ou escura (constantes THEME_MODE_*); vazio = a da aplicação, seguida a cada mudança
il_theme_accentlong-1Cor de acento deste componente (-1 = acento do tema)
is_tooltipstring""Dica simples mostrada ao passar sobre o componente
is_super_tooltip_titlestring""Título da dica enriquecida (tem precedência sobre is_tooltip)
is_super_tooltip_textstring""Texto da dica enriquecida (marcação rica aceite)
is_super_tooltip_imagestring""Imagem da dica enriquecida

Métodos #

MétodoFunção
of_add_range ( string as_key, double ad_from, double ad_to { , long al_color } )Acrescenta um intervalo colorido de ad_from a ad_to (extremos escritos ao contrário são desenhados no sentido certo); a sobrecarga com cor fixa-a, senão o tom e depois a paleta. Devolve 0 depois de acrescentado, -5 se a chave estiver vazia, contiver / ou `, ou já existir (acrescentar nunca substitui), -2` se o componente não estiver criado. A cor de paleta é dada ao acrescentar: retirar um intervalo não muda a cor dos outros
of_clear_ranges ( )Retira todos os intervalos — os seus handles vão com eles —, o valor e as definições ficam. Devolve 0 depois de feito, -2 se o componente não estiver criado
of_current_range ( )A chave do intervalo em que o valor está agora, uma cadeia vazia se não estiver em nenhum ou se a escala estiver vazia. Onde dois intervalos se sobrepõem, ganha o último acrescentado — o desenhado por cima. Um intervalo oculto não conta; um intervalo que o modo demo não desenha conta: o que este método lê nunca depende da licença. Um intervalo contém o seu início mas não o seu fim: no limite comum de dois intervalos, o valor está no que começa aí, seja qual for a ordem em que foram acrescentados; a ponta da escala pertence ao intervalo que a atinge. Um intervalo fora da escala (não desenhado) também conta
of_range ( string as_key )O handle n_pbt_angulargauge_range de um intervalo, para ler ou mudar os extremos, a cor, o tom, o nome ou a visibilidade
of_remove_range ( string as_key )Retira um intervalo; o seu handle é destruído. Devolve 0 depois de retirado, -5 se nenhum intervalo tiver essa chave, -2 se o componente não estiver criado
of_reset ( )Esvazia os intervalos — handles incluídos — e repõe todas as propriedades no valor de origem. Devolve 0 depois de feito, -2 se o componente não estiver criado

Eventos #

EventoLançado quando
ue_value_changed (double ad_value)Só com ib_editable: o utilizador moveu o valor — uma vez por arrasto (ao largar, ou quando o arrasto é interrompido: uma caixa de mensagem aberta sob a mão, Alt+Tab), por clique, por tecla. Um valor definido pelo seu código não o lança, nem durante um arrasto. Para seguir a mão durante o arrasto: ib_track_drag
ue_value_tracking (double ad_value)Só com ib_editable e ib_track_drag, enquanto o utilizador arrasta o valor: cada nova posição da mão, depois — quando o arrasto é interrompido: Esc, ou ib_editable / ib_enabled postos a false pelo seu código — o valor de onde partiu. O valor final continua a chegar uma vez em ue_value_changed
ue_range_clicked (string as_key)Um intervalo foi clicado — ou validado com Enter ou Espaço no intervalo do teclado (Tab, depois as setas). Não num componente editável: aí um clique define o valor
ue_range_rclicked (string as_key, long al_x, long al_y)Clique direito num intervalo, ou tecla Menu (Shift+F10) no intervalo do teclado — num componente editável, o intervalo em que está o valor: o sítio onde abrir um menu; al_x, al_y: onde abrir o menu, em píxeis de ecrã — o ponteiro, ou pelo teclado (tecla Menu, Shift+F10) o meio do intervalo; um contextmenu abre-se aí tal como estão (uo_menu.of_show(al_x, al_y))
ue_auto_height (long al_height)Com ib_auto_height: o userobject acabou de ser redimensionado para a sua altura ideal

Propriedades de item #

Um intervalo designa-se pela sua chave: uo_dial.of_range("warn").is_tone = u_pbt_angulargauge.TONE_WARN.

PropriedadeTipoOmissãoFunção
id_fromdouble0O início do intervalo, na escala
id_todouble0O seu fim. Extremos ao contrário desenham-se no sentido certo e relêem-se tal qual
il_colorlong-1A sua cor; -1 = a do seu tom, senão a da paleta. As cores de item herdadas (il_accent, il_back_color, il_text_color e as suas variantes ao passar) não têm efeito num intervalo: decidem il_color e is_tone
is_tonestring""O seu tom (constantes TONE_* do componente): SUCCESS, WARN, DANGER, INFO (o acento do tema), NEUTRAL — um conjunto por modo claro ou escuro, maiúsculas ou minúsculas indiferentes. il_color prevalece; um tom desconhecido vale nenhum tom
is_labelstring""O seu nome, no painel sob o ponteiro e para um leitor de ecrã; vazio = a sua chave. Marcação aceite
ib_visiblebooleantrueEsconde o intervalo sem o retirar; como uma caixa de verificação, não lança nenhum evento
is_tooltipstring""A sua dica, escrita no painel que nomeia o intervalo sob o ponteiro — nunca uma segunda bolha. Marcação aceite
is_super_tooltip_titlestring""O título a negrito da sua dica, escrito no painel sob o seu nome
is_super_tooltip_textstring""O texto da sua dica, no painel. Marcação aceite
is_super_tooltip_imagestring""Uma imagem no topo da sua dica, no painel (caminho do bundle, caminho absoluto ou resources.dll:nome)

Exemplos #

Um painel que vive #

// Timer event of the window : the needle turns to each new reading
uo_dial.id_value = ids_monitor.GetItemNumber(1, "speed")

// Which range is it in now ? An alert outside the good one
st_alert.visible = (uo_dial.of_current_range() <> "city")

Um meio indicador cheio #

// The band fills from the minimum, the number in the middle
uo_dial.is_pointer = u_pbt_angulargauge.POINTER_BAR

// From the left, over half a circle : the upper half
uo_dial.ii_start_angle = -90
uo_dial.ii_sweep_angle = 180

// A scale from 0 to 1, written as a percentage
uo_dial.id_maximum = 1
uo_dial.is_format = "0%"
uo_dial.id_value = 0.72

Um desvio em torno de zero #

// A scale centred on zero : the filled arc starts at 0, not at the minimum
uo_dial.is_pointer = u_pbt_angulargauge.POINTER_BAR
uo_dial.id_minimum = -50
uo_dial.id_maximum = 50
uo_dial.id_origin = 0

// Below the budget, the arc fills to the left of 0
uo_dial.id_value = -18

Um valor que o utilizador ajusta #

// The user moves the value, by steps of 5
uo_dial.ib_editable = true
uo_dial.id_step = 5

// Event ue_value_changed of uo_dial : apply what the user chose
ii_level = Integer(ad_value)

Um volume ajustado em direto #

// The user drags the value, and the sound follows the hand
uo_dial.ib_editable = true
uo_dial.ib_track_drag = true

// Event ue_value_tracking of uo_dial : the volume heard while the hand moves
inv_player.ii_volume = Integer(ad_value)

// Event ue_value_changed of uo_dial : the volume kept when the hand lets go
ii_saved_volume = Integer(ad_value)

Um indicador moderno #

// A filled arc with round ends, in the colour of the zone it is in
uo_dial.is_pointer = u_pbt_angulargauge.POINTER_BAR
uo_dial.ib_rounded = true
uo_dial.ib_value_follows_range = true

// The goal, and its number under the mouse
uo_dial.id_target = 85
uo_dial.ib_show_target = true
uo_dial.ib_pointer_tooltip = true
uo_dial.id_value = 74

Um menu num intervalo #

// Event ue_range_rclicked of uo_dial : remember the range, then open the menu
// at the pointer of the window
is_menu_range = as_key
m_range.PopMenu(/*xlocation*/ w_main.PointerX(), /*ylocation*/ w_main.PointerY())

Uma imagem do mostrador para um relatório #

// The dial as it is on screen, title and readout included, to a PNG file
uo_dial.of_save_as_png(/*path*/ "C:\Reports\speed.png")

// The same, printed into a PDF file without any dialog
uo_dial.of_print_to_pdf(/*path*/ "C:\Reports\speed.pdf")

Boas práticas #


Herdado da base comum #

Estes membros existem em todos os componentes visuais — não são próprios deste. São detalhados uma só vez, nos capítulos transversais; esta tabela apenas diz onde os ler.

MembrosFunçãoDetalhado em
of_count · of_keys_at · of_hasPercorrer o que o componente contém3.2 Os items
of_resetRepor o componente a zero3.6 Repor um componente a zero: of_reset()
of_register_shortcut · of_clear_shortcutsAtalhos de teclado do componente3.5 Os atalhos de teclado
of_is_created · of_is_ready · of_get_last_errorSe nasceu, se está pronto, o que falhou3.7 Diagnóstico
of_save_as_png · of_save_as_jpgExportar a renderização como imagem3.8 Exportar a representação como imagem
of_set_redrawAgrupar as alterações num único repinte3.10 Boas práticas
of_preload_iconsÍcones mostrados sem atrasoApresentação instantânea: of_icon
of_set_translationTraduzir uma legenda do componente5.2 Adaptar uma etiqueta: of_set_translation
of_focus_webviewDar o foco ao componente6.4 Teclado e focus
of_print · of_print_to_pdfImprimir, ou escrever um PDF6.9 Imprimir
of_set_property · of_get_property · of_component_nameControlar uma propriedade pelo nome3.1 O motor de propriedades
is_accessible_name · is_accessible_descriptionO nome e a descrição que um leitor de ecrã diz3.4 Propriedades e eventos opcionais

Duas ajudas não são herdadas: of_icon e of_escape_markup vivem em n_pbt_utils. Declare um — n_pbt_utils lnv_utils, nada a criar — e chame-as nele.

← Referência dos componentes · Índice do guia