FireMonkey, .NET & Delphi 7 tot 13 Onderdeel van sgcUI

sgcNavigation, dezelfde navigatiebalk voor FireMonkey, .NET en Delphi 7 tot 13

Geef je applicatie in een paar minuten een modern navigatiemenu. Eén besturingselement is een zijbalk of een accordeon, klapt met een vloeiende animatie in tot een pictogrammenrail, toont badges voor aantallen ongelezen berichten en werkt volledig met het toetsenbord. Lichte en donkere thema's zijn ingebouwd, en het tabbladformulier zet de documenttabbladen in een titelbalk met thema, zoals een webbrowser. Eén model en één headless renderer sturen de balk aan op FireMonkey, WinForms, WPF, Avalonia, de VCL van Delphi 7 tot 13 en C++ Builder, zodat elke front end van je product op dezelfde manier navigeert.

FireMonkey, WinForms, WPF, Avalonia, VCLDelphi 7 tot 13C++ Builder 2007 tot 13Gratis .NET Community-editieInbegrepen in sgcUI Standard
Proefversie downloaden Bekijk hoe het draait
SidebarApp-demo met een zijbalk van 8 items in de groepen Workspace en Business, Dashboard geselecteerd en twee KPI-kaarten rechts
BELANGRIJKSTE FUNCTIES

Alles wat een appmenu nodig heeft

Twintig functies die een lijst met pagina's omvormen tot een navigatieshell waarin je gebruikers zich meteen thuis voelen.

Indeling en modi

Eén besturingselement dekt de twee navigatiestijlen die bedrijfsapplicaties gebruiken, en de smalle rail ertussen.

Een moderne app-zijbalk in één component

Indeling en modi

Een moderne app-zijbalk in één component

De meeste bedrijfsapplicaties hebben aan de linkerrand van het hoofdformulier hetzelfde nodig: een lijst met pagina's, gegroepeerd per gebied, waarbij de huidige pagina duidelijk is gemarkeerd. Plaats een TsgcVCLNavigationBar op het formulier, lijn hem links uit en voeg de items toe. Groepskoppen geven de rijen eronder een titel in een gedempte kleur en worden nooit geselecteerd. De geselecteerde rij krijgt een achtergrond met een accenttint en een accentbalk van 3 pixels, zodat gebruikers altijd zien waar ze zijn. Hover- en ingedrukte statussen, hints en uitgeschakelde rijen worden allemaal voor je getekend, zodat de balk bij de eerste keer uitvoeren al af oogt.

  • Mode := nbmSidebar is de standaardstijl
  • IsGroup maakt van een item een groepskop
  • ItemHeight en GroupHeight bepalen de rijhoogtes
  • Het muiswiel scrolt lange lijsten en ScrollIntoView toont elk item
  • Rechts naar links voor Arabisch en Hebreeuws: pictogrammen en bijschriften wisselen van plaats, en de inspringing, chevrons, badges en de inklapknop zijn gespiegeld
Het helponderwerp lezen
Schakel met één eigenschap over naar een accordeon

Indeling en modi

Schakel met één eigenschap over naar een accordeon

Instellingenschermen en beheerconsoles hebben vaak meer secties dan er op het scherm passen. Zet Mode op nbmAccordion en elke groepskop wordt een sectie die de items eronder opent en sluit, met een chevron rechts en ingesprongen onderliggende items. Standaard is er maar één groep tegelijk open, waardoor een lang menu kort blijft. Zet AllowMultiExpand aan wanneer gebruikers meerdere secties tegelijk open willen hebben. De items, de gebeurtenissen en je code blijven precies hetzelfde. Items vóór de eerste kop horen bij geen enkele groep en worden altijd getoond, wat goed past bij een item Home of Dashboard boven de secties.

  • Mode := nbmAccordion schakelt de hele balk om
  • Expanded opent of sluit een groep vanuit code
  • AllowMultiExpand laat meerdere groepen open
  • Indent bepaalt de inspringing van de onderliggende items
Het helponderwerp lezen

Indeling en modi

Inklappen tot een pictogrammenrail, geanimeerd

Brede zijbalken nemen ruimte in van de gegevens waarvoor je gebruikers kwamen. Zet Collapsed aan en de balk klapt in ongeveer 150 ms van zijn uitgeklapte breedte in tot een smalle pictogrammenrail. In de rail worden alleen de pictogrammen getekend, het bijschrift wordt de hint, groepskoppen worden scheidingslijnen en badges worden stippen, zodat er niets belangrijks verloren gaat. De balk bepaalt zijn eigen breedte, dus de inhoud ernaast volgt gewoon met alClient. Koppel de eigenschap Collapsed aan een hamburgerknop, een gebruikersinstelling of de breedte van het formulier, en de rail opent en sluit op dezelfde manier in zijbalk- en in accordeonmodus.

  • Collapsed schakelt tussen de twee breedtes
  • ExpandedWidth (220) en CollapsedWidth (56) in logische pixels
  • AnimateCollapse zet de animatie aan of uit
  • OnCollapsedChange meldt wanneer de rail opent of sluit
Het helponderwerp lezen

Indeling en modi

Stuur je pagina's aan met de selectie

Een navigatiebalk is pas nuttig als hij bepaalt wat de gebruiker ziet. Klik of tik op een ingeschakeld item en de balk selecteert het, activeert OnItemClick en voert daarna de OnClick van het item uit. OnSelectionChange is de enige plek om de bijbehorende pagina te tonen, bijvoorbeeld het tabblad van een TPageControl met verborgen tabbladen, precies zoals de SidebarApp-demo is opgebouwd. SelectedIndex leest en zet de huidige pagina vanuit code. Schakel een item uit dat de gebruiker nog niet kan bereiken, leg in de hint uit waarom, of verberg het voor rollen die het niet mogen zien, en de selectielogica blijft werken.

  • SelectedIndex is de pagina die de gebruiker koos
  • OnSelectionChange wisselt de pagina of het frame
  • OnItemClick op de balk en OnClick per item
  • Enabled, Hint en Visible per item
Het helponderwerp lezen

Een boom met meerdere niveaus en zoekfunctie, tabbladen voor documenten, een breadcrumb en een opdrachtpalet, allemaal op hetzelfde frameworkneutrale model als de balk.

NavigationShellFMX-demo met links een doorzoekbare boom van Mail, Contacts, Calendar en Settings, vier tabbladen met Work actief en een breadcrumb Mail, Folders, Work boven de pagina

Navigatieshell

Een boom met meerdere niveaus en zoekfunctie

Grote toepassingen ontgroeien een platte lijst met pagina's. Zet Mode op nbmTree en de balk wordt een boom met zoveel niveaus als je nodig hebt: de items blijven één platte verzameling en de Depth van een item bepaalt het niveau, dus de code die de balk vult verandert nauwelijks. Elk niveau is ingesprongen en elke ouder kan worden ingeklapt. Zet ShowSearch aan en een zoekrij boven de items filtert de boom terwijl de gebruiker typt, houdt de ouders van elke treffer open en markeert de overeenkomende tekens. Vage overeenkomst vindt 'Settings' met 'stg'. Boommodus en zoeken zijn onderdeel van elke editie.

  • Mode := nbmTree en Depth per item
  • ExpandAll, CollapseAll en Expand(aIndex, aRecursive)
  • Filter met FilterMode nfmContains of nfmFuzzy
  • ShowSearch tekent de zoekrij, Esc wist die
  • Rechts en Links klappen uit en in, * klapt een hele tak uit
Het helponderwerp lezen

Navigatieshell

Tabbladen voor de geopende documenten

Toepassingen in documentstijl tonen hun geopende pagina's als tabbladen. TsgcFMXNavigationTabs, TsgcVCLNavigationTabs en de balken voor WinForms, WPF en Avalonia tekenen tabbladen met een pictogram, een titel, een sluitknop en een gewijzigd-stip, plus een knop voor een nieuw tabblad en een lijst met alle tabbladen. Als de tabbladen niet passen, verkleint TabSizing ze of verschijnen er schuifknoppen. De Control van een tabblad is de pagina die de balk toont zolang het tabblad actief is. In de editie Registered sleept de gebruiker tabbladen ook naar een andere plek, zet hij de tabbladen vast die moeten blijven en sleept hij een tabblad uit de balk om het in een eigen venster te openen, en SaveLayout bewaart de indeling voor de volgende keer.

  • Tabs.AddTab, ActiveIndex en Control per tabblad
  • TabSizing, CloseButtons, ShowNewButton, ShowListButton
  • Ctrl+Tab, middelste klik om te sluiten, OnTabClose kan weigeren
  • Alleen geregistreerd herschikken door slepen, Pinned-tabbladen, OnTabTearOff, SaveLayout en LoadLayout
Het helponderwerp lezen Herschikken, vastgezette tabbladen en losmaken

Navigatieshell

Een breadcrumb die de boom volgt

Diepe bomen hebben een manier nodig om te zien waar je bent en om terug omhoog te springen. De breadcrumb toont het pad als een rij segmenten, bijvoorbeeld Mail, Folders, Work. Een klik op een segment gaat daarheen terug, en de chevron na een segment toont de kinderen om ergens anders heen te gaan. Koppel hem aan een navigatiebalk en hij volgt het geselecteerde item, of vul hem zelfstandig vanuit een Path of de Segments. Als het pad te lang is, klappen de eerste segmenten samen in een overloopknop. In de editie Registered maakt een klik op het lege gebied, F4 of Ctrl+L van de breadcrumb een invoerveld met het volledige pad, zoals de adresbalk van een bestandsbeheerder.

  • NavigationBar koppelt de breadcrumb aan een balk
  • Path, PathDelimiter en OnGetChildren zelfstandig
  • OnSegmentClick en AutoTruncate
  • Alleen geregistreerd bewerkmodus met OnPathEdit
Het helponderwerp lezen

Navigatieshell Alleen geregistreerd

Een opdrachtpalet voor elke opdracht

Ervaren gebruikers typen liever dan door menu's te zoeken. Druk op Ctrl+Shift+P en het opdrachtpalet opent bovenaan het venster: typ een paar letters en het rangschikt elke opdracht op vage overeenkomst, zodat 'tgsb' 'Toggle sidebar' vindt, met de overeenkomende tekens gemarkeerd, de categorie of het pad in een gedempte kleur en de sneltoets rechts. Bij een lege zoekopdracht staan de recent gebruikte opdrachten bovenaan. Het palet toont zijn eigen opdrachten en elke opdrachtbron die je toevoegt: de items van een navigatiebalk, de knoppen van een lint of een werkbalk (Delphi), de acties van een actielijst of een eigen bron.

  • Commands.AddCommand met een categorie, trefwoorden en sneltoetstekst
  • Sources.AddSource voor een balk, een lint, een werkbalk of een actielijst
  • SaveRecent en LoadRecent bewaren de lijst met recente opdrachten
  • ICommand op de opdrachten in .NET

Editie Registered op FireMonkey, VCL, WinForms, WPF en Avalonia. De interface IsgcUICommandSource is onderdeel van elke editie.

Het helponderwerp lezen Opdrachtbronnen

Navigatieshell

Een formulier met de tabbladen in de titelbalk

Browsers, terminals en moderne editors zetten hun tabbladen in de venstertitel, zodat de documenten de volledige hoogte van het scherm krijgen. Het tabbladformulier doet hetzelfde voor je applicatie. Plaats het op een formulier en koppel het aan de balk met tabbladen: sgcUI verwijdert de native titel en tekent een titelbalk met thema, met het venstericoon, de tabbladen, de knop voor een nieuw tabblad en de knoppen minimaliseren, maximaliseren en sluiten, in het sgcUI-thema van de applicatie, Classic of Fluent, licht of donker. Het venster behoudt zijn schaduw, zijn randen om het formaat te wijzigen en zijn gedrag bij maximaliseren, en Windows 11 toont de snaplayouts wanneer de aanwijzer op de knop Maximaliseren rust. De lege ruimte rechts van het laatste tabblad sleept het venster. In de editie Registered sleept de gebruiker een tabblad uit de balk naar een nieuw venster en zet het neer op de titelbalk van een ander venster, zoals in een webbrowser.

  • TsgcVCLNavigationTabbedForm en TsgcFMXNavigationTabbedForm in Delphi en C++ Builder, TsgcWinFormsNavigationTabbedForm, TsgcWpfNavigationTabbedWindow en TsgcAvaloniaNavigationTabbedWindow in .NET
  • Tabs koppelt de balk met tabbladen. In Delphi verplaatst Notebook de balk van een notebook naar de titelbalk, terwijl de pagina's in het notebook blijven
  • Een dubbelklik op de lege balk maximaliseert het venster en een rechtsklik toont het systeemmenu
  • In WPF en Avalonia stelt de gekoppelde eigenschap Tabs op het venster het formulier in vanuit XAML
  • Alleen geregistreerd losmaken: TearOffMode verplaatst een losgemaakt tabblad naar het venster onder de aanwijzer, en ttmNewForm opent het in een nieuw venster vanuit OnCreateTearOffForm dat de aanwijzer volgt

Het tabbladformulier zit in elke editie, ook in Community. Losmaken zit in de editie Registered, net als het losmaken van de tabbladen. Het kader met thema vereist Windows met desktopcompositie en wordt in FireMonkey alleen op Windows toegepast: op macOS, Linux, iOS en Android blijft de native titelbalk.

Het helponderwerp lezen Vensterkader .NET-tabbladformulier

Dockingmanager

Een werkruimte in IDE-stijl: toolpanelen gedockt aan elke zijde, automatisch verborgen of zwevend, een documentgebied met tabbladen in het midden en een indeling die als JSON wordt opgeslagen.

Dockruimte met Explorer en Search als tabbladen links, een automatisch verborgen strook Toolbox, vier documenttabbladen, Properties rechts en Output onderaan, met de dockgeleiders en de voorbeeldrechthoek op de rechterhelft van de documenten terwijl Output wordt gesleept

Dockingmanager Alleen geregistreerd

Sleep panelen naar de dockgeleiders

Toepassingen met veel toolvensters hebben een werkruimte nodig die de gebruiker zelf kan indelen. TsgcVCLDockManager, TsgcFMXDockManager, TsgcWinFormsDockManager, TsgcWpfDockManager en TsgcAvaloniaDockManager docken toolpanelen aan de vier zijden van het formulier, in geneste splitsingen met splitters en in groepen met tabbladen. De gebruiker sleept een bijschrift of een tabblad en dockgeleiders tonen waar het kan landen: een kompas op de groep onder de aanwijzer splitst die groep aan een zijde of voegt het paneel als tabblad toe, de randgeleiders docken het aan een rand van de hele dockruimte en een voorbeeldrechthoek in de accentkleur toont de ruimte die het inneemt. Esc breekt het slepen af. De pagina Avalonia-docking toont TsgcAvaloniaDockManager in XAML en C#.

  • Panels.Add met Name, Caption, Placement en DockSize, en je eigen besturingselement als Control
  • DockPanel, ClosePanel, ShowPanel en ActivatePanel in code
  • OnPanelDock kan het docken, zweven of automatisch verbergen weigeren
  • Knoppen voor sluiten, vastpinnen, maximaliseren en het menu op elk bijschrift
Het helponderwerp lezen Slepen en neerzetten

Dockingmanager Alleen geregistreerd

Verberg panelen automatisch in de zijstroken

Toolpanelen die je maar af en toe nodig hebt, horen niet de hele tijd ruimte in te nemen. De pinknop van een bijschrift verbergt de groep automatisch: de panelen worden tabbladen op een dunne strook aan de zijkant van het formulier, en aanwijzen of klikken op een tabblad schuift het paneel over de inhoud naar buiten. Het schuift terug zodra de gebruiker elders werkt, en de pinknop van de flyout dockt de groep weer, aan de zijde en op de grootte die hij had. Op iOS en Android opent een tik de flyout.

  • Model.SetAutoHide(aPanel, True) in code
  • AutoHideDelay stelt de aanwijsvertraging in, standaard 400 ms
  • CanAutoHide per paneel, documenten verbergen zich nooit automatisch
  • Alt+F7 en het opdrachtpalet openen de flyout van een automatisch verborgen paneel
Het helponderwerp lezen

Dockingmanager Alleen geregistreerd

Zwevende vensters op het bureaublad

Een paneel dat buiten de geleiders wordt losgelaten, zweeft in een eigen venster, dat de gebruiker naar een andere plek of een andere monitor verplaatst. Een zwevend venster bevat een indeling zoals de dockruimte, zodat er meer panelen naast elkaar of als tabbladen in kunnen worden gedockt, en een dubbelklik op het bijschrift dockt het weer. Zwevende vensters zijn randloze toolvensters die eigendom zijn van het formulier en niet in de taakbalk staan, met een getekend bijschrift en een rand waarmee ze van grootte veranderen, en elk gebruikt de schaal van zijn eigen monitor. Ze werken in de desktoptoepassingen met VCL, WinForms, WPF en Avalonia en in FireMonkey op Windows en macOS. Op iOS en Android zweven panelen niet, en slepen toont alleen de geleiders.

  • FloatPanel(aPanel, aLeft, aTop) in code
  • AllowFloating op de dockingmanager en CanFloat per paneel
  • Placement := dplFloat laat een paneel zwevend starten op FloatWidth bij FloatHeight
  • Een zwevend venster buiten het zichtbare werkgebied springt terug naar binnen wanneer een indeling wordt geladen
Het helponderwerp lezen

Dockingmanager Alleen geregistreerd

Een documentgebied met tabbladen in het midden

Het midden van de dockruimte bevat de documenten: een of meer documentgroepen, elk met bovenaan een tabbladstrook. De strook werkt als de navigatietabbladen, met herschikken door slepen, vastgezette documenten vooraan, sluitknoppen, een gewijzigd-stip, een middelste klik om te sluiten, Ctrl+Tab en de lijst met alle tabbladen. Sleep een documenttabblad naar een zijarm van het kompas om het gebied in twee documentgroepen te splitsen, naast elkaar of gestapeld, maak het los om het te laten zweven, of dubbelklik erop om zijn groep te maximaliseren. De knop voor een nieuw tabblad activeert OnNewDocument, waar je code het volgende document maakt.

  • Kind := dpkDocument, met Pinned en Modified per paneel
  • DocumentTabSizing, DocumentCloseButtons, DocumentShowNewButton en DocumentShowListButton
  • Ctrl+F6 wisselt tussen de documenten, OnActiveDocumentChange meldt het actieve document
  • OnPanelClose kan een document open houden
Het helponderwerp lezen

Dockingmanager Alleen geregistreerd

Sla de indeling op en herstel hem

Gebruikers verwachten hun panelen terug te vinden waar ze die hebben achtergelaten. SaveLayout schrijft de hele indeling als compacte JSON: de splitsingen en hun groottes, de groepen en hun actieve panelen, de automatisch verborgen groepen van elke zijde, de zwevende vensters met hun positie en grootte, de gemaximaliseerde groep en de verborgen panelen. LoadLayout herstelt hem bij de volgende start. De tekst is in Delphi en .NET gelijk, dus een indelingsbestand volstaat voor beide. Een paneel dat de indeling noemt maar dat het formulier nog niet heeft, zoals een document dat open was, komt bij OnRestorePanel, waar je code de inhoud maakt of het paneel laat vallen.

  • SaveLayout, SaveLayoutToFile en SaveLayoutToStream
  • LoadLayout, LoadLayoutFromFile en LoadLayoutFromStream geven False terug bij een vreemde tekst en wijzigen niets
  • OnRestorePanel voor panelen die tijdens runtime zijn gemaakt
  • Een opdracht "Window" per paneel maakt van het opdrachtpalet een vensterwisselaar

Editie Registered op FireMonkey, VCL, WinForms, WPF en Avalonia, met ondersteuning voor C++ Builder. Toetsenbord, UI Automation, van rechts naar links, thema's en hoge DPI zijn inbegrepen.

Het helponderwerp lezen

Items die informeren

Rijen bevatten meer dan een bijschrift: een pictogram, een aantal en een link naar de logica die je al hebt geschreven.

Badges voor aantallen ongelezen berichten

Items die informeren

Badges voor aantallen ongelezen berichten

Gebruikers moeten zien dat iets aandacht nodig heeft voordat ze de pagina openen. Geef een item een Badge, zoals een aantal ongelezen berichten of het woord Nieuw, en de balk tekent die als een pil in de accentkleur rechts in de rij, met zwarte of witte tekst, wat het best leest. Zet de waarde vanuit code wanneer ze verandert en de balk tekent zichzelf opnieuw. In de ingeklapte rail wordt de badge een stip op het pictogram. Omdat de badge gewone tekst is, dekt dezelfde eigenschap aantallen, korte labels en statuswoorden zonder eigen tekencode.

  • Badge is een korte tekst per item
  • Een lege Badge tekent niets
  • De pil gebruikt het thema-accent of je AccentColor
  • Combineer met Hint om het aantal toe te lichten
Het helponderwerp lezen
Pictogrammen uit je afbeeldingenlijst of een glyph

Items die informeren

Pictogrammen uit je afbeeldingenlijst of een glyph

Elke rij heeft een pictogramplek. Wijs de balk naar de afbeeldingenlijst die je al gebruikt en zet ImageIndex per item, en afbeeldingen met masker of van 32 bit worden één keer geconverteerd en gecachet tot de lijst verandert. Nog geen afbeeldingenlijst? Zet dan een Glyph, een letter of kort symbool dat de themakleuren volgt, zoals de demo's eruitzien. Een uitgeschakeld item tekent zijn afbeelding met 40 procent dekking, zodat de status in één oogopslag duidelijk is. Beide combineren mag: items met een afbeeldingsindex tonen de afbeelding en de andere vallen terug op hun glyph, zodat je pictogrammen geleidelijk kunt toevoegen.

  • Images en ImageIndex voor afbeeldingenlijsten
  • Glyph voor een letter of symbool zonder afbeeldingen
  • VCL tekent de afbeeldingen op hun eigen grootte
  • FireMonkey-afbeeldingenlijsten vanaf Delphi XE8
Het helponderwerp lezen

Items die informeren Alleen geregistreerd

Koppel items aan je TActions

Applicaties die op een TActionList zijn gebouwd, hebben hun commando's, bijschriften en enabled-regels al op één plek. Koppel een item via de eigenschap Action aan een willekeurige VCL- of FireMonkey-TAction en zijn Caption, Enabled, Visible, Hint en ImageIndex volgen de actie. Een klik voert de actie uit met de balk als ActionComponent, en OnUpdate draait bij inactiviteit, zodat een item grijs wordt zodra zijn actie is uitgeschakeld. In .NET doen Command en CommandParameter hetzelfde werk. Eén TActionList kan het menu, de werkbalk en de sneltoetsen van het formulier aansturen.

  • Action koppelt een item aan een willekeurige TBasicAction
  • De OnClick van een item wordt uitgevoerd in plaats van de actie
  • Gecompileerd onder SGC_NAVIGATION_ACTIONS
  • .NET: Command en CommandParameter met ICommand

Community: wijs de OnClick van het item of de OnItemClick van de balk toe in plaats van een actie.

Het helponderwerp lezen

Toetsenbord, thema's en uitvoer

De details waardoor de balk native aanvoelt en consistent blijft met de rest van je applicatie.

Navigeren met het toetsenbord eerst

Toetsenbord, thema's en uitvoer

Power users wisselen van pagina zonder muis, en toegankelijkheidsreviews verwachten dat. De balk krijgt de focus met Tab en verplaatst een rij met focus over de zichtbare, ingeschakelde items: Omhoog en Omlaag stappen, Home en End springen, Enter of Spatie activeert. In het accordeon klapt Links een groep in en Rechts klapt hem uit. De gestippelde focusrechthoek verschijnt alleen als het toetsenbord in gebruik is, en de focus blijft los van de geselecteerde pagina. Dezelfde toetsen werken in de FireMonkey-balk via CanFocus, zodat desktopgebruikers op elk platform hetzelfde gedrag krijgen.

  • TabStop staat standaard aan voor de VCL-balk
  • FocusedIndex van het model is de toetsenbordrij
  • SelectedIndex blijft de gekozen pagina
  • Hints tonen het bijschrift in de ingeklapte rail
Het helponderwerp lezen
Licht, donker en je eigen accentkleur

Toetsenbord, thema's en uitvoer

Licht, donker en je eigen accentkleur

Een menu dat het thema van de applicatie negeert, ziet er opgeplakt uit. Theme bepaalt de kleuren van oppervlak, rand, tekst, groepskop, hover en accent uit de gedeelde sgcUICore-tokens, zodat een balk en een sgcDashboard met hetzelfde Theme precies overeenkomen. AccentColor vervangt het accent door je merkkleur voor de selectiebalk, de focusrechthoek en de badges. Een balk in een dashboardtegel volgt zelf het thema van het dashboard. Wissel het thema tijdens runtime en de balk tekent meteen opnieuw, klaar voor een donkere-modusschakelaar op je instellingenpagina.

  • Theme: utDefault (standaard, volgt het applicatiethema), utLight of utDark
  • AccentColor als $AARRGGBB-waarde, 0 behoudt het themaaccent
  • Dezelfde tokens als elk sgcUI-product
  • Dashboardtegels geven hun thema door aan de balk
Het helponderwerp lezen
Render de balk zonder venster

Toetsenbord, thema's en uitvoer

Render de balk zonder venster

Documentatie, visuele tests en web-backends hebben soms een afbeelding van het menu nodig, niet het menu zelf. De renderer in sgcNavigation_Render tekent een TsgcNavigationModel zonder venster en zonder VCL of FireMonkey, zodat een consoleprogramma, een service of een server dezelfde balk als PNG of SVG maakt. De unit bouwt op elk platform, Linux64 inbegrepen, en een schaalparameter geeft scherpe afbeeldingen voor high-DPI-schermen. Geef je afbeeldingenlijst door aan de renderer en de geëxporteerde afbeelding toont dezelfde pictogrammen als de draaiende applicatie.

  • sgcNavigationSaveToPNG schrijft een PNG-bestand of -stream
  • sgcNavigationSaveToSVG schrijft dezelfde balk als SVG
  • sgcNavigationRender tekent op elk sgcUICore-canvas
  • Breedte en hoogte in logische pixels, maal de schaal
Het helponderwerp lezen
IN ACTIE

Zie sgcNavigation in actie

sgcNavigation in de sgcUI suite-demo's: complete applicaties die offline draaien met ingebouwde gesimuleerde gegevens.

De ERP-zijbalk groepeert tien modules onder zes koppen.

De ERP-zijbalk groepeert tien modules onder zes koppen.

Altamira ERP →
De shell van de handelsdesk: een ingeklapte pictogrambalk naast de desk.

De shell van de handelsdesk: een ingeklapte pictogrambalk naast de desk.

Altamira Markets →
De shell van de controlekamer in het lichte thema.

De shell van de controlekamer in het lichte thema.

Altamira Plant →
De PMO-zijbalk, met live badges voor risico's en overboekte mensen.

De PMO-zijbalk, met live badges voor risico's en overboekte mensen.

Altamira PMO →
Bekijk alle suite-demo's
TOEPASSINGEN

Wie bouwt er met sgcNavigation

Een moderne schil voor ERP- en beheerapps

Je hebt tientallen bestaande formulieren en een hoofdvenster dat ze nog vanuit een menubalk opent. Zet links een zijbalk neer, één item per gebied, en laat OnSelectionChange de tabbladen van een TPageControl met verborgen tabbladen wisselen. Badges tonen openstaande bestellingen of ongelezen berichten, en de pictogrammenrail geeft de formulieren hun ruimte terug. Voer SidebarApp uit om het patroon met een sgcDashboard-pagina aan het werk te zien.

  • Zijbalkmodus
  • Badges
  • Inklappen tot een pictogrammenrail
Start de SidebarApp-demo

Instellingen- en beheerconsoles

Configuratieschermen groeperen tientallen pagina's onder een paar koppen zoals Sales, Inventory en Admin. Het accordeon houdt één sectie tegelijk open, of meerdere met AllowMultiExpand, en de actielinks hergebruiken de commando's en enabled-regels van je TActionList. Toetsenbordgebruikers bewegen met de pijltoetsen door de secties. De Accordion-demo toont drie groepen, een uitklapschakelaar en een klikgeschiedenis.

  • Accordeonmodus
  • Actielinks
  • Toetsenbordnavigatie
Start de Accordion-demo

Dezelfde navigatie op elk platform

Een FireMonkey-applicatie die op Windows, macOS, iOS en Android draait, zou op elk platform geen ander menu nodig moeten hebben. TsgcFMXNavigationBar heeft dezelfde items, modi en gebeurtenissen als de VCL-balk, en de .NET-balken voor WinForms, WPF en Avalonia volgen dezelfde namen. Teams die een Delphi-desktopapp en een .NET-tool opleveren, houden één mentaal model. SidebarFMX is de FireMonkey-versie van de zijbalkdemo.

  • FireMonkey-balk
  • Thema's
  • .NET-balken
Start de SidebarFMX-demo
SNEL STARTEN

Een navigatiebalk in een paar regels

Dezelfde API in FireMonkey, C#, Delphi VCL en C++ Builder: een accordeonbalk met groepen, een badge, een uitgeschakeld item en een Collapse-knop. De tabbladen FireMonkey en C# voegen een tabbladenbalk en een opdrachtpalet toe.

uses
  FMX.Types, FMX.Controls, FMX.Forms, FMX.StdCtrls,
  sgcUICore_Theme, sgcNavigation_Model, sgcNavigation_FMX;

procedure TMainForm.CreateNavigation;
begin
  // an accordion bar on the left, dark theme, several groups open at once
  FNav := TsgcFMXNavigationBar.Create(Self);
  FNav.Parent := Self;
  FNav.Align := TAlignLayout.Left;
  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);
  FNav.Items.AddItem('Users', 'U').Hint := 'Manage the users';
  FNav.Items.AddItem('Billing', 'B').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.Text := 'Collapse';
  FButton.OnClick := ButtonClick;
end;

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

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

procedure TMainForm.ButtonClick(Sender: TObject);
begin
  FNav.Collapsed := not FNav.Collapsed;
end;
uses
  FMX.Types, FMX.Controls,
  sgcNavigation_Tabs, sgcNavigation_Tabs_FMX,
  sgcNavigation_Palette, sgcNavigation_Palette_FMX;

procedure TMainForm.CreateShell;
var
  oTab: TsgcNavigationTab;
  oCommand: TsgcCommandPaletteCommand;
begin
  // a tab strip on top: every tab shows its own page
  FTabs := TsgcFMXNavigationTabs.Create(Self);
  FTabs.Parent := FContent;
  FTabs.Align := TAlignLayout.Top;
  oTab := FTabs.Tabs.AddTab('Orders');
  oTab.Control := FOrdersPage;
  FTabs.ActiveIndex := oTab.Index;
  // the command palette (Registered edition), Ctrl+Shift+P opens it
  FPalette := TsgcFMXCommandPalette.Create(Self);
  oCommand := FPalette.Commands.AddCommand('Toggle sidebar', 'View', 'Ctrl+B');
  oCommand.OnExecute := ButtonClick;
  // every item of the bar becomes a "Go to" command
  FPalette.Sources.AddSource(FNav);
end;
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;

Een venster in browserstijl: TsgcVCLNavigationTabbedForm verplaatst de balk met tabbladen naar een titelbalk met thema.

uses
  Classes, Controls, Forms,
  sgcNavigation_Tabs, sgcNavigation_Tabs_VCL, sgcNavigation_TabbedForm_VCL;

procedure TMainForm.CreateTabbedForm;
begin
  // a browser style strip with close buttons and a new tab button
  FTabs := TsgcVCLNavigationTabs.Create(Self);
  FTabs.Parent := Self;
  FTabs.ShowNewButton := True;
  FTabs.CloseButtons := tcbAlways;
  FTabs.Tabs.AddTab('Home');
  FTabs.Tabs.AddTab('Orders');
  FTabs.ActiveIndex := 0;
  // the window frame: the strip moves into the themed title bar
  FTabbedForm := TsgcVCLNavigationTabbedForm.Create(Self);
  FTabbedForm.Tabs := FTabs;
  // Registered edition: a tab dropped on another tabbed window moves there
  FTabbedForm.TearOffMode := ttmEvent;
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);
    }
}
// tabs and a command palette on the same form
private readonly TsgcWinFormsNavigationTabs Tabs = new TsgcWinFormsNavigationTabs();
private readonly TsgcWinFormsCommandPalette Palette = new TsgcWinFormsCommandPalette();

private void CreateShell(Control aOrdersPage)
{
    // a tab strip on top: every tab shows its own page
    Tabs.Dock = DockStyle.Top;
    TsgcNavigationTab oTab = Tabs.Tabs.AddTab("Orders");
    oTab.Control = aOrdersPage;
    Tabs.ActiveIndex = oTab.Index;
    Controls.Add(Tabs);
    // the command palette (Registered edition), Ctrl+Shift+P on this form opens it
    Palette.OwnerForm = this;
    TsgcCommandPaletteCommand oCommand = Palette.Commands.AddCommand("Toggle sidebar", "View", "Ctrl+B");
    oCommand.OnExecute = sender => Nav.Collapsed = !Nav.Collapsed;
    // every item of the bar becomes a "Go to" command
    Palette.Sources.AddSource(Nav);
}
dotnet add package esegece.sgcNavigation.WinForms
Proefversie downloaden
DEMO'S

Probeer de sgcNavigation-demo's uit

De NavigationShell- en DockingShell-demo's worden meegeleverd voor FireMonkey, VCL, WinForms, WPF en Avalonia. De zijbalkdemo wordt meegeleverd voor FireMonkey, en de SidebarApp- en Accordion-demo's worden in de .NET-editie meegeleverd als WinForms-, WPF- en Avalonia-projecten en voor Delphi VCL en C++ Builder.

NavigationShellFMX

Alleen geregistreerd NavigationShellFMX

Een complete navigatieshell voor FireMonkey, alleen voor Delphi: links een boom met een zoekrij, een tabblad per geopende pagina, een breadcrumb die de boom volgt en een opdrachtpalet (Ctrl+Shift+P) dat de items van de balk en een actielijst toont. Schakelaars voor het donkere thema en van rechts naar links zijn inbegrepen. De demo gebruikt het palet, dus je hebt de editie Registered of de proefversie nodig.

Alleen geregistreerd NavigationShell

Dezelfde shell voor de VCL, met bovenaan een klein lint waarvan de opdrachten ook in het opdrachtpalet verschijnen met hun pad 'Tab > Group', naast de items van de boom en de acties van een actielijst. Schakelaars voor het donkere thema en van rechts naar links zijn inbegrepen.

Alleen geregistreerd NavigationShell voor .NET

De navigatieshell in de .NET-editie: NavigationShell voor WinForms, NavigationShellWpf en NavigationShellAvalonia, elk met de boom en het zoeken, de tabbladen, de breadcrumb en het opdrachtpalet.

DockingShell

Alleen geregistreerd DockingShell en DockingShellFMX

Een shell in IDE-stijl op basis van de dockingmanager, voor de VCL en voor FireMonkey: een boom van de navigatiebalk als Explorer links, Properties rechts, Output automatisch verborgen onderaan en memodocumenten met vastgezette en gewijzigde tabbladen in het midden. Het opdrachtpalet toont per paneel een opdracht Window, een themaschakelaar en een knop Reset layout zijn inbegrepen, en de indeling wordt bij het sluiten als JSON opgeslagen en bij de volgende start geladen.

Alleen geregistreerd DockingShell voor .NET

De dockingshell in de .NET-editie: DockingShell voor WinForms, DockingShellWpf en DockingShellAvalonia, elk met gedockte, automatisch verborgen en zwevende panelen, het documentgebied en de opgeslagen indeling.

TabbedForm and TabbedFormFMX

Een venster in browserstijl met de tabbladen in de titelbalk, voor de VCL en voor FireMonkey, met C++ Builder-tegenhangers: een knop voor een nieuw tabblad, sluitknoppen en een themakiezer met licht, donker, Fluent licht en Fluent donker. Sleep een tabblad uit de balk en het opent in een nieuw venster dat de aanwijzer volgt. Zet het daarna neer op de titelbalk van een ander venster. Losmaken vereist de editie Registered. In de .NET-editie wordt het meegeleverd als TabbedForm voor WinForms, TabbedFormWpf en TabbedFormAvalonia.

SidebarFMX

De zijbalkdemo gebouwd met TsgcFMXNavigationBar voor FireMonkey, alleen voor Delphi. Dezelfde items, modi en gebeurtenissen als de VCL-versie, klaar voor Windows, macOS en mobiele doelen.

SidebarApp

SidebarApp

Een zijbalk die een paginabesturingselement met verborgen tabbladen aanstuurt, met pictogrammen, een badge, een uitgeschakeld item, een knop Inklappen, een themakeuzelijst en een sgcDashboard-KPI-pagina. Bewijst het applicatieschilpatroon van begin tot eind.

Accordion

Alleen geregistreerd Accordion

Drie groepen, Sales, Inventory en Admin, een AllowMultiExpand-schakelaar, actielinks en een klikgeschiedenis. Hij gebruikt actielinks, dus je hebt de editie Registered of de proefversie nodig.

Gecompileerde demo's

Direct uitvoerbare programma's van elk sgcUI-product, zonder installatie.

sgcUI_bin.zip downloaden →

Getting Started-gids

Vijf QuickStart-demo's voor Delphi (VCL) staan in Demos\Navigation\Delphi\00.QuickStart. De PDF-gids (Engels) legt ze stap voor stap uit: een eerste navigatiebalk, een menu dat in code wordt opgebouwd, documenttabbladen, thema's en stijlen en een kleine mailclient.

Download de gids (PDF, Engels) →
KIEZEN

sgcNavigation of de VCL-besturingselementen van RAD Studio 13.2?

RAD Studio 13.2 Florence heeft twee VCL-besturingselementen toegevoegd, TNavigationView en TTabView. Als je toepassing alleen VCL is en je bouwt met 13.2 of nieuwer, zijn ze een goede ingebouwde keuze. sgcNavigation voegt waarde toe wanneer dezelfde navigatie op FireMonkey en .NET moet draaien, wanneer je met oudere Delphi-versies bouwt en wanneer je een breadcrumb, een opdrachtpalet of een doorzoekbare boom nodig hebt.

TNavigationView is een verticale lijst met items met een normale en een compacte modus, afbeeldingen, tekst over meerdere regels, schuiven en herschikken door slepen, en koppelt zijn items aan een besturingselement met meerdere pagina's, een frame of een TCardPanel. TTabView is een moderne variant van TTabSet waarvan de tabbladen formulieren of andere besturingselementen bevatten, met een afbeelding, tekst over meerdere regels en een sluitknop op elk tabblad, een knop om een tabblad toe te voegen, een keuzelijst met alle tabbladen en schuifknoppen. Beide zijn goed ontworpen en volgen het VCL-programmeermodel, dus voor een nieuw VCL-project op 13.2 zijn ze het bekijken waard.

sgcNavigation houdt achter elke host één frameworkneutraal model en één headless renderer. De balk, en de tabbladen, de breadcrumb, de boom met meerdere niveaus en het opdrachtpalet die zich in deze versie bij de balk voegen, gedragen zich hetzelfde op FireMonkey, WinForms, WPF, Avalonia en de VCL van Delphi 7 tot 13, zodat een product met een desktop-, een mobiele en een .NET-front end overal op dezelfde manier navigeert.

OnderwerpsgcNavigationTNavigationView en TTabView (VCL, RAD Studio 13.2)
FrameworksFireMonkey, WinForms, WPF, Avalonia en VCLVCL
Delphi- en C++ Builder-versiesDelphi 7 tot 13 (VCL), Delphi XE6 tot 13 (FireMonkey), C++ Builder 2007 tot 13RAD Studio 13.2 en nieuwer
.NET-hostsWinForms, WPF en Avalonia op .NET Framework 4.7.2, .NET 8, 9 en 10Niet van toepassing, het zijn VCL-besturingselementen
Headless renderen op LinuxPNG- en SVG-uitvoer op Linux64 vanaf Delphi 10.2Niet beschreven in de documentatie van 13.2
Gedeeld model over frameworks heenEén frameworkneutraal model, met dezelfde namen in Delphi en .NETNiet beschreven in de documentatie van 13.2
BreadcrumbBreadcrumbbalk die het geselecteerde knooppunt van de balk kan volgenNiet beschreven in de documentatie van 13.2
OpdrachtpaletToetsenbordpalet met vage zoekfunctie over opdrachten, items en actiesNiet beschreven in de documentatie van 13.2
Zoeken in de boomBoom met meerdere niveaus en een zoekrij die de ouders van elke treffer zichtbaar houdtNiet beschreven in de documentatie van 13.2

De details van TNavigationView en TTabView komen uit de RAD Studio 13 Florence Release 2-notities van Embarcadero.

EDITIES

Waar sgcNavigation in zit

sgcNavigation zit in elke sgcUI-editie, te beginnen met Standard, en wordt ook los verkocht. sgcNavigation zit ook in de All-Access-bundel.

sgcNavigation los pakket

€149 / ontwikkelaar, volledige broncode, 1 jaar updates.

sgcNavigation kopen → Prijzen bekijken →

sgcUI Standard

sgcNavigation, sgcGrid, sgcToolbar en sgcEditors, vanaf €380.

Standard bekijken →

sgcUI Professional

Standard plus sgcCharts, sgcDashboard en sgcGauges, vanaf €529.

Professional bekijken →

sgcUI Enterprise

Alle 17 sgcUI-producten, vanaf €699.

Enterprise bekijken →

De gratis Community-editie (esegece.sgcNavigation.Community op NuGet) heeft de balk met boommodus en zoeken, de basistabbladen en de basisbreadcrumb, het tabbladformulier met de tabbladen in de titelbalk en de interface voor opdrachtbronnen. De editie Registered voegt het opdrachtpalet toe, het herschikken van tabbladen, vastgezette tabbladen, losmaken en de opgeslagen tabbladindeling, de bewerkmodus van de breadcrumb, de dockingmanager en de actielinks van de items.

FunctieCommunity (gratis)Geregistreerd
Zijbalk- en accordeonmodus✓✓
Inklappen tot een geanimeerde pictogrammenrail✓✓
Pictogrammen, glyphs en badges✓✓
Toetsenbordnavigatie✓✓
Lichte en donkere thema's, accentkleur✓✓
Headless PNG- en SVG-uitvoer✓✓
Boommodus met meerdere niveaus en zoeken✓✓
Tabbladen: grootte, sluitknoppen, lijst- en nieuw-knoppen, schuiven, toetsenbord✓✓
Tabbladformulier: de tabbladen in een titelbalk met thema✓✓
Breadcrumb: segmenten, chevrons, overloop, koppeling aan een balk✓✓
Opdrachtbronnen (IsgcUICommandSource)✓✓
Opdrachtpalet−✓
Tabbladen herschikken door slepen, vastgezette tabbladen, losmaken, opgeslagen tabbladindeling−✓
Tabbladformulier losmaken in een nieuw venster−✓
Bewerkmodus van de breadcrumb−✓
Dockingmanager−✓
Actielinks (Delphi) en Command (.NET)−✓
PLATFORMEN

Ondersteunde frameworks en platformen

Componenten in sgcNavigation

ComponentDoel
TsgcFMXNavigationBarDelphi en C++ Builder, FireMonkey (sgcNavigation_FMX)
TsgcWinFormsNavigationBar.NET, WinForms
TsgcWpfNavigationBar.NET, WPF
TsgcAvaloniaNavigationBar.NET, Avalonia
TsgcVCLNavigationBarDelphi en C++ Builder, VCL (sgcNavigation_VCL)
TsgcFMXNavigationTabs, TsgcFMXNavigationBreadcrumb, TsgcFMXCommandPaletteDelphi en C++ Builder, FireMonkey (sgcNavigation_Tabs_FMX, sgcNavigation_Palette_FMX)
TsgcWinFormsNavigationTabs, TsgcWpfNavigationTabs, TsgcAvaloniaNavigationTabs.NET, WinForms, WPF en Avalonia, met de bijbehorende Breadcrumb- en CommandPalette-klassen
TsgcVCLNavigationTabs, TsgcVCLNavigationBreadcrumb, TsgcVCLCommandPaletteDelphi en C++ Builder, VCL (sgcNavigation_Tabs_VCL, sgcNavigation_Palette_VCL)
TsgcVCLNavigationTabbedForm, TsgcFMXNavigationTabbedFormDelphi en C++ Builder, VCL en FireMonkey (sgcNavigation_TabbedForm_VCL, sgcNavigation_TabbedForm_FMX), de titelbalk met thema op Windows
TsgcWinFormsNavigationTabbedForm, TsgcWpfNavigationTabbedWindow, TsgcAvaloniaNavigationTabbedWindow.NET, WinForms, WPF en Avalonia
TsgcVCLDockManager, TsgcFMXDockManagerDelphi en C++ Builder, VCL en FireMonkey (sgcNavigation_Dock_VCL, sgcNavigation_Dock_FMX), editie Registered
TsgcWinFormsDockManager, TsgcWpfDockManager, TsgcAvaloniaDockManager.NET, WinForms, WPF en Avalonia, editie Registered
TsgcNavigationItem, TsgcNavigationItems, TsgcNavigationModelFrameworkneutraal model (sgcNavigation_Model)
DoelComponentPlatformen
Delphi XE6 tot 13, FireMonkeyTsgcFMXNavigationBarWindows, macOS, iOS, Android en Linux (FMXLinux)
.NET Framework 4.7.2, .NET 8, 9 en 10TsgcWinFormsNavigationBar, WPF- en Avalonia-balkenWinForms, WPF en Avalonia
Delphi 7 tot 13, VCLTsgcVCLNavigationBarWin32 en Win64
C++ Builder 2007 tot 13TsgcVCLNavigationBar, TsgcFMXNavigationBarGegenereerde .hpp-headers en statische bibliotheken
Delphi 10.2 tot 13, frameworkneutraalModel en headless PNG- en SVG-rendererLinux64, bijvoorbeeld om een balk op een server te renderen
VEELGESTELDE VRAGEN

Veelgestelde vragen

Als je toepassing alleen VCL is, zijn TNavigationView en TTabView in RAD Studio 13.2 een goede ingebouwde keuze en we bevelen ze graag aan. sgcNavigation past beter wanneer dezelfde navigatie ook moet draaien in FireMonkey op macOS, iOS, Android of Linux, of in een WinForms-, WPF- of Avalonia-toepassing, wanneer een deel van je team nog met een oudere Delphi of C++ Builder bouwt, of wanneer je een breadcrumb, een opdrachtpalet of een boom met meerdere niveaus en zoekfunctie bovenop de zijbalk wilt. Het model en de headless PNG- en SVG-renderer worden door elke host gedeeld. Zie Kiezen voor een vergelijkende tabel.

Ja, in de editie Registered. TsgcFMXCommandPalette, TsgcVCLCommandPalette en de paletten voor WinForms, WPF en Avalonia openen met Ctrl+Shift+P, rangschikken de opdrachten op vage overeenkomst terwijl de gebruiker typt en tonen de recent gebruikte opdrachten eerst. Naast zijn eigen opdrachten toont het palet elke opdrachtbron die je toevoegt: de items van een navigatiebalk, de opdrachten van een lint of een werkbalk in Delphi, de acties van een actielijst of een eigen bron via de interface IsgcUICommandSource. In .NET kan een opdracht een ICommand dragen. Zie het opdrachtpalet.

Allebei. De eigenschap Mode schakelt op hetzelfde besturingselement tussen nbmSidebar en nbmAccordion, met dezelfde items en gebeurtenissen, zodat je laat in het project van gedachten kunt veranderen of beide stijlen als gebruikersvoorkeur kunt aanbieden. Elke modus klapt ook in tot de ingeklapte pictogrammenrail.

Ja. Handel OnSelectionChange af en toon de pagina die bij SelectedIndex hoort, bijvoorbeeld het tabblad van een TPageControl met verborgen tabbladen, of maak op aanvraag een frame. De SidebarApp-demo is precies zo gebouwd en bevat een sgcDashboard-KPI-pagina.

Ja. TsgcFMXNavigationBar richt zich vanaf Delphi XE6 op Windows, macOS, iOS, Android en Linux (FMXLinux), met dezelfde items, modi en gebeurtenissen als de VCL-balk. FireMonkey-afbeeldingenlijsten vereisen Delphi XE8 of nieuwer; oudere versies gebruiken de Glyph van elk item.

Het opdrachtpalet, het herschikken van tabbladen door slepen, vastgezette tabbladen en losmaken, de bewerkmodus van de breadcrumb, de dockingmanager en de actielinks van de items, die in .NET de eigenschappen Command en CommandParameter zijn. Gebruik in plaats van de actielinks de OnClick van het item of de OnItemClick van de balk. Alle andere functies, waaronder de boom met zoeken, de tabbladen, de pictogrammenrail, badges, thema's en headless uitvoer, zitten in Community. Zie Edities.

Nee. De .NET-port heeft geen designer-verbs of collectie-editor, dus items worden niet geserialiseerd en je voegt ze in code toe, meestal in de constructor van het formulier of venster. In Delphi en C++ Builder bewerk je de collectie Items tijdens ontwerptijd met de standaard collectie-editor.

Ja. Alle afmetingen zijn logische pixels vermenigvuldigd met de schaal van de monitor, dus rijen, pictogrammen en badges zijn bij elke DPI scherp. In WinForms schalen breedtes en hoogtes met DPI / 96 zoals in VCL, en in WPF en Avalonia zijn het apparaatonafhankelijke eenheden.

Ja. sgcNavigationSaveToPNG en sgcNavigationSaveToSVG renderen een balk vanuit zijn model zonder venster en zonder VCL of FireMonkey, ook op Linux64 vanaf Delphi 10.2. Gebruik het voor documentatie, visuele regressietests of een webpagina die het menu van je applicatie toont.

Nee. Op iOS en Android docken, splitsen, tabben en verbergen de panelen van TsgcFMXDockManager zich automatisch, maar ze zweven niet: AllowFloating wordt afgedwongen op False, een tik opent een automatisch verborgen paneel omdat er geen aanwijzer is, een lange druk opent het paneelmenu en slepen toont alleen de dockgeleiders. Zwevende vensters werken in de desktoptoepassingen met VCL, WinForms, WPF en Avalonia en in FireMonkey op Windows en macOS. Een indeling die op de desktop is opgeslagen, laadt nog steeds op een telefoon: de panelen van de zwevende vensters houden hun oorspronkelijke plaatsing. Zie Zwevende vensters.

DOCUMENTATIE

sgcNavigation help

Delphi

Introductie, Quick Start VCL, Quick Start FireMonkey, TsgcVCLNavigationBar, Zijbalkmodus, Accordeonmodus, Inklappen, Badges, Thema's, Edities, Platformen.

C++ Builder

Introductie, Quick Start C++ Builder, TsgcVCLNavigationBar, Inklappen, Demo's.

.NET

.NET-overzicht, Quick Start WinForms, Quick Start WPF, Quick Start Avalonia, Verschillen met Delphi.

PDF-handleidingen

Delphi, C++ Builder en .NET, voor elk sgcUI-product.

3,000+Ontwikkelaars
20+Jaar
761+Componenten
30+API-integraties
5Platformen
Niet-goed-geld-terug-garantie van 30 dagenNiet tevreden? Vraag binnen 30 dagen na aankoop een volledige terugbetaling aan. Bekijk het terugbetalingsbeleid

Probeer sgcNavigation vandaag nog

De sgcUI-proefversie bevat sgcNavigation en elk ander sgcUI-product.

Proefversie downloaden sgcNavigation kopen