. scénář/. xib-méně návrh uživatelského rozhraní v Xamarin. Mac

  • Článek
  • 9 min ke čtení

Tento článek popisuje, jak vytvořit uživatelské rozhraní aplikace Xamarin. Mac přímo z kódu jazyka C#, bez souborů. scénáře, soubory. xib nebo Interface Builder.

Přehled

Při práci s C# a .NET v aplikaci Xamarin. Mac máte přístup ke stejným prvkům uživatelského rozhraní a nástrojům, které vývojář pracuje v Objective-C a Objective-C . Obvykle při vytváření aplikace Xamarin. Mac použijete Interface Builder Xcode se soubory. scénář nebo. xib k vytvoření a údržbě uživatelského rozhraní aplikace.

Máte také možnost vytvořit některé nebo všechny uživatelské rozhraní aplikace Xamarin. Mac přímo v kódu jazyka C#. V tomto článku se seznámíte se základy vytváření uživatelských rozhraní a prvků uživatelského rozhraní v kódu jazyka C#.

editor kódu Visual Studio pro Mac

Přepínání okna na použití kódu

Když vytvoříte novou aplikaci Xamarin. Mac kakaa, ve výchozím nastavení se zobrazí standardní prázdné okno. Tato okna jsou definovaná v Main. ve scénáři (nebo tradičně se jedná o soubor MainWindow. xib), který je automaticky zahrnutý v projektu. To zahrnuje také soubor soubor viewcontroller. cs , který spravuje hlavní zobrazení aplikace (nebo znovu tradičně MainWindow. cs a MainWindowController. cs soubor).

Chcete-li přepnout do okna Xibless pro aplikaci, postupujte následovně:

  1. otevřete aplikaci, kterou chcete .storyboard v Visual Studio pro Mac použít k definování uživatelského rozhraní, které chcete ukončit, nebo soubory. xib.

  2. V oblast řešeníklikněte pravým tlačítkem myši na soubor Main. scénář nebo MainWindow. xib a vyberte možnost Odebrat:

    Odebrání hlavního scénáře nebo okna

  3. V dialogovém okně odebratklikněte na tlačítko Odstranit . scénář nebo. xib můžete úplně odebrat z projektu:

    Potvrzení odstranění

Teď je potřeba upravit soubor MainWindow. cs a definovat rozložení okna a upravit soubor soubor viewcontroller. cs nebo MainWindowController. cs , aby se vytvořila instance naší třídy, protože už nepoužíváme soubor. scénář nebo. XIB.

Moderní aplikace Xamarin. Mac, které používají scénáře pro své uživatelské rozhraní, nemusí automaticky zahrnovat soubory MainWindow. cs, soubor viewcontroller. cs ani MainWindowController. cs . Podle potřeby jednoduše přidejte do projektu novou prázdnou třídu jazyka C# (Přidatnový soubor...ObecnéPrázdná třída) a pojmenujte ho jako chybějící soubor.

Definování okna v kódu

Dále upravte soubor MainWindow. cs a nastavte jeho vzhled jako na následující:

using System;
using Foundation;
using AppKit;
using CoreGraphics;

namespace MacXibless
{
    public partial class MainWindow : NSWindow
    {
        #region Private Variables
        private int NumberOfTimesClicked = 0;
        #endregion

        #region Computed Properties
        public NSButton ClickMeButton { get; set;}
        public NSTextField ClickMeLabel { get ; set;}
        #endregion

        #region Constructors
        public MainWindow (IntPtr handle) : base (handle)
        {
        }

        [Export ("initWithCoder:")]
        public MainWindow (NSCoder coder) : base (coder)
        {
        }

        public MainWindow(CGRect contentRect, NSWindowStyle aStyle, NSBackingStore bufferingType, bool deferCreation): base (contentRect, aStyle,bufferingType,deferCreation) {
            // Define the user interface of the window here
            Title = "Window From Code";

            // Create the content view for the window and make it fill the window
            ContentView = new NSView (Frame);

            // Add UI elements to window
            ClickMeButton = new NSButton (new CGRect (10, Frame.Height-70, 100, 30)){
                AutoresizingMask = NSViewResizingMask.MinYMargin
            };
            ContentView.AddSubview (ClickMeButton);

            ClickMeLabel = new NSTextField (new CGRect (120, Frame.Height - 65, Frame.Width - 130, 20)) {
                BackgroundColor = NSColor.Clear,
                TextColor = NSColor.Black,
                Editable = false,
                Bezeled = false,
                AutoresizingMask = NSViewResizingMask.WidthSizable | NSViewResizingMask.MinYMargin,
                StringValue = "Button has not been clicked yet."
            };
            ContentView.AddSubview (ClickMeLabel);
        }
        #endregion

        #region Override Methods
        public override void AwakeFromNib ()
        {
            base.AwakeFromNib ();

            // Wireup events
            ClickMeButton.Activated += (sender, e) => {
                // Update count
                ClickMeLabel.StringValue = (++NumberOfTimesClicked == 1) ? "Button clicked one time." : string.Format("Button clicked {0} times.",NumberOfTimesClicked);
            };
        }
        #endregion

    }
}

Pojďme projednávat několik klíčových prvků.

Nejdřív jsme přidali několik vypočítaných vlastností , které budou fungovat jako v případě, že se okno vytvořilo v souboru. ve scénáři nebo. xib):

public NSButton ClickMeButton { get; set;}
public NSTextField ClickMeLabel { get ; set;}

Poskytneme nám přístup k prvkům uživatelského rozhraní, které se zobrazí v okně. Vzhledem k tomu, že okno není rozploché ze souboru. scénář nebo. xib, potřebujeme způsob, jak ho vytvořit (jak uvidíme později ve MainWindowController třídě). To je to, co dělá tato nová metoda konstruktoru:

public MainWindow(CGRect contentRect, NSWindowStyle aStyle, NSBackingStore bufferingType, bool deferCreation): base (contentRect, aStyle,bufferingType,deferCreation) {
    ...
}

Tady budeme navrhovat rozložení okna a umístit všechny prvky uživatelského rozhraní potřebné k vytvoření požadovaného uživatelského rozhraní. Předtím, než můžeme do okna přidat libovolné prvky uživatelského rozhraní, potřebuje zobrazení obsahu , které obsahuje prvky:

ContentView = new NSView (Frame);

Tím se vytvoří zobrazení obsahu, které okno vyplní. Nyní přidáme první prvek uživatelského rozhraní NSButton do okna:

ClickMeButton = new NSButton (new CGRect (10, Frame.Height-70, 100, 30)){
    AutoresizingMask = NSViewResizingMask.MinYMargin
};
ContentView.AddSubview (ClickMeButton);

První věc, kterou si můžete všimnout, je, že na rozdíl od iOS macOS používá k definování souřadnicového systému okna matematický zápis. Proto je počátek v levém dolním rohu okna, s hodnotami, které se zvyšují vpravo a k pravému hornímu rohu okna. Když vytvoříme nový NSButton , vezmeme ho v úvahu, jak definujeme polohu a velikost na obrazovce.

AutoresizingMask = NSViewResizingMask.MinYMarginVlastnost oznamuje tlačítku, že má zůstat ve stejném umístění než v horní části okna, když se změní velikost okna svisle. To je nutné znovu, protože (0, 0) je v levém dolním rohu okna.

Nakonec ContentView.AddSubview (ClickMeButton) Metoda přidá NSButton do zobrazení obsahu, aby se při spuštění aplikace a zobrazení okna zobrazila na obrazovce.

Po přidání popisku do okna se zobrazí počet pokusů o NSButton kliknutí:

ClickMeLabel = new NSTextField (new CGRect (120, Frame.Height - 65, Frame.Width - 130, 20)) {
    BackgroundColor = NSColor.Clear,
    TextColor = NSColor.Black,
    Editable = false,
    Bezeled = false,
    AutoresizingMask = NSViewResizingMask.WidthSizable | NSViewResizingMask.MinYMargin,
    StringValue = "Button has not been clicked yet."
};
ContentView.AddSubview (ClickMeLabel);

Vzhledem k tomu, že macOS nemá konkrétní prvek uživatelského rozhraní popisku , Přidali jsme speciálně vytvořený styl, který není upravitelný, aby sloužil jako popisek. Stejně jako na tlačítku, velikost a umístění berou v úvahu, že (0, 0) je v levém dolním rohu okna. AutoresizingMask = NSViewResizingMask.WidthSizable | NSViewResizingMask.MinYMarginVlastnost používá operátor AutoresizingMask = NSViewResizingMask.WidthSizable | NSViewResizingMask.MinYMargin ke kombinování dvou NSViewResizingMask funkcí. Tím se popisek zůstane ve stejném umístění, v horní části okna, když je velikost okna svislá a zmenšená a zvětšuje se na šířku, protože se změní velikost okna vodorovně.

ContentView.AddSubview (ClickMeLabel)Metoda znovu přidá NSTextField do zobrazení obsahu, aby se při spuštění aplikace a otevření okna zobrazila na obrazovce.

Úprava kontroleru oken

Vzhledem k tomu, že návrh již MainWindow není načítán ze souboru. scénář nebo. xib, bude nutné provést některé úpravy řadiče oken. Upravte soubor MainWindowController. cs a nastavte jeho vzhled jako na následující:

using System;

using Foundation;
using AppKit;
using CoreGraphics;

namespace MacXibless
{
    public partial class MainWindowController : NSWindowController
    {
        public MainWindowController (IntPtr handle) : base (handle)
        {
        }

        [Export ("initWithCoder:")]
        public MainWindowController (NSCoder coder) : base (coder)
        {
        }

        public MainWindowController () : base ("MainWindow")
        {
            // Construct the window from code here
            CGRect contentRect = new CGRect (0, 0, 1000, 500);
            base.Window = new MainWindow(contentRect, (NSWindowStyle.Titled | NSWindowStyle.Closable | NSWindowStyle.Miniaturizable | NSWindowStyle.Resizable), NSBackingStore.Buffered, false);

            // Simulate Awaking from Nib
            Window.AwakeFromNib ();
        }

        public override void AwakeFromNib ()
        {
            base.AwakeFromNib ();
        }

        public new MainWindow Window {
            get { return (MainWindow)base.Window; }
        }
    }
}

Podíváme se na klíčové prvky této úpravy.

Nejprve definujeme novou instanci MainWindow třídy a přiřadíme jí vlastnost základního kontroleru oken Window :

CGRect contentRect = new CGRect (0, 0, 1000, 500);
base.Window = new MainWindow(contentRect, (NSWindowStyle.Titled | NSWindowStyle.Closable | NSWindowStyle.Miniaturizable | NSWindowStyle.Resizable), NSBackingStore.Buffered, false);

Určíme umístění okna obrazovky s CGRect . Stejně jako systém souřadnic okna obrazovka definuje (0, 0) jako spodní levý roh. Dále definujeme styl okna pomocí operátoru or pro kombinování dvou nebo více funkcí:

... (NSWindowStyle.Titled | NSWindowStyle.Closable | NSWindowStyle.Miniaturizable | NSWindowStyle.Resizable) ...

NSWindowStyleK dispozici jsou následující funkce:

  • Bez okrajů – okno nebude mít žádné ohraničení.
  • S názvem – okno bude mít záhlaví.
  • Closable – okno má tlačítko Zavřít a může být zavřeno.
  • Miniaturizable – okno má tlačítko Miniaturize a může být minimalizováno.
  • Měnitelné velikosti – okno bude mít tlačítko změnit velikost a bude měnitelné.
  • Nástroj – okno je stylem okna (panel).
  • DocModal – Pokud je okno panel, bude místo v systému modální.
  • NonactivatingPanel – Pokud je okno panelem, nebude provedeno hlavní okno.
  • TexturedBackground – okno bude mít pozadí s texturou.
  • Bez měřítka – okno se škáluje.
  • UnifiedTitleAndToolbar – oblasti názvu okna a panelu nástrojů budou připojeny.
  • HUD – okno se zobrazí jako panel zobrazení na více hlavích.
  • FullScreenWindow – okno může vstoupit do režimu zobrazení na celé obrazovce.
  • FullSizeContentView – zobrazení obsahu okna je za oblastí nadpisu a panelu nástrojů.

Poslední dvě vlastnosti definují typ ukládání do vyrovnávací paměti pro okno a při vykreslování okna budou odloženy. další informace o NSWindows najdete v tématu NSWindows společnosti Apple.

Nakonec, vzhledem k tomu, že okno není rozploché ze souboru. scénář nebo. xib, musíme ho simulovat v naší MainWindowController. cs voláním metody Windows:

Window.AwakeFromNib ();

To vám umožní kód v okně stejně jako standardní okno načtené ze souboru. scénář nebo. XIB.

Zobrazení okna

Po odebrání souboru. scénář nebo. xib a změně souborů MainWindow. cs a MainWindowController. cs budete okno používat stejně jako jakékoli normální okno, které bylo vytvořeno v Interface Builder Xcode se souborem. XIB.

Následující vytvoří novou instanci okna a jeho kontrolér a zobrazí okno na obrazovce:

private MainWindowController mainWindowController;
...

mainWindowController = new MainWindowController ();
mainWindowController.Window.MakeKeyAndOrderFront (this);

V tomto okamžiku, pokud je aplikace spuštěná a tlačítko se kliklo několikrát, se zobrazí následující:

Ukázková aplikace spouští .

Přidání okna pouze kódu

Pokud chceme přidat jenom kód, xibless okno do existující aplikace Xamarin. Mac, klikněte pravým tlačítkem na projekt v oblast řešení a vyberte Přidatnový soubor... V dialogovém okně nový soubor vyberte Xamarin. Mackakaové Window s kontrolkou, jak je znázorněno níže:

Přidání nového kontroleru oken

Stejně jako předtím odstraníme výchozí soubor. scénář nebo. xib z projektu (v tomto případě SecondWindow. xib) a podle pokynů v části Přepnutí okna na použití kódu pokryjete definici okna kódu.

Přidání prvku uživatelského rozhraní do okna v kódu

Bez ohledu na to, zda bylo okno vytvořeno v kódu nebo načteno ze souboru. scénář nebo. xib, mohou nastat časy, kdy chceme přidat prvek uživatelského rozhraní do okna z kódu. Například:

var ClickMeButton = new NSButton (new CGRect (10, 10, 100, 30)){
    AutoresizingMask = NSViewResizingMask.MinYMargin
};
MyWindow.ContentView.AddSubview (ClickMeButton);

Výše uvedený kód vytvoří nový NSButton a přidá jej do MyWindow instance okna pro zobrazení. V podstatě jakýkoli prvek uživatelského rozhraní, který lze definovat v Interface Builder v souboru. ve scénáři nebo. xib, lze vytvořit v kódu a zobrazit v okně.

Definování řádku nabídek v kódu

Z důvodu současných omezení v Xamarin. Mac není doporučeno vytvořit panel nabídek aplikace Xamarin. Mac – NSMenuBar v kódu, ale nadále používat soubor NSMenuBar nebo MainMenu. xib k jeho definování. Tímto uvedením můžete přidat a odebrat nabídky a položky nabídky v kódu C#.

Například upravte soubor AppDelegate. cs a nastavte metodu tak, aby vypadala takto:

public override void DidFinishLaunching (NSNotification notification)
{
    mainWindowController = new MainWindowController ();
    mainWindowController.Window.MakeKeyAndOrderFront (this);

    // Create a Status Bar Menu
    NSStatusBar statusBar = NSStatusBar.SystemStatusBar;

    var item = statusBar.CreateStatusItem (NSStatusItemLength.Variable);
    item.Title = "Phrases";
    item.HighlightMode = true;
    item.Menu = new NSMenu ("Phrases");

    var address = new NSMenuItem ("Address");
    address.Activated += (sender, e) => {
        Console.WriteLine("Address Selected");
    };
    item.Menu.AddItem (address);

    var date = new NSMenuItem ("Date");
    date.Activated += (sender, e) => {
        Console.WriteLine("Date Selected");
    };
    item.Menu.AddItem (date);

    var greeting = new NSMenuItem ("Greeting");
    greeting.Activated += (sender, e) => {
        Console.WriteLine("Greetings Selected");
    };
    item.Menu.AddItem (greeting);

    var signature = new NSMenuItem ("Signature");
    signature.Activated += (sender, e) => {
        Console.WriteLine("Signature Selected");
    };
    item.Menu.AddItem (signature);
}

Výše uvedený příkaz vytvoří nabídku stavového řádku z kódu a zobrazí ji při spuštění aplikace. Další informace o práci s nabídkami najdete v dokumentaci k nabídkám .

Souhrn

V tomto článku se podrobně podíváme na vytvoření uživatelského rozhraní aplikace Xamarin. Mac v kódu jazyka C# na rozdíl od použití Interface Builder Xcode se soubory. scénář nebo. XIB.