Image Gradient Component

Add the Image Gradient component to generate a gradient from an image. The component provides advanced configuration options, such as tiling, scaling, and custom sampling types. Image creation and editing are also supported.

Provider

Gradient Signal Gem

Dependencies

Gradient Transform Modifier

Image Gradient properties

Sampling types

There are several sampling types to choose from. Choosing the best sampling type for a specific need is generally a balance between performance and quality.

Sampling Type	Description	Performance Cost	Quality	Example
Point	Point sampling is the default and only samples a single point for each pixel of the source image. This will produce blocky artifacts if the image is sampled at a higher frequency than the number of pixels. Point sampling produces the best results when the pixel size exactly matches the sampling frequency.	1x	Poor
Bilinear	The Bilinear filter smooths out the image by requesting four points in a grid around a requested pixel and then performing interpolation between the points. Because this uses linear interpolation between 4 points, bilinear filtering can cause noticeable plus-shaped artifacts in the smoothed data. Bilinear sampling is the best general-purpose choice, as it balances performance and quality.	4x	Good
Bicubic	The Bicubic filter smooths out the image by requesting sixteen points in a grid around a requested pixel and then performing Catmull-Rom interpolation between the points. Because this uses non-linear interpolation, there are no noticeable plus-shaped artifacts in the smoothed data. Bicubic sampling is the best choice when quality is needed over performance.	16x	Great

Creating a new image

To create a new image, press the Create New Image… button. You will be prompted for an image width and height in pixels, then for a location to save the image. If the image is saved into a source asset directory that is used by the project, the Image Gradient will automatically populate the Image Asset field with the saved image.

Important:

The image name should end in _gsi (for example, image_gsi.tif). This will ensure that the image is processed by the Asset Processor as a Gradient Signal Image (gsi) asset which will leave the image data uncompressed.

Editing an image

To edit an existing image, press the Edit button on the Image Gradient component or select the Image Gradient component’s icon in the Component Switcher in the viewport. This will enter Paint Brush mode. Refer to the Paint Brush documentation for more details on how to use the Paint Brush.

After editing is complete, end the Paint Brush mode by pressing Esc, pressing the Done button on the Image Gradient component, or by selecting a different component’s icon in the Component Switcher in the viewport. At this point, the image changes will be saved, re-processed by the Asset Processor, and reloaded when processing is complete.

The Save Mode determines where the image will be saved.

ImageGradientRequestBus

Use the following request functions with the ImageGradientRequestBus EBus interface to communicate with Image Gradient components in your game.