✅ Monodevelop C # och GTK Behållare och komponenter

Innehållsförteckning

GTK # med hjälp av containrar gör att vi kan styra widgets position i ett fönster för att kunna skapa designen. Dessa behållare som har olika egenskaper och tjänar till att styra konstruktionen och placeringen av komponenterna eller widgeten i ett fönster.
De huvudbehållare är:

Behållare med horisontella eller vertikala lådor
Behållare med tabeller
Fast behållare
Ramar eller rambehållare

Hur man använder behållarna enligt behoven eller kraven i vår applikation
Behållare med horisontella eller vertikala lådor
Om vi är vana vid att programmera under Windows och dess drag-och-släpp-gränssnittsdesignmetodik är denna typ av behållare förmodligen bättre eftersom widgets eller komponenter placeras i fönstret med hjälp av x-koordinater, och hur i Windows och det uppskattas.
Även om detta är möjligt med Gtk och monodevelop, är det bästa sättet att justera widgetarna med rutorna. Det finns två typer av lådor horisontell eller HBox och vertikal eller VBox. Denna typ av behållare beror inte på skärmstorleken. HBox- och VBox -behållarna tar hand om den automatiska storleken på zonen som en komponent upptar.
Låt oss se ett exempel med horisontella eller vertikala rutor. Vi kommer att skapa ett C # och Gtk -projekt i Monodevelop.
Vi tilldelar den en Vbox -behållare och i den sista raden lägger vi till en Hbox -behållare.

Sedan lägger vi till en knapp i den sista cellen i Hbox. I egenskaperna tilldelar vi namnet bt Att acceptera och namnet på etiketten Att acceptera.

Om vi kör programmet från Kör -menyn> Starta felsökning eller med nyckeln F5, kommer vi att se att knappen är inriktad i det övre vänstra området på skärmen eftersom de andra cellerna är tomma därför visas de inte.

För att lösa detta kan vi använda Aligment -behållaren och lägga den på de tomma platserna för att behålla fönsterets design.

Vi kör programmet igen från menyn Kör> Starta felsökning eller med F5 -tangenten ser vi att knappen nu visas där vi satte in den och respekterar skärmlayouten. Nu kan vi fortsätta infoga andra widgets.

Låt oss lägga till några komponenter som Kalender i den centrala cellen i VBox och den Menyfältet i den övre cellen i Vbox, Resultatet är följande:

Behållare med tabeller
Denna typ av behållare är ett rutnät med rader och kolumner som kan vara användbart när vi behöver skapa ett rutnät där vi kan placera widgets, till exempel en datainmatningsskärm. Låt oss se ett exempel med en tabell. Vi kommer att skapa ett C # och Gtk -projekt i Monodevelop, vi kommer att skapa ett datainmatningsformulär.
Vi signerar en Vbox -behållare och i den sista raden lägger vi till en Hbox -behållare, som i det föregående projektet lägger vi till en menyrad och knapparna nedan, i mitten lägger vi till en bordsbehållare.

Standardbordbehållaren har 3 rader och 3 kolumner, nu lägger vi till widget med hänsyn till att varje cell i tabellen ändras till objektet den innehåller. För att lägga till eller ta bort rader eller kolumner högerklickar vi på raden och sedan går vi till alternativtabellen för att radera eller infoga rader eller kolumner.
Låt oss ta bort den sista raden och sedan i den första cellen i den första raden kommer vi att lägga till en Vox -behållare för etiketterna. Sedan i den andra cellen i den första raden kommer vi att lägga till en Vox -behållare för posten eller textrutor.

Vi kan definiera egenskaperna för varje kontroll för att bättre placera den. När det gäller etiketter måste egenskapen justeras Stoppning för att justera det till textrutornas nivå, räcker det med en stoppning på 5 pixlar i varje etikett.

Vi kommer att lägga till de nödvändiga komponenterna för att registrera och visa användarens foto, för dem i den första Vboxen, genom att högerklicka på cellen på telefonetiketten kan vi infoga en cell i vboxen, vi kommer också att lägga till en cell i annan vbox.
Nu lägger vi till en etikett Foto och en widget Filväljare Knapp för att välja filen, även i den tredje raden i tabellen kommer vi att lägga till en bildwidget som kommer att vara den som ska visa fotot, vi måste ta hänsyn till att bilden finns i programmets sammanställningskatalog i det här fallet Felsöka som genereras automatiskt vid körning. Den valda bilden är 100px hög med 100px bred.

Fast behållare
Fasta behållare gör att vi kan dra och släppa widgeten i fasta positioner och med fasta storlekar. Den här behållaren utför ingen automatisk layouthantering, inte heller ändrar storlek på widgetarna. De används i vissa applikationer där widgets behövs som senare kommer att hanteras med kod som spel, specialiserade applikationer som fungerar med diagram eller grafik som OpenGL eller 3D.
Låt oss se ett exempel där vi kommer att sätta en fast behållare och flera bilder.

Vi har lagt en bildwidget i bakgrunden, en annan bildwidget i bakgrunden med ett flygplan och en annan bildwidget i bakgrunden med en bild av en golfare. Varje bild är i en fast koordinat som vi sedan kan hantera koordinaterna med kod för att uppnå effekten av rörelse eller animering om det var ett spel.
Ramar eller rambehållare
Ramar eller ramar som i Visual Studio Groupbox -kontrollen används, de används för att innehålla en grupp widget inuti. Syftet med en ram är att definiera gruppwidget efter kategorier eller relaterade sektioner, eventuellt kan den ha en titel. Titelns position och rutans stil konfigureras utifrån egenskaperna.
Titeln på titeln visas i ramens övre vänstra hörn. Om ingen titel sätts in kommer den att vara tom och titeln kommer inte att visas. Etiketttexten kan ändras med Märk egendom.
I en Ram du kan kombinera någon av ovanstående behållare och vice versa.
Låt oss skapa en skärm Mästare / detalj, med ramar. Vi kommer att skapa en C # och Gtk -projektet i Monodevelop och vi signerar en Vbox -behållare med 4 rader och första raden lägger vi till en Menyfältet,
På den andra raden lägger vi till en rambehållare, etikettens titel kommer att vara produkter och vi tilldelar den en skuggad kanttyp IN.

Inuti ramen lägger vi till en tabellbehållare med 4 rader och 3 kolumner för att skapa ett datainmatningsformulär och i den sista centrala raden i tabellen lägger vi en Hbox med två rutor för knapparna Gravera Y Annullera.
I den tredje raden i Vbox sätter vi en separatorfält med widgeten Horizontal Separator och i den sista raden i Vbox kommer vi att lägga en annan ram och en Treeview.

Kom ihåg att för att allt ska vara korrekt anpassat måste vi röra vadderingsegenskapen för varje widget. För att fylla Treeview som vi kommer att kalla tvwlista kommer vi att använda c # -kod i Mainwindows -klassen som kommer att vara följande:

 public MainWindow (): base (Gtk.WindowType.Toplevel) {Build (); // Jag skapar kolumnerna och rubrikerna i trädvyn // Jag skapar produktkolumnen Gtk.TreeViewColumn Produktkol = ny Gtk.TreeViewColumn (); colProducto.Title = "Produkt"; // Jag skapar lagerkolumnen Gtk.TreeViewColumn colStock = ny Gtk.TreeViewColumn (); colStock.Title = "Lager"; // Jag skapar priskolumnen Gtk.TreeViewColumn pricecol = ny Gtk.TreeViewColumn (); colPrice.Title = "Pris"; // Jag lägger till kolumnerna och rubricerar dem i treeview tvwlista.AppendColumn (colProduct); tvwlista.AppendColumn (colStock); tvwlista.AppendColumn (pricecol); // Jag skapar en datamodell att lagra och där jag lägger till tre data av typtexten Gtk.ListStore store = new Gtk.ListStore (typeof (string), typeof (string), typeof (string)); // Jag tilldelar modellen till TreeView tvwlista.Model = store; // Jag lägger till data i modellbutiken.AppendValues ("TABLET SAMSUNG", "5", "175"); store.AppendValues ("MACBOOK PRO", "10", "2680"); store.AppendValues ("SEGATE DISK 1 TB", "10", "85"); // Vi skapar en cell som visar produkten Gtk.CellRendererText productCell = ny Gtk.CellRendererText (); // Vi lägger till produktdatacellen colProduct.PackStart (productCell, true); // Lägg till lagerdatacellen Gtk.CellRendererText cellStock = ny Gtk.CellRendererText (); colStock.PackStart (cellStock, true); // Lägg till prisdatacellen Gtk.CellRendererText PriceCell = ny Gtk.CellRendererText (); pricecol.PackStart (priceCell, true); // Vi lägger till datacellerna i varje kolumn och raderna genereras // colProducto.AddAttribute (cellProducto, "text", 0); colStock.AddAttribute (cellStock, "text", 1); priceCol.AddAttribute (priceCell, "text", 2); }

Nästa kör vi och resultatet blir följande: