Delphi, C++Builder & .NET Telas ao vivo

O Pacote Realtime UI do sgcUI

Tudo o que uma tela que acompanha um sistema ao vivo precisa, integrado aos produtos sgcUI que você já usa: quem está online, toasts e uma caixa de entrada de notificações com um emblema de não lidas, um feed de atividades com trilha de auditoria e um visualizador de log ao vivo. Um servidor os alimenta por WebSocket, MQTT ou server-sent events, ou o seu código os controla diretamente.

VCLFireMonkeyWinFormsWPFAvalonia
A demo Realtime do sgcUI: uma lista da equipe com indicadores de presença, o feed de atividades, a caixa de entrada de notificações acima das preferências de notificação, um sino com a contagem de não lidas, os avatares da equipe e uma grade de log ao vivo

Cinco produtos, uma tela ao vivo

O pacote Realtime UI não é um produto separado. Cada peça fica no produto sgcUI a que pertence, nas units, nos pacotes e nos pacotes NuGet que você já usa, e segue a edição desse produto. Toda peça exige apenas o sgcUICore e o produto que a contém, e nenhuma exige o sgcHTML.

Presença e avatares

Quem está online, ausente, ocupado ou offline, com avatares, um grupo de avatares e um indicador de presença.

Produto: sgcUICore.

Presença →

Notificações

Um modelo de notificações com toasts, uma caixa de entrada, preferências por categoria e canal, e um emblema de não lidas na toolbar.

Produtos: sgcNavigation e sgcToolbar.

Notificações →

Feed de atividades e trilha de auditoria

Quem fez o quê em qual objeto, como um feed, como uma tabela de auditoria e como tiles do dashboard.

Produto: sgcDashboard.

Atividades →

Visualizador de log ao vivo

Uma grade que acompanha as linhas de log mais novas, com pausa, filtros e exportação.

Produto: sgcGrid.

Logs ao vivo →

Fontes ao vivo

Conexões WebSocket, MQTT e server-sent events do sgcWebSockets que alimentam cada modelo.

Produto: sgcUICore, bridge sgcUICoreWS.

Dados ao vivo →

Delphi 7 a Delphi 13 com VCL, FireMonkey a partir do Delphi XE6, C++Builder, e .NET WinForms, WPF e Avalonia. Leia o tópico de ajuda do pacote Realtime UI.

Presença e avatares

Mostre quem está online, em todos os produtos sgcUI.

TsgcUIPresenceModel mantém os usuários e o seu status (online, ausente, ocupado ou offline) com um texto de status. Os controles de avatar acompanham o modelo, de modo que uma mudança de status repinta de uma só vez todos os avatares e indicadores desse usuário.

  • O modelo de presença recebe as suas mudanças de AddOrUpdate e SetStatus no código, ou de uma mensagem ao vivo por mudança.
  • Um avatar, um grupo de avatares com um chip "+N" para os usuários que não cabem, e um indicador de presença com o ponto de status e o texto de status.
  • O feed de atividades do sgcDashboard lê o mesmo modelo, de modo que cada autor mostra o seu avatar e o seu status.
Produto
sgcUICore, compartilhado por todos os produtos sgcUI
Delphi e C++Builder
TsgcVCLAvatar, TsgcVCLAvatarGroup, TsgcVCLPresenceIndicator e os seus gêmeos TsgcFMX
Edição
Todas as edições, Community inclusive, e também as mensagens de presença ao vivo

Ajuda: Presença e Avatares e indicador de presença.

Toasts, caixa de entrada, preferências e emblemas

Uma central de notificações para aplicações desktop.

TsgcNotificationModel guarda as notificações com o seu título, severidade, categoria e estado de leitura, e mantém a contagem de não lidas. O gerenciador de toasts, a caixa de entrada, as preferências e o vínculo de emblema o acompanham.

  • Toasts: um toast para cada nova notificação não lida, que pausa enquanto o ponteiro está sobre ele.
  • Caixa de entrada de notificações: as notificações agrupadas por dia, todas ou só as não lidas, com Marcar tudo como lido.
  • Preferências de notificação: uma linha por categoria e uma coluna por canal, com o seu editor. Desativar o canal pop-up de uma categoria interrompe os seus toasts, e a caixa de entrada continua a listá-los.
  • Emblema de não lidas: o TsgcToolbarBadgeLink do sgcToolbar mostra a contagem de não lidas em um item da toolbar ou do ribbon, 99+ acima de 99.
Produtos
sgcNavigation (modelo, toasts, caixa de entrada e preferências) e sgcToolbar (vínculo de emblema)
Delphi e C++Builder
TsgcVCLToastManager, TsgcVCLNotificationInbox, TsgcVCLNotificationPrefsEditor e os seus gêmeos TsgcFMX
Edição
sgcUI Standard, Professional, Enterprise, All-Access e Trial, e o sgcNavigation e o sgcToolbar vendidos isoladamente. Os pacotes .NET Community gratuitos também incluem. A edição Community do Delphi traz somente o sgcGrid. As mensagens de notificação ao vivo e um ribbon como destino do emblema são Registrada.

Ajuda: Notificações, Toasts, Caixa de entrada de notificações, Preferências de notificação, Mensagens ao vivo de notificações e TsgcToolbarBadgeLink.

Feed de atividades e trilha de auditoria

Quem fez o quê, e o que mudou.

TsgcDashboardActivityModel registra cada atividade como um autor, um verbo e um objeto, com os campos que mudaram. O feed de atividades e a trilha de auditoria são duas visões do mesmo modelo.

  • Feed de atividades: a atividade mais recente primeiro, com tempos relativos e o avatar de cada autor vindo do modelo de presença.
  • Trilha de auditoria: uma tabela cujas linhas se expandem até os campos alterados.
  • Ambos são controles independentes e também tiles de atividades e de auditoria para um dashboard.
Produto
sgcDashboard
Delphi e C++Builder
TsgcVCLActivityFeed, TsgcVCLAuditTrail, TsgcVCLDashboardActivityTile, TsgcVCLDashboardAuditTile e os seus gêmeos TsgcFMX
Edição
sgcUI Professional, Enterprise, All-Access e Trial, as edições que incluem o sgcDashboard, e o sgcDashboard vendido isoladamente. Os pacotes .NET Community gratuitos também incluem. A edição Community do Delphi traz somente o sgcGrid. As mensagens de atividade ao vivo são Registrada.

Ajuda: Feed de atividades, Mensagens de atividade ao vivo, Tile de atividades e Tile de auditoria.

Um visualizador de log ao vivo no sgcGrid

Acompanhe milhares de linhas de log sem travar a tela.

TsgcGridLogModel guarda as linhas de log com hora, um nível de trace a fatal, uma origem e uma mensagem, e o TsgcGridLogLink as mostra em um sgcGrid no modo virtual. O modelo de log é thread safe, de modo que uma thread de trabalho pode acrescentar linhas diretamente.

  • Acompanhamento do fim: rolar para cima para de acompanhar e rolar de volta até o fim retoma, e Pausar congela a visão enquanto o usuário lê.
  • Linhas coloridas por nível, filtros por nível, origem e texto, regras de destaque e exportação.
  • Uma rajada de linhas de log vinda de uma thread de socket custa uma única visita à thread principal.
Produto
sgcGrid
Delphi e C++Builder
TsgcGridLogModel e TsgcGridLogLink com um TsgcVCLGrid ou um TsgcFMXGrid
Edição
Todas as edições, Community inclusive. As mensagens de log ao vivo são Registrada.

Ajuda: Visualizador de log, TsgcGridLogModel e TsgcGridLogLink.

Fontes ao vivo por WebSocket, MQTT e SSE

As fontes ao vivo da bridge sgcUICoreWS recebem as mensagens JSON que um servidor envia por uma conexão do sgcWebSockets e as entregam aos modelos. Os controles acompanham na hora, sem nenhum código seu.

FonteCliente sgcWebSocketsEvento que lêSeleciona as mensagens por
TsgcUILiveSource_WebSocketTsgcWebSocketClientOnMessage, toda mensagem de textoUm filtro sobre um membro da mensagem
TsgcUILiveSource_MQTTTsgcWSPClient_MQTTOnMQTTPublish, toda publicaçãoUm filtro de tópico MQTT
TsgcUILiveSource_SSETsgcHTTP1ClientOnSSEMessage, o fluxo de eventosO tipo de evento SSE
  • A fonte nunca conecta, assina nem envia. A URL, as credenciais, o TLS e a reconexão pertencem ao cliente, e o gancho sobrevive a uma reconexão do WatchDog.
  • Uma fonte alimenta vários modelos por meio dos seus bindings, de modo que uma conexão pode controlar uma tela inteira. Um binding pode desembrulhar um envelope da aplicação, e o seu próprio tratador do evento do cliente continua a ser disparado.
  • Os modelos são sempre chamados na thread principal. As mensagens que chegam em uma thread de socket entram em fila e são aplicadas em uma única visita à thread principal, na ordem de chegada.
  • A bridge é somente de entrada. Quando o usuário lê ou dispensa uma notificação, a aplicação envia o seu próprio frame pelo mesmo cliente.

Os quatro formatos de mensagem

Não há um novo protocolo. Cada modelo lê a mensagem ao vivo do seu feed: um objeto JSON por mudança, com um membro type que nomeia o feed e um membro op.

FeedtypeopModelo
Presençapresence, opcionalupsert, remove, snapshot, clearTsgcUIPresenceModel
Notificaçõesnotification, obrigatórioadd, update, remove, read, unread, snapshotTsgcNotificationModel
Atividadesactivity, obrigatórioadd, update, remove, snapshotTsgcDashboardActivityModel
Loglog, opcionalappend, batch, clearTsgcGridLogModel
messages.json
{"type":"presence","op":"upsert","user":{"id":"u7","presence":"away","statusText":"Lunch"}}
{"type":"notification","op":"add","notification":{"id":"n2","title":"Build 812 passed","severity":"success"}}
{"type":"activity","op":"add","item":{"id":"a20","actorId":"u7","verb":"updated","objectName":"Invoice INV-17"}}
{"type":"log","op":"append","entry":{"level":"warning","source":"api","message":"Slow query"}}
Delphi, um tópico MQTT por feed
oSource := TsgcUILiveSource_MQTT.Create(Self);
oSource.Client := MQTT;
// um binding por modelo, selecionado pelo seu tópico
oBinding := oSource.Bindings.Add;
oBinding.Target := PresenceModel;
oBinding.Topic := 'ops/presence';
oBinding := oSource.Bindings.Add;
oBinding.Target := NotificationModel;
oBinding.Topic := 'ops/notifications';
oBinding := oSource.Bindings.Add;
oBinding.Target := ActivityModel;
oBinding.Topic := 'ops/activity';
oBinding := oSource.Bindings.Add;
oBinding.Target := LogModel;
oBinding.Topic := 'ops/log/+';
// a fonte nunca assina: assine no OnMQTTConnect do cliente
MQTT.Subscribe('ops/#');

As fontes ao vivo são somente Registrada e exigem o sgcWebSockets, como toda bridge do sgcUI com o sgcWebSockets. Sem um servidor, ou em um build Community, a aplicação chama a API de cada modelo: AddOrUpdate e SetStatus do modelo de presença, Add ou Post do modelo de notificações, Add do modelo de atividades e Append do modelo de log.

Leia o tópico de ajuda Fontes ao vivo

A demo Realtime

Um console de operações para uma equipe de doze pessoas, controlado por um simulador

A demo Realtime para Delphi VCL no tema escuro: a lista da equipe, o feed de atividades, a caixa de entrada e as preferências de notificação, o emblema do sino, o grupo de avatares e a grade de log ao vivo

A demo Realtime da suíte monta um console de operações com o pacote. A toolbar traz um sino cujo emblema é a contagem de não lidas, o avatar do usuário atual e o grupo de avatares da equipe. Uma lista mostra cada membro com um indicador de presença, uma aba guarda o feed de atividades e outra a trilha de auditoria, a caixa de entrada de notificações fica acima do editor de preferências, uma grade de log acompanha as linhas mais novas e os toasts aparecem no canto inferior direito.

  • Alterne entre claro, escuro e alto contraste, ou espelhe a janela da direita para a esquerda, enquanto ela executa
  • Um simulador determinístico monta cada mudança como a mensagem ao vivo do seu modelo, de modo que a demo não precisa de servidor nem de sgcWebSockets
  • Execute-a com --test result.txt para as suas autoverificações, uma linha PASS ou FAIL numerada para cada uma
Plataformas
Delphi VCL (Delphi 7 a 13) e FireMonkey (Delphi 13), C++Builder, .NET WinForms, WPF e Avalonia
Edição necessária
sgcUI Professional, Enterprise, All-Access ou Trial, as edições que incluem o sgcDashboard. Um build Registrada aplica cada mudança como uma mensagem ao vivo, e um build com os pacotes .NET Community gratuitos pela API do modelo.
Código-fonte
Demos\Suite\Delphi\Realtime (sgcUIRealtime.dpr), Demos\Suite\FMX\Realtime (sgcUIRealtimeFMX.dpr), Demos\Suite\CBuilder\Realtime e demos\Suite\Realtime na pasta do .NET

Produtos sgcUI incluídos

Veja também as outras demos da suíte sgcUI.

A demo Realtime para Delphi FireMonkey no tema claro
FireMonkey, tema claro
A demo Realtime para Delphi FireMonkey no tema escuro
FireMonkey, tema escuro

O mesmo pacote no WinForms, WPF e Avalonia

Os modelos, os controles e as fontes ao vivo têm os mesmos nomes e leem as mesmas mensagens JSON no .NET, nos pacotes NuGet de cada produto.

  • Modelos: TsgcUIPresenceModel (namespace esegece.sgcUICore), TsgcNotificationModel e TsgcNotificationPreferences (esegece.sgcNavigation), TsgcToolbarBadgeLink (esegece.sgcToolbar), TsgcDashboardActivityModel (esegece.sgcDashboard) e TsgcGridLogModel com TsgcGridLogLink (esegece.sgcGrid).
  • Controles: TsgcWinFormsAvatar, TsgcWinFormsToastManager, TsgcWinFormsNotificationInbox, TsgcWinFormsActivityFeed, TsgcWinFormsAuditTrail e os demais controles, cada um com o seu gêmeo TsgcWpf e TsgcAvalonia.
  • Fontes ao vivo: TsgcUILiveSource_WebSocket, TsgcUILiveSource_MQTT e TsgcUILiveSource_SSE no pacote esegece.sgcUICore.sgcWebSockets, somente Registrada.
  • Os pacotes Community gratuitos no NuGet, como esegece.sgcNavigation.Community e esegece.sgcGrid.Community, deixam de fora as partes marcadas como Registrada nesta página.
  • A demo .NET tem hosts WinForms, WPF e Avalonia sobre um único projeto compartilhado com os modelos, o simulador e a autoverificação.

Ajuda: Pacotes .NET e Pacote Realtime UI.

Community e Registrada

Cada peça segue a edição do seu produto. A coluna Community mostra o que os pacotes .NET Community gratuitos incluem. A edição Community do Delphi traz somente o sgcGrid, com o sgcUICore, então no Delphi ela tem as peças de presença e de log.

PeçaProdutoCommunityRegistrada
Modelo de presença com as suas mensagens ao vivo, avatares, grupo de avatares e indicador de presençasgcUICore
Modelo de notificações, toasts, caixa de entrada e preferênciassgcNavigation
Mensagens de notificação ao vivosgcNavigation—
Vínculo de emblema com uma toolbarsgcToolbar
Vínculo de emblema com um ribbonsgcToolbar—
Modelo de atividades, feed de atividades, trilha de auditoria e os dois tilessgcDashboard
Mensagens de atividade ao vivosgcDashboard—
Modelo de log e vínculo de logsgcGrid
Mensagens de log ao vivosgcGrid—
Fontes ao vivo por WebSocket, MQTT e SSE (bridge sgcUICoreWS, exige o sgcWebSockets)sgcUICore—

Na suíte sgcUI, o sgcNavigation, o sgcToolbar e o sgcGrid estão em todas as edições a partir da Standard e o sgcDashboard a partir da Professional, e a edição Community gratuita do Delphi tem somente o sgcGrid. O sgcUICore acompanha todo produto, e todo produto também é vendido isoladamente, para Delphi e para .NET. Veja a matriz de recursos, o tópico de ajuda Edições e os preços.

Perguntas frequentes

Não. Cada peça fica no produto sgcUI a que pertence: presença e avatares no sgcUICore, notificações no sgcNavigation, o emblema de não lidas no sgcToolbar, o feed de atividades e a trilha de auditoria no sgcDashboard, e o visualizador de log no sgcGrid. Você as recebe com esses produtos, nas mesmas units, pacotes e pacotes NuGet.

Só para as fontes ao vivo da bridge sgcUICoreWS. Os modelos e os controles exigem apenas o sgcUICore e o seu próprio produto, e uma aplicação sem servidor os controla pelo código. Nenhuma das peças exige o sgcHTML.

Qualquer servidor que envie um objeto JSON por mudança por WebSocket, por um broker MQTT ou como server-sent events. Os quatro formatos de mensagem estão documentados e as fontes não definem nenhum protocolo próprio. Um binding também pode desembrulhar o envelope de um protocolo de aplicação existente.

A bridge é somente de entrada. Quando o usuário lê ou dispensa uma notificação, a aplicação envia o seu próprio frame pelo mesmo cliente sgcWebSockets. O tópico de ajuda Fontes ao vivo traz um exemplo.

Não. As mensagens que chegam em uma thread de socket entram em fila e são aplicadas em uma única visita à thread principal, de modo que uma rajada de 1.000 linhas de log custa uma visita. O modelo de log também é thread safe, de modo que uma thread de trabalho pode acrescentar linhas diretamente. No Delphi 7 a 2009, mantenha a notificação padrão do cliente, que notifica na thread principal.

No Delphi, a edição Community gratuita traz somente o sgcGrid, com o sgcUICore: o modelo de presença com suas mensagens ao vivo, os avatares, o modelo de log e o link de log. Os pacotes .NET Community gratuitos também têm os modelos e os controles de notificação, emblema e atividade. As mensagens ao vivo dos modelos de notificações, atividades e log, um ribbon como destino do emblema e as fontes ao vivo são somente Registrada.

Páginas dos produtos: sgcNavigation, sgcToolbar, sgcDashboard, sgcGrid, sgcWebSockets e a suíte sgcUI.

Melhor custo-benefício: All-AccessTodos os produtos da eSeGeCe, com Suporte Premium incluído, a partir de €1,059/ano.
Ver preços do All-Access

Crie as suas telas ao vivo com o sgcUI

O trial All-Access inclui todos os produtos sgcUI, para você experimentar cada peça do pacote.