Starling Framework

Starling supports high-dpi devices (like 4K monitors). To enable this, you must perform two steps: one in your project configuration and one in your application code.

1. In your _project.xml file, add the allow-high-dpi attribute to the <window> tag:

<window allow-high-dpi="true"/>

2. In your Haxe code, set the supportHighResolutions flag on the starling object:

<window allow-high-dpi="true"/>

starling.supportHighResolutions = true;

The Field Agent is a Ruby script that uses ImageMagick to convert graphics into distance field textures. This allows graphics to be scaled to any size while remaining crisp.

To use it, you must have both Ruby and ImageMagick installed on your system.

macOS Setup

MacOS includes Ruby by default. Install ImageMagick using Homebrew:

brew install imagemagick

To call the script directly without prefixing it with ruby, make it executable:

cd /path/to/starling/util/field_agent
chmod u+x field_agent.rb

Windows Setup

Install both Ruby and ImageMagick using a package manager like Chocolatey via cmd.exe:

choco install ruby
choco install imagemagick

Alternatively, it works with Cygwin.

For TypeScript, JavaScript, or AS3 (via Apache Royale), use the Yeoman generator to scaffold a project.

1. Install the Yeoman generator globally:

npm install -g yo generator-starling-framework

2. Create and initialize your project:

mkdir StarlingProject
cd StarlingProject
yo starling-framework

Alternatively, you can run the NPM-based TypeScript demo:

git clone https://github.com/openfl/starling
cd starling/samples/demo_npm/typescript
npm install
npm start -s

You can scaffold a new empty Starling project or run the official demo project using the OpenFL CLI.

To create a new empty project named StarlingProject:

openfl create starling:project StarlingProject

To run the Starling demo project:

openfl create starling:demo
cd demo
openfl test html5

To use Starling in a Haxe environment, first ensure you have the Haxe toolkit installed. You can then install the Starling library using the Haxelib command line tool.

To include Starling in an existing OpenFL project, add the following line to your _project.xml file:

haxelib install starling

<haxelib name="starling" />

Once you have generated a distance field texture using the Field Agent, follow these steps in Starling:

1. Load the distance field texture as a standard texture.
2. Assign the texture to an Image or any other type of Mesh.
3. Set the style property of that object to an instance of DistanceFieldStyle to enable distance field rendering.

var image:Image = new Image(distanceFieldTexture);
image.style = new DistanceFieldStyle();

The following assets are used for platform-specific launch images and application icons:

Launch Images

• Default-Portrait.png: iPad
• Default.png: iPhone and iPhone Retina

Icons

• icon57.png: iPhone
• icon72.png: iPad
• icon114.png: iPhone Retina
• icon144.png: iPad Retina

AIR Startup Images

These images are displayed while AIR is ready but Starling is still loading:

• startup.jpg: iPhone
• startupHD.jpg: iPhone Retina and iPad

### Launch Images:
* Default-Portrait.png -> iPad
* Default.png -> iPhone
* Default.png -> iPhone Retina

### Icons:
* icon57.png -> iPhone
* icon72.png -> iPad
* icon114.png -> iPhone Retina
* icon144.png -> iPad Retina

### AIR Startup images:
* startup.jpg -> iPhone
* startupHD.jpg -> iPhone Retina, iPad

The Starling rendering module provides the core interfaces for interacting with Stage3D, including batching, shader programs, and vertex data management. The following classes are the primary entry points for rendering operations:

• Batching: Use BatchProcessor and BatchToken to manage batched draw calls.
• Shaders & Programs: Use Program to define shader logic and RenderState to manage the GPU state.
• Vertex Data: Use VertexData, VertexDataAttribute, and VertexDataFormat to define and upload geometry to the GPU.
• Effects: Use Effect, FilterEffect, and MeshEffect for post-processing or specialized rendering effects.
• Drawing: Use Painter for high-level drawing commands.

const rendering = require('starling-framework/rendering');

// Example of accessing the exported modules
const { BatchProcessor, Program, VertexData } = rendering;

The Starling Display List API provides the core classes for managing visual elements and their hierarchy. The primary building blocks include DisplayObject (the base class), DisplayObjectContainer (for grouping objects), and Sprite (for textured images). For advanced rendering, you can use Mesh for custom geometry, MeshBatch for optimized batch rendering, and Canvas for drawing operations. The Stage serves as the root of the display tree.

// Example of importing core display elements
const { Sprite, DisplayObjectContainer, Stage } = require("starling/display");

const stage = new Stage();
const container = new DisplayObjectContainer();
const sprite = new Sprite();

container.addChild(sprite);
stage.addChild(container);