\documentclass[10pt,a4paper]{article} % Packages \usepackage{fancyhdr} % For header and footer \usepackage{multicol} % Allows multicols in tables \usepackage{tabularx} % Intelligent column widths \usepackage{tabulary} % Used in header and footer \usepackage{hhline} % Border under tables \usepackage{graphicx} % For images \usepackage{xcolor} % For hex colours %\usepackage[utf8x]{inputenc} % For unicode character support \usepackage[T1]{fontenc} % Without this we get weird character replacements \usepackage{colortbl} % For coloured tables \usepackage{setspace} % For line height \usepackage{lastpage} % Needed for total page number \usepackage{seqsplit} % Splits long words. %\usepackage{opensans} % Can't make this work so far. Shame. Would be lovely. \usepackage[normalem]{ulem} % For underlining links % Most of the following are not required for the majority % of cheat sheets but are needed for some symbol support. \usepackage{amsmath} % Symbols \usepackage{MnSymbol} % Symbols \usepackage{wasysym} % Symbols %\usepackage[english,german,french,spanish,italian]{babel} % Languages % Document Info \author{Become A Game Developer (become)} \pdfinfo{ /Title (unity-2d-graphical-elements.pdf) /Creator (Cheatography) /Author (Become A Game Developer (become)) /Subject (Unity 2D Graphical Elements Cheat Sheet) } % Lengths and widths \addtolength{\textwidth}{6cm} \addtolength{\textheight}{-1cm} \addtolength{\hoffset}{-3cm} \addtolength{\voffset}{-2cm} \setlength{\tabcolsep}{0.2cm} % Space between columns \setlength{\headsep}{-12pt} % Reduce space between header and content \setlength{\headheight}{85pt} % If less, LaTeX automatically increases it \renewcommand{\footrulewidth}{0pt} % Remove footer line \renewcommand{\headrulewidth}{0pt} % Remove header line \renewcommand{\seqinsert}{\ifmmode\allowbreak\else\-\fi} % Hyphens in seqsplit % This two commands together give roughly % the right line height in the tables \renewcommand{\arraystretch}{1.3} \onehalfspacing % Commands \newcommand{\SetRowColor}[1]{\noalign{\gdef\RowColorName{#1}}\rowcolor{\RowColorName}} % Shortcut for row colour \newcommand{\mymulticolumn}[3]{\multicolumn{#1}{>{\columncolor{\RowColorName}}#2}{#3}} % For coloured multi-cols \newcolumntype{x}[1]{>{\raggedright}p{#1}} % New column types for ragged-right paragraph columns \newcommand{\tn}{\tabularnewline} % Required as custom column type in use % Font and Colours \definecolor{HeadBackground}{HTML}{333333} \definecolor{FootBackground}{HTML}{666666} \definecolor{TextColor}{HTML}{333333} \definecolor{DarkBackground}{HTML}{ABA61F} \definecolor{LightBackground}{HTML}{F9F9F1} \renewcommand{\familydefault}{\sfdefault} \color{TextColor} % Header and Footer \pagestyle{fancy} \fancyhead{} % Set header to blank \fancyfoot{} % Set footer to blank \fancyhead[L]{ \noindent \begin{multicols}{3} \begin{tabulary}{5.8cm}{C} \SetRowColor{DarkBackground} \vspace{-7pt} {\parbox{\dimexpr\textwidth-2\fboxsep\relax}{\noindent \hspace*{-6pt}\includegraphics[width=5.8cm]{/web/www.cheatography.com/public/images/cheatography_logo.pdf}} } \end{tabulary} \columnbreak \begin{tabulary}{11cm}{L} \vspace{-2pt}\large{\bf{\textcolor{DarkBackground}{\textrm{Unity 2D Graphical Elements Cheat Sheet}}}} \\ \normalsize{by \textcolor{DarkBackground}{Become A Game Developer (become)} via \textcolor{DarkBackground}{\uline{cheatography.com/67591/cs/17128/}}} \end{tabulary} \end{multicols}} \fancyfoot[L]{ \footnotesize \noindent \begin{multicols}{3} \begin{tabulary}{5.8cm}{LL} \SetRowColor{FootBackground} \mymulticolumn{2}{p{5.377cm}}{\bf\textcolor{white}{Cheatographer}} \\ \vspace{-2pt}Become A Game Developer (become) \\ \uline{cheatography.com/become} \\ \uline{\seqsplit{becomeagamedeveloper}.github.io/site} \end{tabulary} \vfill \columnbreak \begin{tabulary}{5.8cm}{L} \SetRowColor{FootBackground} \mymulticolumn{1}{p{5.377cm}}{\bf\textcolor{white}{Cheat Sheet}} \\ \vspace{-2pt}Published 20th September, 2018.\\ Updated 20th September, 2018.\\ Page {\thepage} of \pageref{LastPage}. \end{tabulary} \vfill \columnbreak \begin{tabulary}{5.8cm}{L} \SetRowColor{FootBackground} \mymulticolumn{1}{p{5.377cm}}{\bf\textcolor{white}{Sponsor}} \\ \SetRowColor{white} \vspace{-5pt} %\includegraphics[width=48px,height=48px]{dave.jpeg} Measure your website readability!\\ www.readability-score.com \end{tabulary} \end{multicols}} \begin{document} \raggedright \raggedcolumns % Set font size to small. Switch to any value % from this page to resize cheat sheet text: % www.emerson.emory.edu/services/latex/latex_169.html \footnotesize % Small font. \begin{multicols*}{3} \begin{tabularx}{5.377cm}{x{1.34379 cm} x{3.63321 cm} } \SetRowColor{DarkBackground} \mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Assets}} \tn % Row 0 \SetRowColor{LightBackground} Assets & Resources you can use in your game. Images (bmp, tif, tga, jpg, psd), models (fbx, max, blend, mb, ma), meshes, audio \tn % Row Count 5 (+ 5) % Row 1 \SetRowColor{white} Standard assets & Basic assets that either ship with Unity installation or can be downloaded from the Asset Store \tn % Row Count 9 (+ 4) % Row 2 \SetRowColor{LightBackground} Asset Store & Library of free and paid downloadable assets (textures, models, animations, project examples, editor extensions, tutorials). Access from the editor: Window \textgreater{} General \textgreater{} Asset Store \tn % Row Count 16 (+ 7) % Row 3 \SetRowColor{white} Asset package & Archive of assets that can be imported in your project. Can be standard (supplied with Unity) or custom (made by users) \tn % Row Count 21 (+ 5) % Row 4 \SetRowColor{LightBackground} Import packages & From the editor: Assets \textgreater{} Import Package \tn % Row Count 23 (+ 2) % Row 5 \SetRowColor{white} Import assets & Right click on the Project view \textgreater{} Import New Asset. Or drag the asset (for example, an image) from the computer to Project \tn % Row Count 28 (+ 5) % Row 6 \SetRowColor{LightBackground} Inspect assets & Click on the asset in the Project view \textgreater{} the Inspector will show its properties \tn % Row Count 31 (+ 3) \hhline{>{\arrayrulecolor{DarkBackground}}--} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{x{1.84149 cm} x{3.13551 cm} } \SetRowColor{DarkBackground} \mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Sprites}} \tn % Row 0 \SetRowColor{LightBackground} Sprite & 2D graphics object \tn % Row Count 1 (+ 1) % Row 1 \SetRowColor{white} Sprite Asset & Image imported as asset, with Texture Mode (in the Inspector) set to "Sprite (2D and UI)" \tn % Row Count 5 (+ 4) % Row 2 \SetRowColor{LightBackground} Importing Sprite Assets & In a 2D project, importing an image as asset automatically imports that as a Sprite Asset \tn % Row Count 9 (+ 4) % Row 3 \SetRowColor{white} Texture modes & Inspect an image asset to change its Texture Mode. "Sprite (2D and UI)" is the default mode for images in 2D projects. "Texture" is the default for images in 3D projects. "Texture" assets are meant to be drawn on 3D models, "Sprite"s are meant to be standalone 2D images \tn % Row Count 20 (+ 11) % Row 4 \SetRowColor{LightBackground} Spritesheet & Image file containing severa sub-images on a transparent background. Ex: image containing all frames for a 2D animation. When importing a spritesheet as an asset, set (in the Inspector) Sprite Mode to "Multiple" \tn % Row Count 29 (+ 9) % Row 5 \SetRowColor{white} Sprite Tools & 1) Creator (creates placeholder sprites)\{\{nl\}\}2) Editor (extracts sprites from spritesheets)\{\{nl\}\}3) Renderer (Component that displays images)\{\{nl\}\}4) Packer (to optimize video memory performance) \tn % Row Count 37 (+ 8) \end{tabularx} \par\addvspace{1.3em} \vfill \columnbreak \begin{tabularx}{5.377cm}{x{1.84149 cm} x{3.13551 cm} } \SetRowColor{DarkBackground} \mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Sprites (cont)}} \tn % Row 6 \SetRowColor{LightBackground} Sprite Creator & From the editor: Assets \textgreater{} Sprites. It allows to create polygon Sprite Assets that you can use as placeholders in the SpriteRenderers in your Game Objects \tn % Row Count 7 (+ 7) % Row 7 \SetRowColor{white} Sprite Editor & Select the Sprite Asset \textgreater{} click Sprite Editor in the Inspector. Allows the extraction of single sprites from spritesheets (be sure to set the Sprite Mode of your asset to "Multiple" before). In the editor you can access the Slice menu at the top left, which allows you to separate the images automatically. Unity will draw a crop rectangle outside each image. You can select them to tweak properties and to set the name with which that Sprite will be exported. Click Apply to confirm, Revert to discard. You can also use the Sprite Editor to change polygons (placeholder sprites) \tn % Row Count 31 (+ 24) \hhline{>{\arrayrulecolor{DarkBackground}}--} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{break}} \tn % Row 0 \SetRowColor{LightBackground} \mymulticolumn{1}{x{5.377cm}}{} \tn % Row Count 0 (+ 0) \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{x{2.4885 cm} x{2.4885 cm} } \SetRowColor{DarkBackground} \mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{UI}} \tn % Row 0 \SetRowColor{LightBackground} UI Element & Graphical User Interface element (text labels, buttons, on-screen sprites, health bars, ammo count, sealthometers, etc). Represented by Game Objects with particular kinds of Components \tn % Row Count 10 (+ 10) % Row 1 \SetRowColor{white} Canvas & Game Object with a Canvas component. All UI Elements should be children of it. Shown as a rectangle in the Scene. Double click on it in the Hierarchy to focus the Scene on it \tn % Row Count 19 (+ 9) % Row 2 \SetRowColor{LightBackground} Create UI Element & From editor: Game Object \textgreater{} UI \textgreater{} (choose the one you want). Or from the Hierarchy: Right click \textgreater{} UI \textgreater{} (choose one). If a Canvas is not present, it will be automatically created, and the UI Game Object will be added as a child \tn % Row Count 31 (+ 12) \end{tabularx} \par\addvspace{1.3em} \vfill \columnbreak \begin{tabularx}{5.377cm}{x{2.4885 cm} x{2.4885 cm} } \SetRowColor{DarkBackground} \mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{UI (cont)}} \tn % Row 3 \SetRowColor{LightBackground} Draw order & Elements on Canvas are drawn in the same order in which they appear in the Hierarchy \tn % Row Count 5 (+ 5) % Row 4 \SetRowColor{white} Rect Tool & Tool in the editor toolbar used to manipulate the size of UI Elements (all being represented as rectangles) \tn % Row Count 11 (+ 6) % Row 5 \SetRowColor{LightBackground} RectTransform & Component used for UI Elements in place of the Transform, to set position, rotation, scale, width \& height of the rectangle, Pivot, Anchor \tn % Row Count 18 (+ 7) % Row 6 \SetRowColor{white} Pivot & Point around which rotations and scaling occur. Shown as a blue ring. It can be moved with the mouse if the editor's toolbar pivot button is set to "Pivot" mode. Or it can be set when choosing the Anchor preset from the RectTransform by keeping SHIFT presesd \tn % Row Count 31 (+ 13) \end{tabularx} \par\addvspace{1.3em} \vfill \columnbreak \begin{tabularx}{5.377cm}{x{2.4885 cm} x{2.4885 cm} } \SetRowColor{DarkBackground} \mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{UI (cont)}} \tn % Row 7 \SetRowColor{LightBackground} Anchor & Shown as 4 small triangular handles. It represents the point (of this element's parent UI Element) to which this element is anchored: if that point moves (when modifying the parent's RectTransform) this element (child) will move accordingly. Can be set by choosing an Anchor preset from the RectTransform. You can also set the 4 triangles apart. This will make the child stretch when the parent is resized \tn % Row Count 21 (+ 21) % Row 8 \SetRowColor{white} \mymulticolumn{2}{x{5.377cm}}{{\bf{UI Visual Components}}} \tn % Row Count 22 (+ 1) % Row 9 \SetRowColor{LightBackground} Text & Label displaying some text \tn % Row Count 24 (+ 2) % Row 10 \SetRowColor{white} Image & Displays a Sprite Asset. You can change colors and Image Type (how the Sprite will appear inside the UI Rectangle) \tn % Row Count 30 (+ 6) \end{tabularx} \par\addvspace{1.3em} \vfill \columnbreak \begin{tabularx}{5.377cm}{x{2.4885 cm} x{2.4885 cm} } \SetRowColor{DarkBackground} \mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{UI (cont)}} \tn % Row 11 \SetRowColor{LightBackground} Rect Mask 2D & Restricts the children elements to the shape of this element (parent) \tn % Row Count 4 (+ 4) % Row 12 \SetRowColor{white} \mymulticolumn{2}{x{5.377cm}}{{\bf{API}}} \tn % Row Count 5 (+ 1) % Row 13 \SetRowColor{LightBackground} Reference UI Components & UI Components are exactly like other Components. For each of them, there exists a class with the same name, that you can use as a type to store a reference to the Component in Scripts.\{\{nl\}\}Ex: `public Text myLabel;` \tn % Row Count 16 (+ 11) % Row 14 \SetRowColor{white} `{\emph{myLabel}}.text = \_cur + " / " + \_max + " HP";` & Access the `text` member to change a label's text. You can set it to any string. You can concatenate strings and values using `+` \tn % Row Count 23 (+ 7) \hhline{>{\arrayrulecolor{DarkBackground}}--} \SetRowColor{LightBackground} \mymulticolumn{2}{x{5.377cm}}{UI manual: \seqsplit{https://docs.unity3d.com/Manual/UISystem.html}} \tn \hhline{>{\arrayrulecolor{DarkBackground}}--} \end{tabularx} \par\addvspace{1.3em} % That's all folks \end{multicols*} \end{document}