快速入门
几行代码实现导航栏
Delphi、C++ Builder 和 C# 中使用相同的 API：带分组、徽标、禁用条目和折叠按钮的手风琴导航栏。
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
