UI och Canvas*

Canvas

Canvas betyder mÄlarduk, och det Àr Canvas-objektet som samlar alla UI-element nÀr man anvÀnder Unitys vanliga system för att skapa grÀnssnitt. Genom att lÀgga in bilder, knappar och andra element i Canvasen sÄ blir de spelets grÀnssnitt.

Canvas screen space

Canvas-objektet har samma proportioner som spelfönstret, och oavsett objektets storlek sÄ projiceras objektet som helhet ovanpÄ spelkamerans vy nÀr man spelar spelet. Canvasen skalas alltsÄ sÄ att dess kanter lÀggs precis pÄ kamerans kanter.

NÀr man normalt skapar en Canvas sÄ Àr denna jÀttestor i scenvyn. Det beror pÄ att den har Render Mode Screen Space: Overlay. DÄ Àr canvasobjektets storlek frikopplad frÄn kamerans storlek i scene view, vilket fungerar ganska bra för 3D-spel.

För 2D-spel, framför allt sÄdana som bara har en kamera, passar det ofta bÀttre att anvÀnda Screen Space: Camera som Render Mode. Det stÀlls in i Canvas-komponenten. DÄ behöver man ocksÄ ange vilken kamera canvasen ska anpassa sig efter.

Rect transform

En rect transform har fler delar Àn en vanlig transform.

  • Anchor avgör hur ett UI-objekt ska positioneras. Anchor har Min X/Y och Max X/Y. Alla fĂ„r frĂ„n 0 till 1, dĂ€r 0 Ă€r lĂ€ngst ner till vĂ€nster och 1 Ă€r högst upp till höger. Detta Ă€r relativt objektet som rect transformens objekt befinner sig i, sĂ„ ett objekt som ligger i canvasen anvĂ€nder canvasen som utgĂ„ngspunkt.

    • Min Y och Max Y Ă€r likadana: anvĂ€nd Pos Y och Height pĂ„ Y-led.

      • Pos Y bestĂ€mmer hur lĂ„ngt frĂ„n Min/Max Y som objektet befinner sig.

      • Height bestĂ€mmer höjden pĂ„ objektet.

    • Min Y och Max Y Ă€r olika: anvĂ€nd Top och Bottom pĂ„ Y-led.

      • Top bestĂ€mmer hur lĂ„ngt frĂ„n Min Y som objektets övre del Ă€r.

      • Bottom bestĂ€mmer hur lĂ„ngt frĂ„n Max Y som objektets nedre del Ă€r.

    • Min X och Max X fungerar pĂ„ samma sĂ€tt.

      • De Ă€r olika: anvĂ€nd Pos X och Width.

      • De Ă€r lika: anvĂ€nd Left och Right.

  • Pivot avgör var pĂ„ objektet dess koordinater ska rĂ€knas frĂ„n. Det gĂ€ller framför allt om Pos X eller Pos Y ska anvĂ€ndas. Pivot X 0 och Y 0 innebĂ€r att det Ă€r objektets nedre vĂ€nstra hörn man bestĂ€mmer position för. X 1 och Y 1 innebĂ€r att det Ă€r objektets övre högra hörn man bestĂ€mmer position för.

NÄgra exempel pÄ hur man uppnÄr olika saker med ovanstÄende system:

  • Objektet Ă€r lika stort som skĂ€rmen

    • Anchor Min X/Y 0, Max X/Y 1

    • Left/Right/Top/Bottom 0

  • Objektet upptar hela vĂ€nsterkanten och Ă€r 300 pixlar brett

    • Anchor Min Y 0, Max Y 1

    • Anchor Min/Max X 0

    • Top/Bottom/Pos X 0

    • Width 300

  • Objektet ligger i mitten lĂ€ngst ner pĂ„ skĂ€rmen och Ă€r 500 pixlar brett och 100 högt

    • Anchor Min/Max X 0.5

    • Anchor Min/Max Y 0

    • Width 300, Height 100

GenvÀgar

LÀngst upp till vÀnster i Rect Transform finns en grafisk ruta. Klickar pÄ den fr man fram ett rutnÀt med 4x4 rutor och tillhörande rad- och kolumnrubriker.

Knappar

(Kommer
)

Events

(Kommer
)

PreviousRaycasting*NextImportera grafik*

Last updated