> For the complete documentation index, see [llms.txt](https://smartui-docs.pixelperfectstudio.mx/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://smartui-docs.pixelperfectstudio.mx/framework-addons/discrete-progress.md).

# Discrete Progress

SmartUI Discrete-Progress Behavior operation and ACEs.

<img src="https://3242409510-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F9bZkqK9vYvPkvVDUO4Tp%2Fuploads%2FsndvYxect4XSViFLGCmB%2Ficon.svg?alt=media&amp;token=4de4fc52-0730-432e-8dd4-575f3ec08dd9" alt="" data-size="line"> Discrete Progress allows you to represent an integer value by distributing it among several parts of a [Sprite](https://www.construct.net/en/make-games/manuals/construct-3/plugin-reference/sprite) plugin. This behavior is totally unusable on a different world object, since it relies on Sprite's animations to render properly.&#x20;

Similarly to [radio-buttons](/framework-addons/radio-buttons.md), it operates within the same context, whether it's the global container or lower-level containers created in the scene. Group all the Discrete Progress parts inside a container by adding them as children of the container. SmartUI will automatically determine the group they belong to.

{% hint style="info" %}
Discrete-Progress uses the [document flow](/getting-started/quickstart/document-flow.md) together with the *<mark style="color:green;">**Part Sequence**</mark>* property to determine the order in which the parts will be filled.
{% endhint %}

All parts with the same part-sequence have the same priority for access by the framework. At this point, the document flow determines which part is processed first.

The Discrete Progress behavior iterates over an array of animations for the sprite to assign the active animation. Each part or sprite in the group can have a different number of subdivisions to represent the value. For instance, you can combine life hearts with pie or pizza slices to represent the value.

In this example, the number 9 is distributed among the different parts of the Discrete Progress group.

<figure><img src="https://3242409510-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F9bZkqK9vYvPkvVDUO4Tp%2Fuploads%2FI7N3BCkI4u8Welb24OI7%2Fimage.png?alt=media&amp;token=9a43850e-2a0b-423b-85bb-b1ef6a6d91a7" alt="" width="329"><figcaption><p>Number 9 represented with Discrete-Part instances.</p></figcaption></figure>

The hearts have 2 parts, and the pie has 6 parts. The value is distributed across all the available sprites.

A key attribute for this behavior is the animations, which require an ordered list of the animation names, separated by commas. Animation names are case-sensitive and must exactly match the names in your Sprite.

<figure><img src="https://3242409510-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F9bZkqK9vYvPkvVDUO4Tp%2Fuploads%2FHHOuLsQf96h8c31OW2Ad%2Fimage.png?alt=media&amp;token=c8b273d6-5d7c-4d0b-85d8-d3fbe3bac2a1" alt=""><figcaption><p>3 animations are available for the hearth.</p></figcaption></figure>

As you can imagine, the order to represent a value from 0 to 2 in above images is:

1. <mark style="color:green;">**empty**</mark> animation is for Zero
2. <mark style="color:green;">**half**</mark> animation is for 1.
3. <mark style="color:green;">**full**</mark> animation is for 2.

<details>

<summary>Download</summary>

<https://store.pixelperfectstudio.mx/product/smart-ui-ncbeta/>

</details>

## Properties

<table data-header-hidden><thead><tr><th width="229"></th><th></th></tr></thead><tbody><tr><td><strong>Property</strong></td><td><strong>Description</strong></td></tr><tr><td><code>Enabled</code></td><td>Enables or Disables the Discrete Progress Part. Value can still be set by calling the SetPartValue action from the SmartUI plugin.</td></tr><tr><td><code>Name</code></td><td>Unique name string for identifying the component</td></tr><tr><td><code>Part Sequence</code></td><td>Part sequence to be considered when setting the value of the Discrete Parts.</td></tr><tr><td><code>Max.Parts</code></td><td>Maximum parts to handle.</td></tr><tr><td><code>Animations</code></td><td>Sequence of animations separated by colon. Animations are set whenever the value changes. E.g.: animation1,animation2,animation3</td></tr></tbody></table>

## :tv: Basic Setup - Tutorial Video

{% embed url="<https://youtu.be/9FdGxo0W268>" %}

## <img src="https://3242409510-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F9bZkqK9vYvPkvVDUO4Tp%2Fuploads%2FsndvYxect4XSViFLGCmB%2Ficon.svg?alt=media&amp;token=4de4fc52-0730-432e-8dd4-575f3ec08dd9" alt="" data-size="line"> Smart UI Discrete Progress

Smart UI Discrete Progress Part behavior handles progress parts UI components. If you use it as part of a hierarcy, you must add it to an object using a Smart UI Container behavior to be rendered correctly, since it will use its parent to determine the total Discrete Progress Part components available to alter.&#x20;

## Actions

***

### `Set Enabled`

Disable/Enable the Component

| **Parameter** | **Description**  |
| ------------- | ---------------- |
| `Enabled`     | Enabled/Disabled |

### `Set Group Value`

Sets the value to be distributed among the parts of the same group. The group is determined by the container to which the parts belong.

| **Parameter** | **Description**          |
| ------------- | ------------------------ |
| `Value`       | Value to be distributed. |

### `Set Max Parts`

Sets the maximum parts for this component.

| **Parameter** | **Description**                          |
| ------------- | ---------------------------------------- |
| `Value`       | Maximum parts number for this component. |

### `Set Name`

Sets the name of the component.

| **Parameter** | **Description**       |
| ------------- | --------------------- |
| `Name`        | Name of the component |

### `Set Part Sequence`

Sets the parts sequence index for this component.

| **Parameter** | **Description**              |
| ------------- | ---------------------------- |
| `Sequence`    | Index to priorize each part. |

## Conditions

***

### `Compare Value`

Compares the value of the part.

| **Parameter** | **Description**               |
| ------------- | ----------------------------- |
| `Comparison`  | How to compare the variable   |
| `Value`       | Value to compare the variable |

### `Compare Name`

Returns true if the radio button components name equals the parameter

| **Parameter** | **Description**                            |
| ------------- | ------------------------------------------ |
| `Name`        | Name to compare with the component picked. |

### `Is Enabled`

Returns true if the component is enabled

### `On Value Change`

Triggered when the part value changes.

## Expressions

***

### `Name`

Component name

### `MaxParts`

Maximum parts for this component.

### `Value`

Part current value.

**(c) Pixel Perfect Studio 2024**
