# NineSlice

## Introduction

NineSlice is a standard component which can be used to create visual objects which can stretch to any size without creating distortion on the source image. For example, consider the following image:

![](/files/-Mb9SlATZZjo8Dzwzr4c)

This image could be used to create nine slices of various sizes without any distortion:

![](/files/-Mb9SlAUEJJ-hMf-pKsy)

The NineSlice achieves this effect by splitting the texture into nine pieces, and scales each one differently to prevent distortion. Highlighting a nine slice shows how it is split:

![](/files/7DtZ2tqPZh4A8betAGah)

This is achieved by splitting the texture into 1/3 sections wide and tall. The following image shows how the original image will be split:

![](/files/-Mb9SlAWHYemOmF3H07W)

## NineSlice Texture

The simplest way to assign a texture to a NineSlice is to use a single file. Setting the *SourceFile* to a single PNG will result in the NineSlice using that one texture, where each section of the NineSlice displays 1/3 of the width of the file and 1/3 of the height of the file.

A NineSlice's **Texture Address** property can be used to change the portion of the source texture that it uses. More info can be found in the Texture Address subpage.

Alternatively, nine files can be used to specify each section of the NineSlice independently. To use nine individual files, each file must be given a specific suffix.

The following suffixes can be added to create nine slice graphics. For example, assuming your NineSlice image is called "Image" and you are using the .png file format:

* Image\_BottomCenter.png
* Image\_BottomLeft.png
* Image\_BottomRight.png
* Image\_Center.png
* Image\_Left.png
* Image\_Right.png
* Image\_TopCenter.png
* Image\_TopLeft.png
* Image\_TopRight.png


---

# 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/gum-elements/nineslice.md?ask=<question>
```

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.