sgcNavigation: pasek nawigacji z panelem bocznym i akordeonem dla Delphi, C++ Builder i .NET

Dwa style, jedna kontrolkaPanel boczny lub akordeon z tymi samymi pozycjami i zdarzeniami, przełączane jedną właściwością.
Każdy framework UIVCL, FireMonkey, WinForms, WPF i Avalonia, z tym samym modelem i nazwami.
Pasuje do całego pakietuJasny i ciemny motyw oraz kolor akcentu wspólny dla każdego produktu sgcUI.
Eksport bez oknaWyrenderuj ten sam pasek do PNG lub SVG bez okna, także na Linux64.

KLUCZOWE FUNKCJE

Wszystko, czego potrzebuje menu aplikacji

Dziesięć funkcji, które zmieniają listę stron w powłokę nawigacyjną, w której użytkownicy od razu się odnajdują.

Układ i tryby

Jedna kontrolka obsługuje oba style nawigacji używane w aplikacjach biznesowych oraz wąski pasek ikon pomiędzy nimi.

Układ i tryby

Nowoczesny panel boczny aplikacji w jednym komponencie

Większość aplikacji biznesowych potrzebuje tego samego na lewej krawędzi głównego formularza: listy stron, pogrupowanej według obszarów, z wyraźnie oznaczoną bieżącą stroną. Upuść TsgcVCLNavigationBar na formularz, wyrównaj go do lewej i dodaj pozycje. Nagłówki grup opisują wiersze poniżej stonowanym kolorem i nigdy nie są zaznaczane. Zaznaczony wiersz dostaje tło w kolorze akcentu i 3-pikselowy pasek akcentu, więc użytkownicy zawsze widzą, gdzie są. Stany najechania i naciśnięcia, podpowiedzi i wyłączone wiersze są rysowane za Ciebie, dzięki czemu pasek wygląda na gotowy już przy pierwszym uruchomieniu.

Mode := nbmSidebar to domyślny styl
IsGroup zmienia pozycję w nagłówek grupy
ItemHeight i GroupHeight ustawiają wysokość wierszy
Kółko myszy przewija długie listy, a ScrollIntoView pokazuje dowolną pozycję
Od prawej do lewej dla arabskiego i hebrajskiego: ikony i podpisy zamieniają się miejscami, a wcięcie, szewrony, plakietki i przycisk zwijania są odbite lustrzanie

Przeczytaj temat pomocy

Układ i tryby

Przełącz na akordeon jedną właściwością

Ekrany ustawień i konsole administracyjne mają często więcej sekcji, niż mieści się na ekranie. Ustaw Mode na nbmAccordion, a każdy nagłówek grupy stanie się sekcją, która otwiera i zamyka pozycje poniżej, ze strzałką po prawej i wciętymi elementami podrzędnymi. Domyślnie otwarta jest tylko jedna grupa naraz, co skraca długie menu. Ustaw AllowMultiExpand, gdy użytkownicy potrzebują kilku otwartych sekcji jednocześnie. Pozycje, zdarzenia i Twój kod pozostają dokładnie takie same. Pozycje umieszczone przed pierwszym nagłówkiem nie należą do żadnej grupy i są zawsze widoczne, co pasuje do wpisu Home lub Dashboard nad sekcjami.

Mode := nbmAccordion przełącza cały pasek
Expanded otwiera lub zamyka grupę z kodu
AllowMultiExpand pozwala zostawić otwartych kilka grup
Indent ustawia wcięcie elementów podrzędnych

Przeczytaj temat pomocy

Układ i tryby

Zwijanie do paska ikon, z animacją

Szerokie panele boczne zabierają miejsce danym, dla których użytkownicy przyszli. Ustaw Collapsed, a pasek zwinie się z pełnej szerokości do wąskiego paska ikon w około 150 ms. Na pasku rysowane są tylko ikony, podpis staje się podpowiedzią, nagłówki grup zamieniają się w linie oddzielające, a plakietki w kropki, więc nic ważnego nie ginie. Pasek sam ustawia swoją szerokość, więc zawartość obok po prostu podąża za nim z alClient. Powiąż właściwość Collapsed z przyciskiem hamburgera, ustawieniem użytkownika lub szerokością formularza, a pasek otwiera się i zamyka tak samo w trybie panelu bocznego i akordeonu.

Collapsed przełącza między dwiema szerokościami
ExpandedWidth (220) i CollapsedWidth (56) w pikselach logicznych
AnimateCollapse włącza lub wyłącza animację
OnCollapsedChange informuje, kiedy pasek się otwiera lub zamyka

Przeczytaj temat pomocy

Układ i tryby

Steruj stronami na podstawie zaznaczenia

Pasek nawigacji jest użyteczny tylko wtedy, gdy zmienia to, co widzi użytkownik. Kliknij lub dotknij włączonej pozycji, a pasek zaznaczy ją, wywoła OnItemClick, a potem OnClick pozycji. OnSelectionChange to jedyne miejsce, w którym pokazujesz odpowiednią stronę, na przykład kartę TPageControl z ukrytymi kartami, dokładnie tak jest zbudowane demo SidebarApp. SelectedIndex odczytuje i ustawia bieżącą stronę z kodu. Wyłącz pozycję, do której użytkownik jeszcze nie ma dostępu, wyjaśnij powód w podpowiedzi albo ukryj ją dla ról, które nie powinny jej widzieć, a logika zaznaczania nadal działa.

SelectedIndex to strona wybrana przez użytkownika
OnSelectionChange przełącza stronę lub ramkę
OnItemClick na pasku i OnClick dla każdej pozycji
Enabled, Hint i Visible dla każdej pozycji

Przeczytaj temat pomocy

Pozycje, które informują

Wiersze niosą więcej niż podpis: ikonę, licznik i powiązanie z już napisaną logiką.

Pozycje, które informują

Plakietki z liczbą nieprzeczytanych

Użytkownicy powinni widzieć, że coś wymaga uwagi, zanim otworzą stronę. Nadaj pozycji Badge, na przykład liczbę nieprzeczytanych lub słowo New, a pasek narysuje ją jako pigułkę w kolorze akcentu po prawej stronie wiersza, z czarnym lub białym tekstem, zależnie od tego, co jest czytelniejsze. Ustawiaj ją z kodu przy każdej zmianie wartości, a pasek sam się odrysuje. Na zwiniętym pasku plakietka staje się kropką na ikonie. Ponieważ plakietka to zwykły tekst, ta sama właściwość obsługuje liczniki, krótkie etykiety i słowa statusu bez własnego kodu rysującego.

Badge to krótki tekst dla każdej pozycji
Pusty Badge nic nie rysuje
Pigułka używa akcentu motywu lub Twojego AccentColor
Połącz z Hint, aby wyjaśnić licznik

Przeczytaj temat pomocy

Pozycje, które informują

Ikony z listy obrazów lub glif

Każdy wiersz ma miejsce na ikonę. Wskaż paskowi listę obrazów, której już używasz, i ustaw ImageIndex dla każdej pozycji, a obrazy z maską lub 32-bitowe są konwertowane raz i trzymane w pamięci podręcznej do zmiany listy. Nie masz jeszcze listy obrazów? Ustaw zamiast tego Glyph, literę lub krótki symbol, który podąża za kolorami motywu, tak wyglądają dema. Wyłączona pozycja rysuje obraz z 40-procentową przezroczystością, więc stan jest jasny na pierwszy rzut oka. Można mieszać oba sposoby: pozycje z indeksem obrazu pokazują obraz, a pozostałe wracają do glifu, więc ikony możesz dodawać stopniowo.

Images i ImageIndex dla list obrazów
Glyph dla litery lub symbolu bez obrazów
VCL rysuje obrazy w ich własnym rozmiarze
Listy obrazów FireMonkey od Delphi XE8

Przeczytaj temat pomocy

Pozycje, które informują Tylko zarejestrowana

Podłącz pozycje do swoich TAction

Aplikacje zbudowane na TActionList trzymają już polecenia, podpisy i reguły włączenia w jednym miejscu. Powiąż pozycję z dowolnym TAction VCL lub FireMonkey przez właściwość Action, a jej Caption, Enabled, Visible, Hint i ImageIndex podążają za akcją. Kliknięcie wykonuje akcję z paskiem jako ActionComponent, a OnUpdate działa w czasie bezczynności, więc pozycja szarzeje, gdy tylko jej akcja zostanie wyłączona. W .NET to samo robią Command i CommandParameter. Jeden TActionList może sterować menu, paskiem narzędzi i skrótami klawiszowymi formularza.

Action łączy pozycję z dowolnym TBasicAction
OnClick pozycji działa zamiast akcji
Kompilowane pod SGC_NAVIGATION_ACTIONS
.NET: Command i CommandParameter z ICommand

Community: zamiast akcji przypisz OnClick pozycji lub OnItemClick paska.

Przeczytaj temat pomocy

Klawiatura, motywy i eksport

Szczegóły, dzięki którym pasek wygląda natywnie i pozostaje spójny z resztą aplikacji.

Klawiatura, motywy i eksport

Nawigacja przede wszystkim z klawiatury

Zaawansowani użytkownicy przełączają strony bez myszy, a audyty dostępności tego oczekują. Pasek przejmuje fokus klawiszem Tab i porusza zaznaczony wiersz po widocznych, włączonych pozycjach: strzałki w górę i w dół przesuwają o jedną, Home i End skaczą, Enter lub Spacja aktywuje. W akordeonie strzałka w lewo zwija grupę, a w prawo ją rozwija. Przerywana ramka fokusu pojawia się tylko podczas używania klawiatury, a fokus pozostaje oddzielony od wybranej strony. Te same klawisze działają w pasku FireMonkey przez CanFocus, więc użytkownicy desktopu mają to samo zachowanie na każdej platformie.

TabStop jest domyślnie włączony dla paska VCL
FocusedIndex modelu to wiersz klawiatury
SelectedIndex pozostaje wybraną stroną
Podpowiedzi pokazują podpis na zwiniętym pasku

Przeczytaj temat pomocy

Klawiatura, motywy i eksport

Jasny, ciemny i Twój kolor akcentu

Menu, które ignoruje motyw aplikacji, wygląda na doklejone. Theme ustawia kolory powierzchni, obramowania, tekstu, nagłówka grupy, najechania i akcentu ze wspólnych tokenów sgcUICore, więc pasek i sgcDashboard z tym samym Theme pasują idealnie. AccentColor zastępuje akcent kolorem Twojej marki dla paska zaznaczenia, ramki fokusu i plakietek. Pasek umieszczony w kafelku dashboardu sam podąża za motywem dashboardu. Przełącz motyw w czasie działania, a pasek odrysuje się od razu, gotowy na przełącznik trybu ciemnego na stronie ustawień.

Theme: utDefault (domyślnie, podąża za motywem aplikacji), utLight lub utDark
AccentColor jako wartość $AARRGGBB, 0 zachowuje akcent motywu
Te same tokeny co w każdym produkcie sgcUI
Kafelki dashboardu przekazują swój motyw do paska

Przeczytaj temat pomocy

Klawiatura, motywy i eksport

Renderuj pasek bez okna

Dokumentacja, testy wizualne i zaplecza webowe czasem potrzebują obrazu menu, a nie samego menu. Renderer w sgcNavigation_Render rysuje TsgcNavigationModel bez okna i bez VCL czy FireMonkey, więc program konsolowy, usługa lub serwer tworzy ten sam pasek jako PNG lub SVG. Jednostka kompiluje się na każdej platformie, także Linux64, a parametr skali daje ostre obrazy na ekranach o wysokim DPI. Przekaż rendererowi swoją listę obrazów, a wyeksportowany obraz pokaże te same ikony co działająca aplikacja.

sgcNavigationSaveToPNG zapisuje plik lub strumień PNG
sgcNavigationSaveToSVG zapisuje ten sam pasek jako SVG
sgcNavigationRender rysuje na dowolnym canvasie sgcUICore
Szerokość i wysokość w pikselach logicznych, razy skala

Przeczytaj temat pomocy

W AKCJI

Zobacz sgcNavigation w akcji

sgcNavigation w demach pakietu sgcUI: kompletne aplikacje działające offline na wbudowanych danych symulowanych.

Pasek boczny ERP grupuje dziesięć modułów pod sześcioma nagłówkami.
Altamira ERP →

Powłoka stanowiska tradingowego: zwinięty pasek ikon obok stanowiska.
Altamira Markets →

Powłoka sterowni w jasnym motywie.
Altamira Plant →

Pasek boczny PMO z aktywnymi plakietkami ryzyk i przeciążonych osób.
Altamira PMO →

Zobacz wszystkie dema pakietu

ZRZUTY EKRANU

sgcNavigation w akcji

Jedna właściwość przełącza pasek między utLight i utDark; pozycje, plakietki i zaznaczenie pozostają bez zmian.

Mode = nbmAccordion z AllowMultiExpand: Sales i Inventory są otwarte, Admin jest zamknięty.

Ustaw Badge na pozycji, aby pokazać liczbę nieprzeczytanych: Inbox 12, Tasks 3, Alerts 1.

Po lewej: ImageIndex wybiera ikony z TImageList. Po prawej: Glyph rysuje literę, lista obrazów nie jest potrzebna.

ZASTOSOWANIA

Kto buduje z sgcNavigation

Nowoczesna powłoka dla aplikacji ERP i administracyjnych

Masz dziesiątki istniejących formularzy i główne okno, które nadal otwiera je z paska menu. Umieść panel boczny po lewej, jedną pozycję na obszar, i pozwól, aby OnSelectionChange przełączał karty TPageControl z ukrytymi kartami. Plakietki pokazują zamówienia oczekujące lub nieprzeczytane wiadomości, a pasek ikon oddaje formularzom ich miejsce. Uruchom SidebarApp, aby zobaczyć ten wzorzec działający ze stroną sgcDashboard.

Tryb panelu bocznego
Plakietki
Zwijanie do paska ikon

Uruchom demo SidebarApp

Ustawienia i konsole administracyjne

Ekrany konfiguracji grupują dziesiątki stron pod kilkoma nagłówkami, takimi jak Sales, Inventory i Admin. Akordeon trzyma otwartą jedną sekcję naraz lub kilka z AllowMultiExpand, a linki Action używają ponownie poleceń i reguł włączenia Twojego TActionList. Użytkownicy klawiatury poruszają się po sekcjach strzałkami. Demo Accordion pokazuje trzy grupy, przełącznik rozwijania i dziennik kliknięć.

Tryb akordeonu
Linki Action
Nawigacja z klawiatury

Uruchom demo Accordion

Ta sama nawigacja na każdej platformie

Aplikacja FireMonkey działająca na Windows, macOS, iOS i Androidzie nie powinna potrzebować innego menu na każdej z nich. TsgcFMXNavigationBar ma te same pozycje, tryby i zdarzenia co pasek VCL, a paski .NET dla WinForms, WPF i Avalonia używają tych samych nazw. Zespoły, które dostarczają aplikację desktopową w Delphi i narzędzie .NET, zachowują jeden model myślenia. SidebarFMX to wersja FireMonkey dema panelu bocznego.

Pasek FireMonkey
Motywy
Paski .NET

Uruchom demo SidebarFMX

SZYBKI START

Pasek nawigacji w kilku linijkach

To samo API w Delphi, C++ Builder i C#: pasek akordeonu z grupami, plakietką, wyłączoną pozycją i przyciskiem Collapse.

procedure TMainForm.CreateNavigation;
var
  oItem: TsgcNavigationItem;
begin
  // an accordion bar on the left, dark theme, several groups open at once
  FNav := TsgcVCLNavigationBar.Create(Self);
  FNav.Parent := Self;
  FNav.Align := alLeft;
  FNav.Mode := nbmAccordion;
  FNav.AllowMultiExpand := True;
  FNav.Theme := utDark;
  // a group header (third parameter True), then the items under it
  FNav.Items.AddItem('Sales', '', True);
  FNav.Items.AddItem('Orders', 'O');
  FNav.Items.AddItem('Invoices', 'I').Badge := '3';
  FNav.Items.AddItem('Admin', '', True);
  oItem := FNav.Items.AddItem('Users', 'U');
  oItem.Hint := 'Manage the users';
  oItem := FNav.Items.AddItem('Billing', 'B');
  oItem.Enabled := False;
  FNav.SelectedIndex := 1;
  FNav.OnItemClick := NavItemClick;
  FNav.OnSelectionChange := NavSelectionChange;
  // a Collapse button folds the bar into an icon rail with an animation
  FNav.AnimateCollapse := True;
  FButton.Caption := 'Collapse';
  FButton.OnClick := ButtonClick;
end;

procedure TMainForm.NavItemClick(Sender: TObject; aItem: TsgcNavigationItem);
begin
  Caption := 'Clicked: ' + aItem.Caption;
end;

procedure TMainForm.NavSelectionChange(Sender: TObject);
begin
  FPanel.Caption := FNav.Items[FNav.SelectedIndex].Caption + ' page';
end;

procedure TMainForm.ButtonClick(Sender: TObject);
begin
  FNav.Collapsed := not FNav.Collapsed;
end;

#include <vcl.h>
#include <Vcl.ExtCtrls.hpp>
#include "sgcUICore_Theme.hpp"
#include "sgcNavigation_Model.hpp"
#include "sgcNavigation_VCL.hpp"

class TNavHandler : public TObject
{
public:
  TsgcVCLNavigationBar *Nav;
  TPanel *Content;
  void __fastcall ItemClick(TObject *Sender, TsgcNavigationItem *aItem);
  void __fastcall SelectionChange(TObject *Sender);
  void __fastcall CollapseClick(TObject *Sender);
};

void __fastcall TNavHandler::ItemClick(TObject *Sender, TsgcNavigationItem *aItem)
{
  Content->Caption = "Clicked: " + aItem->Caption;
}

void __fastcall TNavHandler::SelectionChange(TObject *Sender)
{
  Content->Caption = Nav->Items->Items[Nav->SelectedIndex]->Caption + " page";
}

void __fastcall TNavHandler::CollapseClick(TObject *Sender)
{
  Nav->Collapsed = !Nav->Collapsed;   // animated fold into an icon rail
}

void __fastcall CreateNavigation(TForm *Form, TNavHandler *Handler)
{
  // an accordion bar on the left, dark theme, several groups open at once
  TsgcVCLNavigationBar *Nav = new TsgcVCLNavigationBar(Form);
  Nav->Parent = Form;
  Nav->Align = alLeft;
  Nav->Mode = nbmAccordion;
  Nav->AllowMultiExpand = true;
  Nav->AnimateCollapse = true;
  Nav->Theme = utDark;
  // a group header (third parameter true), then the items under it
  Nav->Items->AddItem("Sales", "", true);
  Nav->Items->AddItem("Orders", "O", false);
  Nav->Items->AddItem("Invoices", "I", false)->Badge = "3";
  Nav->Items->AddItem("Admin", "", true);
  Nav->Items->AddItem("Users", "U", false)->Hint = "Manage the users";
  Nav->Items->AddItem("Billing", "B", false)->Enabled = false;
  Nav->SelectedIndex = 1;
  TPanel *Content = new TPanel(Form);
  Content->Parent = Form;
  Content->Align = alClient;
  Handler->Nav = Nav;
  Handler->Content = Content;
  Nav->OnItemClick = Handler->ItemClick;
  Nav->OnSelectionChange = Handler->SelectionChange;
  TButton *Button = new TButton(Form);
  Button->Parent = Content;
  Button->Caption = "Collapse";
  Button->OnClick = Handler->CollapseClick;
}

using System;
using System.Windows.Forms;
using esegece.sgcUICore;
using esegece.sgcNavigation;

internal class MainForm : Form
{
    private readonly TsgcWinFormsNavigationBar Nav = new TsgcWinFormsNavigationBar();
    private readonly Label lblPage = new Label { Dock = DockStyle.Fill };
    private readonly Button btnCollapse = new Button { Text = "Collapse", Dock = DockStyle.Top };

    public MainForm()
    {
        // an accordion bar on the left, dark theme, several groups open at once
        Nav.Dock = DockStyle.Left;
        Nav.Mode = TsgcNavigationMode.nbmAccordion;
        Nav.AllowMultiExpand = true;
        Nav.AnimateCollapse = true;
        Nav.Theme = TsgcUITheme.utDark;
        // a group header (third parameter true), then the items under it
        Nav.Items.AddItem("Sales", "", true);
        Nav.Items.AddItem("Orders", "O");
        Nav.Items.AddItem("Invoices", "I").Badge = "3";
        Nav.Items.AddItem("Admin", "", true);
        Nav.Items.AddItem("Users", "U").Hint = "Manage the users";
        Nav.Items.AddItem("Billing", "B").Enabled = false;
        Nav.SelectedIndex = 1;
        Nav.OnItemClick = (sender, item) => Text = "Clicked: " + item.Caption;
        Nav.OnSelectionChange = sender => lblPage.Text = Nav.Items[Nav.SelectedIndex].Caption + " page";
        // the Collapse button folds the bar into an icon rail with an animation
        btnCollapse.Click += (s, e) => Nav.Collapsed = !Nav.Collapsed;
        Controls.Add(lblPage);
        Controls.Add(btnCollapse);
        Controls.Add(Nav);
    }
}

dotnet add package esegece.sgcNavigation.WinForms

Pobierz wersję próbną

DEMA

Uruchom dema sgcNavigation

Dema SidebarApp i Accordion są dostępne dla VCL i C++ Builder, wersja FireMonkey dla Delphi, a w edycji .NET jako projekty WinForms, WPF i Avalonia.

SidebarApp

Panel boczny sterujący kontrolką stron z ukrytymi kartami, z ikonami, plakietką, wyłączoną pozycją, przyciskiem Collapse, listą motywów i stroną KPI sgcDashboard. Pokazuje wzorzec powłoki aplikacji od początku do końca.

Tylko zarejestrowana Accordion

Trzy grupy, Sales, Inventory i Admin, przełącznik AllowMultiExpand, linki Action i dziennik kliknięć. Używa linków Action, więc wymaga edycji zarejestrowanej lub wersji próbnej.

SidebarFMX

Demo panelu bocznego zbudowane z TsgcFMXNavigationBar dla FireMonkey, tylko dla Delphi. Te same pozycje, tryby i zdarzenia co w wersji VCL, gotowe na cele Windows, macOS i mobilne.

Skompilowane dema

Gotowe do uruchomienia pliki wykonywalne każdego produktu sgcUI, nic nie trzeba instalować.

Pobierz sgcUI_bin.zip →

EDYCJE

Gdzie jest sgcNavigation

sgcNavigation jest w każdej edycji sgcUI, począwszy od Standard, i jest też sprzedawany osobno. sgcNavigation jest również w pakiecie All-Access.

Pojedynczy pakiet sgcNavigation

€149 / programista, pełny kod źródłowy, 1 rok aktualizacji.

Kup sgcNavigation → Zobacz cennik →

sgcUI Standard

sgcNavigation, sgcGrid, sgcToolbar i sgcEditors, od €380.

Zobacz Standard →

sgcUI Professional

Standard plus sgcCharts, sgcDashboard i sgcGauges, od €529.

Zobacz Professional →

sgcUI Enterprise

Wszystkie produkty sgcUI (14), od €699.

Zobacz Enterprise →

Bezpłatna edycja Community (esegece.sgcNavigation.Community w NuGet) ma wszystko oprócz linków Action pozycji.

Funkcja	Community (bezpłatna)	Zarejestrowana
Tryby panelu bocznego i akordeonu	✓	✓
Zwijanie do animowanego paska ikon	✓	✓
Ikony, glify i plakietki	✓	✓
Nawigacja z klawiatury	✓	✓
Jasny i ciemny motyw, kolor akcentu	✓	✓
Eksport PNG i SVG bez okna	✓	✓
Linki Action (Delphi) i Command (.NET)	−	✓

PLATFORMY

Obsługiwane frameworki i platformy

Komponenty w sgcNavigation

Komponent	Cel
TsgcVCLNavigationBar	Delphi i C++ Builder, VCL (sgcNavigation_VCL)
TsgcFMXNavigationBar	Delphi i C++ Builder, FireMonkey (sgcNavigation_FMX)
TsgcNavigationItem, TsgcNavigationItems, TsgcNavigationModel	Model niezależny od frameworka (sgcNavigation_Model)
TsgcWinFormsNavigationBar	.NET, WinForms
TsgcWpfNavigationBar	.NET, WPF
TsgcAvaloniaNavigationBar	.NET, Avalonia

Cel	Komponent	Platformy
Delphi 7 do 13, VCL	TsgcVCLNavigationBar	Win32 i Win64
Delphi XE6 do 13, FireMonkey	TsgcFMXNavigationBar	Windows, macOS, iOS, Android i Linux (FMXLinux)
C++ Builder 2007 do 13	TsgcVCLNavigationBar, TsgcFMXNavigationBar	Wygenerowane nagłówki .hpp i biblioteki statyczne
Delphi 10.2 do 13, bez frameworka	Model i renderer PNG oraz SVG bez okna	Linux64, na przykład do renderowania paska na serwerze
.NET Framework 4.7.2, .NET 8, 9 i 10	TsgcWinFormsNavigationBar, paski WPF i Avalonia	WinForms, WPF i Avalonia

FAQ

Najczęściej zadawane pytania

Oba. Właściwość Mode przełącza między nbmSidebar i nbmAccordion na tej samej kontrolce, z tymi samymi pozycjami i zdarzeniami, więc możesz zmienić zdanie późno w projekcie lub zaoferować oba style jako preferencję użytkownika. Każdy tryb zwija się też do paska ikon.

Tak. Obsłuż OnSelectionChange i pokaż stronę odpowiadającą SelectedIndex, na przykład kartę TPageControl z ukrytymi kartami albo utwórz ramkę na żądanie. Demo SidebarApp jest zbudowane dokładnie w ten sposób i zawiera stronę KPI sgcDashboard.

Tak. TsgcFMXNavigationBar obsługuje Windows, macOS, iOS, Android i Linux (FMXLinux) od Delphi XE6, z tymi samymi pozycjami, trybami i zdarzeniami co pasek VCL. Listy obrazów FireMonkey wymagają Delphi XE8 lub nowszego; starsze wersje używają Glyph każdej pozycji.

Tylko linków Action pozycji, które w .NET to właściwości Command i CommandParameter. Użyj zamiast tego OnClick pozycji lub OnItemClick paska. Każda inna funkcja, w tym pasek ikon, plakietki, motywy i eksport bez okna, jest w Community. Zobacz Edycje.

Nie. Port .NET nie ma czasowników projektanta ani edytora kolekcji, więc pozycje nie są serializowane i dodajesz je w kodzie, zwykle w konstruktorze formularza lub okna. W Delphi i C++ Builder kolekcja Items jest edytowana w czasie projektowania standardowym edytorem kolekcji.

Tak. Wszystkie rozmiary to piksele logiczne pomnożone przez skalę monitora, więc wiersze, ikony i plakietki są ostre przy dowolnym DPI. W WinForms szerokości i wysokości skalują się z DPI / 96 jak w VCL, a w WPF i Avalonia są jednostkami niezależnymi od urządzenia.

Tak. sgcNavigationSaveToPNG i sgcNavigationSaveToSVG renderują pasek z jego modelu bez okna i bez VCL czy FireMonkey, także na Linux64 od Delphi 10.2. Użyj tego do dokumentacji, testów regresji wizualnej lub strony webowej pokazującej menu Twojej aplikacji.

DOKUMENTACJA

Pomoc sgcNavigation

Podręczniki PDF

Delphi, C++ Builder i .NET, obejmujące każdy produkt sgcUI.

POWIĄZANE

Dobrze współpracuje z

sgcToolbar

Dodaj pasek narzędzi i pasek stanu z tymi samymi tokenami motywu, a dostaniesz kompletną powłokę aplikacji wokół swoich formularzy.

Poznaj sgcToolbar →

sgcDashboard

Umieść dashboard KPI na stronie obok paska, jak robi to demo SidebarApp, a pasek podąży za jego motywem.

Poznaj sgcDashboard →

sgcGrid

Pokaż rekordy wybranego obszaru w siatce danych na żywo, która aktualizuje się według klucza z dowolnego wątku.

Poznaj sgcGrid →

sgcNavigation, pasek nawigacji z panelem bocznym i akordeonem dla Delphi, C++ Builder & .NET

Wszystko, czego potrzebuje menu aplikacji

Układ i tryby

Nowoczesny panel boczny aplikacji w jednym komponencie

Przełącz na akordeon jedną właściwością

Zwijanie do paska ikon, z animacją

Steruj stronami na podstawie zaznaczenia

Pozycje, które informują

Plakietki z liczbą nieprzeczytanych

Ikony z listy obrazów lub glif

Podłącz pozycje do swoich TAction

Klawiatura, motywy i eksport

Nawigacja przede wszystkim z klawiatury

Jasny, ciemny i Twój kolor akcentu

Renderuj pasek bez okna

Zobacz sgcNavigation w akcji

sgcNavigation w akcji

Kto buduje z sgcNavigation

Nowoczesna powłoka dla aplikacji ERP i administracyjnych

Ustawienia i konsole administracyjne

Ta sama nawigacja na każdej platformie

Pasek nawigacji w kilku linijkach

Uruchom dema sgcNavigation

SidebarApp

Tylko zarejestrowana Accordion

SidebarFMX

Skompilowane dema

Gdzie jest sgcNavigation

Pojedynczy pakiet sgcNavigation

sgcUI Standard

sgcUI Professional

sgcUI Enterprise

Obsługiwane frameworki i platformy

Komponenty w sgcNavigation

Najczęściej zadawane pytania

Pomoc sgcNavigation

Delphi

C++ Builder

.NET

Podręczniki PDF

Dobrze współpracuje z

sgcToolbar

sgcDashboard

sgcGrid

Wypróbuj sgcNavigation już dziś