Zbuduj pulpit biznesowy bez kodu układu. Upuść kafelki na siatkę o 12 kolumnach, umieść w każdym kartę KPI, wykres, mapę lub podgląd raportu, przełącz cały ekran na ciemny motyw jedną właściwością i pozwól użytkownikom przeciągać, zmieniać rozmiar i zapisywać własny układ. Tile launcher daje aplikacji ekran startowy z kafelkami w grupach.
Osiemnaście możliwości w ośmiu grupach, z prawdziwymi nazwami komponentów i właściwości oraz linkiem do każdego tematu pomocy. Funkcje oznaczone jako Registered nie wchodzą w skład bezpłatnej wersji .NET Community.
Siatka, która sama układa kafelki, i karty pokazujące liczby.
Układ i zawartość
Pulpit to siatka kafelków, która musi pozostać uporządkowana przy każdym rozmiarze okna i każdym DPI. Upuść pulpit na formularz, dodaj kafelki i nadaj każdemu kolumnę, wiersz i rozpiętość. Siatka wylicza szerokości kolumn z dostępnej szerokości, skaluje odstępy i wysokości wierszy według DPI monitora i przewija się w pionie, gdy kafelki potrzebują więcej wierszy, niż się mieści. Nakładające się kafelki są przesuwane o wiersz w dół, nigdy jeden na drugim. Ponieważ układ mieszka w jednym silniku, te same komórki kafelków dają ten sam układ w VCL, FireMonkey i widokach .NET.
TsgcVCLDashboard z Columns (domyślnie 12), RowHeight (120), Gap i Padding (12)TsgcVCLDashboardTile z Col, Row, ColSpan i RowSpanLayout.PlacedCell i Layout.Rect
Układ i zawartość
Gdy zawartość pulpitu zależy od użytkownika lub danych, nie chcesz wyliczać współrzędnych. Zostaw kolumnę i wiersz kafelka równe -1, a auto-flow umieści go w pierwszym wolnym miejscu, skanując wiersze od góry i kolumny od lewej. Ustal tylko kolumnę, a kafelek trafi do pierwszego wolnego wiersza w tej kolumnie. Mieszaj kafelki o stałym i płynnym położeniu na tym samym pulpicie.
AutoFlow jest domyślnie włączone; nowy kafelek zaczyna od Col i Row równych -1 i rozpiętości 3 na 2TsgcDashboardLayout, napędza VCL, FireMonkey i .NET
Układ i zawartość
Kafelek to kontener z opcjonalnym nagłówkiem, więc gości wszystko, czego potrzebuje Twój ekran: wykres, siatkę, mapę, przeglądarkę PDF, podgląd raportu lub zwykłe memo. Ustaw rodzica kontrolki na kafelek i wyrównaj ją do obszaru klienta. Demo Suite hostuje sgcCharts, sgcMaps, sgcPDF i sgcReports na jednym pulpicie, wszystkie zgodne z motywem pulpitu. Kafelek może zrezygnować z nagłówka dla czystego wykresu na całą powierzchnię albo zachować go jako pasek tytułu. Pulpit rośnie o kolejne wiersze i przewija się w pionie w miarę dodawania kafelków.
Title i ShowHeader w każdym kafelkuParentTheme pozwala kafelkowi podążać za pulpitem albo zachować własny ThemeTsgcFMXDashboardTile w FireMonkey
Układ i zawartość
Każdy pulpit zaczyna się od rzędu liczb, które się liczą: przychód, zamówienia, odpływ klientów, czas odpowiedzi. Karta KPI pokazuje wartość dużą czcionką, ikonę, strzałkę trendu z tekstem, linię stopki i mały wykres sparkline z ostatnich wartości, w jednym komponencie. Wywołuj AddValue, gdy napływają nowe liczby, a sparkline się przewija; MaxPoints decyduje, ile historii zachować. AccentColor pozwala pokolorować kartę zgodnie z tym, co mierzy, a karta podąża za jasnym lub ciemnym motywem pulpitu, w którym leży.
TsgcVCLKPICard z Title, Value, Icon, FooterText i AccentColorTrend: ktUp, ktDown lub ktNeutral, z tekstem TrendValueAddValue, ClearValues i MaxPoints dla wykresu sparklineAddValue jest bezpieczne wątkowo, więc może go zasilać wątek roboczyUkład i zawartość
Wiele aplikacji otwiera się na ekranie startowym: jeden kafelek na moduł, pogrupowane według obszarów, z licznikiem tego, co czeka w środku. Tile launcher rysuje ten ekran w jednej kontrolce. Kafelki mają cztery rozmiary, mały, średni, szeroki i duży, i są układane w grupach z podpisami, więc lukę po dużym kafelku wypełniają kolejne małe kafelki. Grupy leżą obok siebie z przewijaniem poziomym albo jedna pod drugą z przewijaniem pionowym, a cały launcher podąża za jasnym lub ciemnym motywem.
TsgcVCLDashboardTileLauncher i TsgcFMXDashboardTileLauncher, a w .NET TsgcWinFormsDashboardTileLauncher, TsgcWpfDashboardTileLauncher i TsgcAvaloniaDashboardTileLauncherGroups i Tiles, z Caption, Subtitle, Size (dtsSmall, dtsMedium, dtsWide, dtsLarge), Color, ImageIndex i Badge rysowaną jako pigułkaOrientation, CellSize, Spacing, GroupColumns i GroupSpacing kształtują układOnTileClick przy kliknięciu, Enter lub Spacji. Klawisze strzałek przechodzą między kafelkami w różnych grupach, a Home i End do pierwszego i ostatniego kafelkaSaveToPNG renderuje launcher bez formularzaTile launcher jest w każdej edycji, także w Community.
Przeczytaj temat pomocyKafelki, które same się wypełniają z jednego źródła danych i filtrują się nawzajem jednym kliknięciem.
Wbudowane kafelki
Większość pulpitów pokazuje te same wiersze na pięć sposobów: przychód według regionu na wykresie, sumę na wskaźniku, rekordy w siatce, tabelę przestawną według produktu i klientów na mapie. Wbudowany kafelek już zawiera kontrolkę. Ustaw jego źródło danych i kolumny, a sam pogrupuje, zsumuje i wyświetli wiersze, bez kodu, który przenosi dane do kontrolki. Wbudowany kafelek pozostaje kafelkiem, więc ma nagłówek, komórkę i motyw, a użytkownicy przesuwają go, zmieniają jego rozmiar, zapisują i wczytują jak każdy inny.
TsgcVCLDashboardChartTile, GaugeTile, GridTile, PivotTile i MapTile, z tymi samymi nazwami dla FireMonkeyDataSource oraz tylko do odczytu View, pogrupowany i zagregowany dla kafelkaChart, Gauge, Grid, Pivot, Map), więc stylizujesz ją jak zwykleKażdy kafelek wymaga odpowiedniego produktu sgcUI: sgcCharts, sgcGauges, sgcGrid, sgcPivotGrid lub sgcMaps, wraz z jego pakietem mostu. Kafelki są we wszystkich edycjach, także w Community. W .NET kafelki wykresu, wskaźnika, siatki, tabeli przestawnej i mapy istnieją dla WinForms, WPF i Avalonia.
Przeczytaj temat pomocyŹródła danych
Gdy liczby pochodzą z jednego zapytania, wszystkie kafelki muszą pokazywać te same wiersze. TsgcDashboardDataSource przechowuje je tylko raz, a dowolna liczba kafelków czyta je przez własny widok: wykres grupuje według jednej kolumny, wskaźnik sumuje inną, siatka wylicza wiersze. Wypełnij go własnymi wierszami, skopiuj zestaw danych albo podłącz tabelę sgcGrid lub sgcPivotGrid i śledź jej zmiany. Ujmij wiele zmian w jedną aktualizację, a kafelki odświeżą się tylko raz.
Columns, AppendRow, Clear, BeginUpdate i EndUpdateLoadFromDataSet kopiuje TDataSet; w .NET LoadFrom przyjmuje DataTableTable podłącza dowolny IsgcUITable, na przykład siatkę lub tabelę przestawnąŹródła danych nie zależą od frameworka i są we wszystkich edycjach.
Przeczytaj temat pomocyFiltrowanie krzyżowe Tylko zarejestrowana
Kierownik sprzedaży widzi, że Europa zostaje w tyle, i chce szczegółów. Przy filtrowaniu krzyżowym kliknięcie słupka Europa filtruje wszystkie pozostałe kafelki tego samego źródła danych: wskaźnik sumuje wiersze europejskie, siatka je wylicza, tabela przestawna pokazuje je według produktu, a mapa zachowuje tylko ich znaczniki. Kliknięty wykres zachowuje wszystkie słupki. Pasek filtrów nad siatką pokazuje chip dla każdego warunku i chip Wyczyść wszystko, a drugie kliknięcie tego samego słupka usuwa filtr.
ShowFilterBar, ClearFilters i OnFilterChanged na pulpicieCrossFilterSource i CrossFilterTarget dla każdego kafelka oraz Filter na źródle danych dla koduPasek filtrów nigdy nie jest drukowany ani eksportowany. Filtrowanie krzyżowe jest w edycji Registered; edycja Community go nie zawiera.
Przeczytaj temat pomocyMniej kolumn na wąskim ekranie oraz pulpity, które użytkownicy budują sami.
Układ responsywny
Pulpit zaprojektowany dla szerokiego monitora staje się nieczytelny w wąskim oknie lub na telefonie. Włącz punkty przełamania, a pulpit wybierze klasę rozmiaru według swojej szerokości: szeroka używa Columns, średnia i kompaktowa używają mniejszej liczby kolumn i własnych komórek. Domyślnie każda rozpiętość jest skalowana za Ciebie, więc większość pulpitów nie wymaga dodatkowej konfiguracji, a kafelek można ukryć w jednej klasie, na przykład dużą mapę na telefonie.
Breakpoints.Enabled, CompactWidth (600), MediumWidth (1024), CompactColumns (4) i MediumColumns (8)CompactCell i MediumCell dla każdego kafelka, z Visible dla każdej klasyActiveBreakpoint i OnBreakpointChangedPunkty przełamania są we wszystkich edycjach i domyślnie wyłączone. Edycja Community nie ma SaveLayout, więc tam punkty przełamania działają, ale nie są zapisywane.
Projektant w czasie działania Tylko zarejestrowana
Każdy dział prosi o nieco inny pulpit. Zamiast dostarczać jeden na prośbę, pozwól użytkownikom zbudować go samodzielnie. W trybie edycji każdy kafelek można przesuwać i zmieniać jego rozmiar, kliknięcie go zaznacza, a panel projektowy dodaje wbudowane kafelki z palety, edytuje właściwości zaznaczonego kafelka, usuwa go oraz cofa i ponawia ostatnie kroki. Zapisz wynik przez SaveLayout, a kafelki dodane w czasie działania wrócą z ustawieniami i źródłem danych.
EditMode, SelectedTile, AddTile i RemoveTile na pulpicieUndo, Redo, CanUndo i CanRedo, 50 kroków; Ctrl+Z, Ctrl+Y i Delete w trybie edycjiTsgcVCLDashboardDesignPanel i TsgcFMXDashboardDesignPanel, z odpowiednikami dla WinForms, WPF i AvaloniaOnTileAdded, OnTileRemoving i OnSelectionChangedProjektant w czasie działania jest w edycji Registered; edycja Community go nie zawiera.
Przeczytaj temat pomocyJeden pasek zapytań AI dla wszystkich kafelków, a wartości zostają w Twojej aplikacji.
Zapytaj pulpit
Użytkownicy nie chcą szukać kafelka, który zawiera odpowiedź. Podłącz pasek zapytań AI do routera pulpitu, a jedno pole obsłuży cały ekran. Router wybiera kafelek, o którym mówi pytanie, przesuwa go do widoku i na wierzch oraz przekazuje pytanie do jego silnika siatki lub tabeli przestawnej. Uczestniczą też kafelki wykresu, wskaźnika i mapy: wskaźnik i karta KPI odpowiadają lokalnie swoim tytułem i wartością, a kafelek wykresu lub mapy jest wyświetlany i dostaje fokus. W edycji Registered pytanie takie jak "pokaż sprzedaż w regionie West" ustawia także filtr krzyżowy Region = West.
TsgcVCLDashboardAI i TsgcFMXDashboardAI; TsgcWinFormsDashboardAI, TsgcWpfDashboardAI i TsgcAvaloniaDashboardAI w .NETLastFilter i ApplyFilters dla odpowiedzi z filtrem; Undo usuwa filtrPrywatność: dostawca widzi pytanie, tytuły i rodzaje kafelków oraz nazwy kolumn. Wartości kart KPI, wartości wskaźników i wartości kolumn nigdy nie opuszczają aplikacji, a proponowana wartość filtra jest sprawdzana lokalnie na danych. Router jest we wszystkich edycjach; odpowiedzi z filtrem są w edycji Registered.
Przeczytaj temat pomocyPozwól użytkownikom ułożyć własną stronę startową, zachować ją i zasilać ją z sieci.
Układy użytkowników i dane na żywo Tylko zarejestrowana
Na wspólnej stronie startowej każdy użytkownik chce mieć na wierzchu inne liczby. Włącz przeciąganie, a użytkownik przesunie kafelek za nagłówek; włącz zmianę rozmiaru, a uchwyt w rogu zmieni jego rozpiętość. Gdy mysz się porusza, pod kafelkami rysowana jest komórka docelowa, a kafelek przyciąga się do siatki. Escape anuluje. Kafelki oznaczone jako zablokowane nigdy się nie ruszają. Połącz to z zapisywanymi układami poniżej, a każdy użytkownik zachowa ułożoną stronę startową, podczas gdy Ty nadal decydujesz, które kafelki istnieją.
AllowDrag i AllowResize w pulpicieLocked w kafelku zatrzymuje go na miejscuOnLayoutChanged wywoływane po każdym przeciągnięciu lub zmianie rozmiaruCommunity buduje stały układ z kodu; przeciąganie i zmiana rozmiaru w czasie działania są w edycji Registered.
Przeczytaj temat pomocyUkłady użytkowników i dane na żywo Tylko zarejestrowana
Układ ułożony przez użytkownika musi wrócić po restarcie. Jedno wywołanie zapisuje parametry siatki oraz, dla każdego nazwanego kafelka, jego komórkę i widoczność jako zwarty JSON; drugie go stosuje. Kafelki są dopasowywane po nazwie, nieznane nazwy są ignorowane, a kafelki nieobecne w tekście zachowują swoje komórki, więc starszy zapisany układ nadal się wczyta po dodaniu kafelka w nowej wersji. JSON jest mały i czytelny, więc możesz dostarczyć domyślny układ z aplikacją i dać przycisk resetu, który wczyta go ponownie.
SaveLayout i LoadLayout zwracają i stosują ciąg JSONSaveLayoutToFile, LoadLayoutFromFile, SaveLayoutToStream, LoadLayoutFromStreamUkłady użytkowników i dane na żywo Tylko zarejestrowana
Ekrany operacyjne pokazują wartości zmieniające się co sekundę. Most sgcDashboardWS odczytuje liczbę z każdej wiadomości JSON klienta sgcWebSockets i wpycha ją do karty, wraz z wykresem sparkline. Strzałka trendu sama podąża za poprzednią wartością. W Delphi 2010 i nowszych aktualizacje tekstu działają w głównym wątku, więc klient może używać dowolnego trybu wątkowania. Wiadomości, które nie są poprawnym JSON lub których ścieżka nie jest liczbą, są ignorowane, więc zaszumione źródło nigdy nie psuje ekranu.
TsgcDashboardSource_WebSocket, TsgcDashboardSource_MQTT (z Topic) i TsgcDashboardSource_SSEValuePath taka jak data.items[0].value, ValueFormat domyślnie %.2fTitlePath i TrendValuePath kopiują do karty więcej pólOnValue po każdej aktualizacjiMost wymaga sgcWebSockets. W edycji Community zasilaj karty z kodu przez Value i AddValue.
Przeczytaj temat pomocyJeden wygląd na całym ekranie, te same karty jako obrazy, ten sam projekt na każdej platformie.
Motywy, obrazy i platformy
Ciemna dyspozytornia i jasne biuro potrzebują tego samego ekranu w dwóch wyglądach. Ustaw motyw pulpitu, a obejmie każdy kafelek, każdą kartę KPI i kontrolki sgcUI w nich, więc wykresy, wskaźniki zegarowe i siatki przełączają się razem. Typ motywu jest ten sam, którego używa każdy produkt sgcUI, więc cała aplikacja może podążać za jednym ustawieniem. Kafelki, które mają się wyróżniać, mogą zachować własny motyw, podczas gdy reszta pulpitu podąża za globalnym.
Theme := utDark lub utLight w pulpicieParentTheme albo zachowują własny ThemeMotywy, obrazy i platformy
Liczby z pulpitu bywają potrzebne gdzie indziej: w porannym raporcie e-mailem, na stronie intranetu lub w PDF. TsgcDashboardKPI renderuje tę samą kartę bez okna i bez VCL czy FireMonkey, więc może ją wytworzyć program konsolowy, usługa Windows lub serwer Linux64. Szerokość i wysokość są w pikselach logicznych, a współczynnik skali daje ostre obrazy o wysokim DPI. Użyj tego w raportach cyklicznych: zbuduj karty z tych samych zapytań, których używa pulpit, i dołącz obrazy do wiadomości.
SaveToPNG do pliku lub strumienia, na przykład 320 na 160 w skali 2 daje obraz 640 na 320SaveToSVG dla ostrego wyjścia wektorowegoCard.KPI.SaveToPNG zapisuje to, co pokazuje karta na ekranieMotywy, obrazy i platformy
Napisz pulpit raz i użyj projektu ponownie. Pulpit FireMonkey, kafelki i karty KPI działają w Windows, macOS, iOS i Android, a port .NET oferuje te same klasy dla WinForms, WPF i Avalonia. Ponieważ jeden silnik układu wylicza komórki wszędzie, zapisany układ znaczy to samo na każdej platformie. Dema są dostarczane w tym samym zestawie dla każdej platformy: Basic, LiveKPI, SaveLayout i Suite dla Delphi i C++ Builder oraz wersje WinForms, WPF i Avalonia w .NET.
TsgcFMXDashboard, TsgcFMXDashboardTile, TsgcFMXKPICard, TsgcFMXDashboardTileLauncherTsgcWinFormsDashboard, TsgcWinFormsKPICard i ich odpowiedniki WPF i AvaloniaPodgląd pokazuje dokładnie to, co dostaje drukarka i PDF.
Drukowanie, podgląd i PDF
Pulpit drukuje się na jednej stronie jako obraz całej tablicy: każdy kafelek, który nie jest ukryty, także przewinięty poza widok, ułożony jak na ekranie. Każda kontrolka sgcUI w kafelku jest rysowana przez własny renderer, więc drukują się karty KPI, wykresy, wskaźniki, siatki, tabele przestawne, widoki planera i diagramy. Inne kontrolki w kafelku, takie jak pole memo czy etykieta, zostają puste.
Print pokazuje okno dialogowe drukowania albo drukuje od razu na drukarce domyślnej, a ShowPrintPreview otwiera podgląd z nawigacją po stronach, powiększeniem, ustawieniami strony, drukowaniem i eksportem do PDFPrintSettings przechowuje papier, orientację, marginesy, skalowanie oraz tekst nagłówka i stopki, a korzystają z nich drukarka, podgląd i PDFExportToPDF zapisuje stronę jako jeden oznakowany obraz, domyślnie 192 dpi, z tekstem alternatywnym, który wymienia tytuły kafelków w kolejności czytaniaPDFALevel z TsgcUIPDFOptions dodaje PDF/A-2a lub PDF/A-3a do archiwizacji, osobno albo razem z PDF/UADrukowanie i podgląd są we wszystkich wydaniach, także w bezpłatnym wydaniu Community, w VCL, FireMonkey, WinForms, WPF i Avalonia. W FireMonkey drukowanie działa w systemach Windows i macOS, a podgląd i eksport do PDF na każdej platformie. Eksport do PDF wymaga mostka sgcUIPDF i licencjonowanego sgcPDF (pakiet NuGet esegece.sgcUICore.sgcPDF w .NET), więc nie ma go w wydaniu Community.
UI Automation dla czytników ekranu, klawiatura i wysoki kontrast, bez konfiguracji.
Dostępność
sgcDashboard udostępnia Microsoft UI Automation pulpit i jego kafelki wraz z tytułami i położeniem, kontrolkę umieszczoną w każdym kafelku oraz karty KPI z tytułem, wartością, jednostką i trendem.
Dostępność jest domyślnie włączona w każdej edycji, łącznie z bezpłatną edycją Community, w VCL w każdej wersji Delphi i C++Builder od Delphi 7 do Delphi 13, w FireMonkey w systemie Windows oraz w WinForms, WPF i Avalonia. W Delphi i C++Builder właściwości AccessibleName i AccessibleDescription ustawiają nazwę i opis udostępniane UI Automation, a w .NET to samo robią standardowa nazwa dostępności i tekst pomocy każdego frameworka. Zobacz raporty zgodności dotyczące dostępności.
sgcDashboard w demach pakietu sgcUI: kompletne aplikacje działające offline na wbudowanych danych symulowanych.
Karty KPI z wykresami sparkline, kafelki alarmów, mapa drzewa i wskaźnik VaR jako kafelki pulpitu.
Altamira Markets →
Karty OEE z wykresami sparkline, licznik butelek i kafelki alarmów wokół diagramu procesu.
Altamira Plant →
Pulpit ERP: karty KPI z wykresami sparkline, wykres przychodów, wskaźniki i mapa klientów.
Altamira ERP →
Karty KPI portfela z wykresami sparkline, wskaźniki zdrowia i wykresy na jednej stronie.
Altamira PMO →
Strona startowa ERP pokazuje przychód, otwarte zamówienia, zaległe faktury i odpływ klientów jako karty KPI ze strzałkami trendu, a poniżej w kafelkach wykres sprzedaży i siatkę najlepszych klientów. Co noc usługa renderuje te same karty jako PNG do e-maila dla zarządu, z tymi samymi liczbami i kolorami co na ekranie.
Ekran ścienny w zakładzie pokazuje przepustowość linii, temperatury i liczby alarmów. Źródła MQTT wpychają każdy odczyt do jego karty w chwili nadejścia, wykresy sparkline pokazują ostatnie minuty, a ciemny motyw oszczędza oczy w nocy. Wskaźniki zegarowe i wykresy w sąsiednich kafelkach podążają za tym samym motywem.
W kliencie desktopowym używanym przez wiele ról każdy użytkownik przeciąga na górę kafelki, które mają znaczenie, zmienia rozmiar najczęściej oglądanego wykresu i ukrywa resztę. Układ jest zapisywany jako JSON dla każdego użytkownika i przywracany przy następnym logowaniu, a nowe kafelki dodane w aktualizacji po prostu wpływają w wolne miejsce.
The same API in Delphi, C++ Builder and C#: tiles on the grid, a KPI card with a sparkline in each, a dark theme and a saved layout. Dragging and layout files need the Registered edition.
Tiles on the 12 column grid with a KPI card in each, a dark theme, and the layout saved to a file. Dragging and layout files need the Registered edition.
uses
SysUtils, Controls, sgcUICore_Theme, sgcDashboard_KPI, sgcDashboard_VCL, sgcDashboard_KPI_VCL;
procedure AddKPI(aDash: TsgcVCLDashboard; const aName, aTitle, aValue,
aChange: string; aCol: Integer; aTrend: TsgcDashboardKPITrend);
var
oTile: TsgcVCLDashboardTile;
oCard: TsgcVCLKPICard;
begin
oTile := TsgcVCLDashboardTile.Create(aDash.Owner);
oTile.Name := aName;
oTile.Parent := aDash;
oTile.Col := aCol;
oTile.ColSpan := 4;
oTile.Title := aTitle;
oCard := TsgcVCLKPICard.Create(aDash.Owner);
oCard.Parent := oTile;
oCard.Align := alClient;
oCard.Value := aValue;
oCard.Trend := aTrend;
oCard.TrendValue := aChange;
oCard.AddValue(47);
oCard.AddValue(52);
end;
procedure BuildDashboard(aOwner: TWinControl);
var
oDash: TsgcVCLDashboard;
begin
oDash := TsgcVCLDashboard.Create(aOwner);
oDash.Parent := aOwner;
oDash.Align := alClient;
// drag, resize and layout files need the Registered edition
oDash.AllowDrag := True;
AddKPI(oDash, 'tileRevenue', 'Revenue', '12,480 USD', '+4.2 %', 0, ktUp);
AddKPI(oDash, 'tileOrders', 'Orders', '1,284', '+8.1 %', 4, ktUp);
oDash.Theme := utDark;
if FileExists('layout.json') then
oDash.LoadLayoutFromFile('layout.json');
oDash.SaveLayoutToFile('layout.json');
end;The same dashboard in C++ Builder with the generated headers.
#include <vcl.h>
#include "sgcUICore_Theme.hpp"
#include "sgcDashboard_KPI.hpp"
#include "sgcDashboard_VCL.hpp"
#include "sgcDashboard_KPI_VCL.hpp"
void AddKPI(TsgcVCLDashboard *aDash, const String aName, const String aTitle,
const String aValue, const String aChange, int aCol,
TsgcDashboardKPITrend aTrend)
{
TsgcVCLDashboardTile *oTile = new TsgcVCLDashboardTile(aDash->Owner);
oTile->Name = aName;
oTile->Parent = aDash;
oTile->Col = aCol;
oTile->ColSpan = 4;
oTile->Title = aTitle;
TsgcVCLKPICard *oCard = new TsgcVCLKPICard(aDash->Owner);
oCard->Parent = oTile;
oCard->Align = alClient;
oCard->Value = aValue;
oCard->Trend = aTrend;
oCard->TrendValue = aChange;
oCard->AddValue(47);
oCard->AddValue(52);
}
void BuildDashboard(TWinControl *aOwner)
{
TsgcVCLDashboard *oDash = new TsgcVCLDashboard(aOwner);
oDash->Parent = aOwner;
oDash->Align = alClient;
// drag, resize and layout files need the Registered edition
oDash->AllowDrag = true;
AddKPI(oDash, "tileRevenue", "Revenue", "12,480 USD", "+4.2 %", 0, ktUp);
AddKPI(oDash, "tileOrders", "Orders", "1,284", "+8.1 %", 4, ktUp);
oDash->Theme = utDark;
if (FileExists("layout.json"))
oDash->LoadLayoutFromFile("layout.json");
oDash->SaveLayoutToFile("layout.json");
}The WinForms version in C#, with the same class names as Delphi.
using System.Windows.Forms;
using esegece.sgcDashboard;
using esegece.sgcUICore;
public static class KpiDashboard
{
// One KPI tile with a sparkline, placed on the dashboard grid.
static void AddKPI(TsgcWinFormsDashboard aDash, string aName, string aTitle,
string aValue, string aChange, int aCol, TsgcDashboardKPITrend aTrend)
{
var oTile = new TsgcWinFormsDashboardTile();
oTile.Name = aName;
oTile.Title = aTitle;
oTile.Col = aCol;
oTile.ColSpan = 4;
var oCard = new TsgcWinFormsKPICard();
oCard.Dock = DockStyle.Fill;
oCard.Value = aValue;
oCard.Trend = aTrend;
oCard.TrendValue = aChange;
oCard.AddValue(47);
oCard.AddValue(52);
oTile.Controls.Add(oCard);
aDash.Controls.Add(oTile);
}
public static void Build(Form aForm)
{
var oDash = new TsgcWinFormsDashboard();
oDash.Dock = DockStyle.Fill;
oDash.Theme = TsgcUITheme.utDark;
oDash.AllowDrag = true; // drag and layout files: Registered edition
AddKPI(oDash, "tileRevenue", "Revenue", "12,480 USD", "+4.2 %", 0, TsgcDashboardKPITrend.ktUp);
AddKPI(oDash, "tileOrders", "Orders", "1,284", "+8.1 %", 4, TsgcDashboardKPITrend.ktUp);
AddKPI(oDash, "tileChurn", "Churn", "2.4 %", "-0.3 %", 8, TsgcDashboardKPITrend.ktDown);
aForm.Controls.Add(oDash);
if (System.IO.File.Exists("layout.json"))
oDash.LoadLayoutFromFile("layout.json");
oDash.SaveLayoutToFile("layout.json");
}
}dotnet add package esegece.sgcDashboard.WinFormsSześć dem dla Delphi i C++ Builder oraz dziesięć dla .NET, wszystkie w pobraniu skompilowanych dem.
Sześć kafelków i cztery karty KPI na siatce o 12 kolumnach, z dziennikiem i listą w pozostałych kafelkach. Najszybszy sposób, by zobaczyć silnik układu i przełączanie motywu.
Karty KPI zasilane mostem sgcDashboardWS, z tykającymi wartościami i rosnącymi wykresami sparkline w miarę napływu wiadomości. Wymaga sgcWebSockets.
Przeciągaj kafelki za nagłówek, zmieniaj ich rozmiar uchwytem, zapisz układ do JSON, uruchom demo ponownie i zobacz, jak wraca.
Wykres, mapa, przeglądarka PDF, podgląd raportu i karty KPI z innych produktów sgcUI na jednym pulpicie z motywem.
Jedno źródło danych z 204 wierszami sprzedaży zasila kafelki wykresu, wskaźnika, siatki, tabeli przestawnej i mapy. Kliknij słupek regionu, komórkę siatki, wiersz tabeli przestawnej lub znacznik mapy, a pozostałe kafelki podążą za filtrem (Registered); zwęź okno, a kafelki ułożą się na nowo. Delphi VCL i C++ Builder, a w .NET SalesExplorer (WinForms) i SalesExplorerWpf. Wymaga sgcCharts, sgcGauges, sgcGrid, sgcPivotGrid i sgcMaps.
Projektant w czasie działania: dodawaj wbudowane kafelki z palety panelu projektowego, przesuwaj je i zmieniaj ich rozmiar w trybie edycji, edytuj ich właściwości, usuwaj je, cofaj i ponawiaj, a pulpit zapisz jako JSON. Delphi VCL i C++ Builder, a w .NET DashboardDesigner (WinForms) i DashboardDesignerWpf.
Ekran startowy z trzema grupami oraz kafelkami w każdym rozmiarze, z podtytułami, plakietkami i wyłączonym kafelkiem. Wiersz stanu pokazuje kafelek kliknięty myszą, klawiszem Enter lub Spacją, a dwie listy rozwijane przełączają orientację i motyw. TileLauncherFMX robi to samo w FireMonkey.
Basic, BasicWpf, BasicAvalonia, LiveKPI, SaveLayout, Suite, SalesExplorer, SalesExplorerWpf, DashboardDesigner, DashboardDesignerWpf, TileLauncher, TileLauncherWpf i TileLauncherAvalonia dla WinForms, WPF i Avalonia.
Gotowe do uruchomienia pliki wykonywalne każdego produktu sgcUI, nic nie trzeba instalować.
Pobierz sgcUI_bin.zip →Pięć dem QuickStart dla Delphi (VCL) znajduje się w Demos\Dashboard\Delphi\00.QuickStart. Przewodnik PDF omawia je krok po kroku: pierwszy pulpit z kartami KPI, 12-kolumnowa siatka kafelków, dane na żywo, motywy oraz pulpit sprzedaży z kafelkiem wykresu.
sgcDashboard wchodzi w skład sgcUI Professional i Enterprise, a jest też sprzedawany osobno. sgcDashboard jest również w pakiecie All-Access.
€199 / programista, pełny kod źródłowy, 1 rok aktualizacji.
Kup sgcDashboard → Zobacz cennik →Bezpłatna edycja Community (esegece.sgcDashboard.Community w NuGet) zawiera siatkę, kafelki, karty KPI z wykresami sparkline, PNG i SVG bez interfejsu, motywy, źródła danych, wbudowane kafelki, responsywne punkty przełamania i routing AI do wszystkich kafelków. Nie zawiera przeciągania i zmiany rozmiaru w czasie działania, SaveLayout i LoadLayout (więc układy nie są zapisywane), filtrowania krzyżowego, projektanta w czasie działania, odpowiedzi z filtrem w funkcji Zapytaj pulpit ani mostu sgcDashboardWS. Każdy wbudowany kafelek wymaga odpowiedniego produktu sgcUI i jego pakietu mostu we wszystkich edycjach.
| Funkcja | Community (bezpłatna) | Zarejestrowana |
|---|---|---|
| Siatka kafelków z rozpiętościami i auto-flow | ✓ | ✓ |
| Karty KPI z trendem i wykresem sparkline | ✓ | ✓ |
| Jasny i ciemny motyw | ✓ | ✓ |
| Karty KPI bez interfejsu jako PNG i SVG | ✓ | ✓ |
| Tile launcher z pogrupowanymi kafelkami, plakietkami i nawigacją klawiaturą | ✓ | ✓ |
| Wbudowane kafelki wykresu, wskaźnika, siatki, tabeli przestawnej i mapy (każdy wymaga własnego produktu sgcUI) | ✓ | ✓ |
| Źródła danych współdzielone przez wiele kafelków | ✓ | ✓ |
| Responsywne punkty przełamania | ✓ (niezapisywane) | ✓ |
| Routing funkcji Zapytaj pulpit do wszystkich kafelków | ✓ | ✓ |
| Filtrowanie krzyżowe z paskiem filtrów | − | ✓ |
| Projektant w czasie działania z panelem projektowym i cofaniem | − | ✓ |
| Odpowiedzi z filtrem w funkcji Zapytaj pulpit | − | ✓ |
| Przeciąganie i zmiana rozmiaru kafelków w czasie działania | − | ✓ |
| SaveLayout i LoadLayout | − | ✓ |
| Źródła na żywo sgcDashboardWS (WebSocket, MQTT, SSE) | − | ✓ |
| Komponent | Czym jest |
|---|---|
| TsgcVCLDashboard, TsgcFMXDashboard | Kontener siatki dla VCL i FireMonkey. |
| TsgcVCLDashboardTile, TsgcFMXDashboardTile | Kafelek z tytułem, który gości dowolną kontrolkę. |
| TsgcVCLKPICard, TsgcFMXKPICard | Karta KPI z trendem, stopką i wykresem sparkline. |
| TsgcDashboardKPI | Niezależna od frameworka karta KPI bez interfejsu z eksportem PNG i SVG. |
| TsgcVCLDashboardTileLauncher, TsgcFMXDashboardTileLauncher | Ekran startowy z kafelkami w czterech rozmiarach w grupach z podpisami, z plakietkami, przewijaniem i nawigacją klawiaturą. |
| TsgcDashboardTileLauncher | Niezależny od frameworka model i renderer tile launchera z bezgłowym eksportem PNG. |
| TsgcDashboardDataSource | Niezależne od frameworka źródło danych, które zasila wbudowane kafelki. |
| TsgcVCLDashboardChartTile, GaugeTile, GridTile, PivotTile, MapTile | Wbudowane kafelki z kontrolką sgcCharts, sgcGauges, sgcGrid, sgcPivotGrid lub sgcMaps, w pakiecie mostu dla każdego produktu, także w wersjach FireMonkey. |
| TsgcVCLDashboardDesignPanel, TsgcFMXDashboardDesignPanel | Panel projektanta w czasie działania (tylko Registered). |
| TsgcDashboardLayout | Silnik układu, dostępny także w Linux64. |
| TsgcDashboardSource_WebSocket, _MQTT, _SSE | Źródła KPI na żywo mostu sgcDashboardWS (tylko Registered). |
| Cel | Komponent | Platformy |
|---|---|---|
| Delphi 7 do 13, VCL | TsgcVCLDashboard | Win32 i Win64 |
| Delphi XE6 do 13, FireMonkey | TsgcFMXDashboard | Windows, macOS, iOS i Android |
| C++ Builder 2007 do 13 | TsgcVCLDashboard, TsgcFMXDashboard | Wygenerowane nagłówki .hpp i biblioteki statyczne |
| Delphi 10.2 do 13, niezależnie od frameworka | TsgcDashboardLayout, TsgcDashboardKPI | Linux64, silnik układu i karty KPI bez interfejsu |
| .NET Framework 4.7.2, .NET 8, 9 i 10 | TsgcWinFormsDashboard, odpowiedniki WPF i Avalonia | WinForms, WPF i Avalonia |
Tak, w edycji Registered. AllowDrag i AllowResize pozwalają użytkownikom przesuwać kafelki za nagłówek i zmieniać ich rozmiar uchwytem, a SaveLayoutToFile lub SaveLayout zapisują wynik jako JSON. LoadLayout przywraca go według nazwy kafelka, więc układy przetrwają nowe wersje Twojej aplikacji.
Każda. Kafelek to kontener: ustaw rodzica kontrolki na kafelek i wyrównaj ją do obszaru klienta. Demo Suite hostuje wykres, mapę, przeglądarkę PDF i podgląd raportu, a kontrolki sgcUI w kafelku podążają za motywem pulpitu.
Tak. Każdy wbudowany kafelek wymaga własnego produktu i własnego pakietu mostu: kafelek wykresu sgcCharts, kafelek wskaźnika sgcGauges, kafelek siatki sgcGrid, kafelek tabeli przestawnej sgcPivotGrid, a kafelek mapy sgcMaps. Rdzeń pulpitu nigdy nie używa jednostki produktu, ponieważ sgcDashboard jest sprzedawany także samodzielnie. sgcUI Enterprise zawiera je wszystkie. W .NET każdy kafelek, także kafelek mapy, jest dostępny dla WinForms, WPF i Avalonia. Zobacz Wbudowane kafelki.
Tak, w edycji Registered. Ustaw EditMode i zadokuj panel projektowy obok pulpitu: użytkownicy dodają wbudowane kafelki z palety, przesuwają je, zmieniają ich rozmiar i usuwają, edytują ich właściwości oraz cofają lub ponawiają każdy krok. SaveLayout zapisuje wynik, także kafelki dodane w czasie działania, a LoadLayout odtwarza je. Demo Designer pokazuje cały przepływ. Zobacz Projektant w czasie działania.
Z kodu ustaw Value i wywołaj AddValue, co jest bezpieczne wątkowo. Z edycją Registered i sgcWebSockets źródła sgcDashboardWS odczytują liczbę z każdej wiadomości WebSocket, MQTT lub SSE przez ValuePath i same aktualizują kartę oraz jej trend.
Pulpity i kafelki, układ siatki z auto-flow, karty KPI z wykresami sparkline, PNG i SVG bez interfejsu, motywy, źródła danych, wbudowane kafelki, responsywne punkty przełamania i routing AI. Nie zawiera przeciągania i zmiany rozmiaru w czasie działania, SaveLayout i LoadLayout, filtrowania krzyżowego, projektanta w czasie działania, odpowiedzi z filtrem routera AI ani mostu sgcDashboardWS. Zobacz Edycje.
Tak. TsgcFMXDashboard, jego kafelki i karty KPI działają w FireMonkey od Delphi XE6 w Windows, macOS, iOS i Android, z tym samym silnikiem układu co pulpit VCL. Rozmiary są niezależne od urządzenia i podążają za skalą formularza.
Tak. TsgcDashboardKPI rysuje kartę bez okna i bez VCL czy FireMonkey oraz zapisuje PNG lub SVG do pliku lub strumienia. Buduje się na każdej platformie, także Linux64, więc usługa lub serwer WWW może wytwarzać obrazy.
Tak. Wszystkie rozmiary są w pikselach niezależnych od urządzenia. Pulpit VCL skaluje je przez PPI monitora podzielone przez 96, a pulpit FireMonkey przez skalę formularza, więc kafelki, odstępy i wysokości wierszy zachowują proporcje na każdym monitorze.
Wprowadzenie, Szybki start VCL, Platformy, Edycje, Pulpit, Karta KPI, Układ, Trwałość, Dane na żywo, Wbudowane kafelki, Źródła danych, Filtrowanie krzyżowe, Układ responsywny, Projektant w czasie działania.
Wprowadzenie, Szybki start C++ Builder, Platformy, Układ, Dane na żywo, Wbudowane kafelki, Źródła danych, Filtrowanie krzyżowe, Układ responsywny, Projektant w czasie działania.
Wprowadzenie, Platformy, Edycje, Układ, Dane na żywo, Wbudowane kafelki, Źródła danych, Filtrowanie krzyżowe, Układ responsywny, Projektant w czasie działania.
Delphi, C++ Builder i .NET, obejmujące każdy produkt sgcUI.
Umieść wykresy trendu w kafelkach pulpitu obok kart KPI; oba podążają za tym samym motywem.
Poznaj sgcCharts →
Wskaźniki zegarowe to czytelne kafelki dla bieżących wartości; demo DashboardGauges pokazuje sześć z nich.
Poznaj sgcGauges →Zasilaj karty KPI z WebSocket, MQTT lub SSE za pomocą mostu sgcDashboardWS.
Poznaj sgcWebSockets →