# 3 - Files ## Introduction Gum supports loading image files for Sprites and NineSlices. This tutorial discusses how to load files, and how they are referenced in Gum. ## Setting up a workspace First we'll set up a workspace: 1. Create a Screen called SpriteScreen. 2. Drag+drop a Sprite into the newly-created Screen

## Setting the Sprite Source File The `Source File` property is the image that the Sprite displays. Usually `Source Files` are of the .png file format. To set the source file: 1. Select SpriteInstance 2. Find `Source File` in the Variables tab 3. Click the "..." button to bring up a file window 4. Navigate to the location of the file you would like to load 5. Click "Open" in the file window 6. Once `Source File` is set, the Sprite displays the image in the Editor tab ![SpriteInstance displaying a bear Source File](https://2695663588-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-M_fzQmxQ1VeUFHcoo2c%2Fuploads%2Fgit-blob-a3739f985f42af14f469f3757bd7c7e169e469d8%2F14_05%2046%2012.png?alt=media) If you select a file which is not located in the same folder or a sub folder of your gum project, Gum asks if you would like to reference the file in its original location or create a copy.

Gum asks to copy files if they are outside of the project directory

Usually it's best to copy the file to the Gum project folder so that the Gum project can be moved to different computers without breaking file references. ## Texture Coordinates Sprites can display portions of their `Source File`. Files which combine multiple images are often called *sprite sheets* or *tile sheets*, and are commonly used in game development to keep art organized and to improve performance. For example, the following file contains images for an animated character, ground tiles, and other entities for a platformer game. {% embed url="" %} If we download this file and set it as our , then the sprite displays the entire file.

We can display a portion of the Sprite rather than the entire file: 1. Click on the Texture Coordinates tab 2. Check the **Snap to grid** option to make it easier to select a region 3. Double-click anywhere on the image to select a region around the cursor 4. Move the selected region to the desired location to adjust the sprite's texture coordinate values

Texture coordinate values can be adjusted in the Texture Coordinates tab

--- # Agent Instructions: Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter: ``` GET https://docs.flatredball.com/gum/gum-tool/tutorials-and-examples/intro-tutorials/files.md?ask= ``` The question should be specific, self-contained, and written in natural language. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.