# Adding Grid Area Disablers And Enablers

**Easy Grid Builder Pro 1** included the **Grid Area Blockers** component, which was used to block specific areas of the grid. This component is no longer available in **Easy Grid Builder Pro 2**.

In its place, we now have:

* [**Grid Area Disabler**](https://soulgamess-studio.gitbook.io/easy-grid-builder-pro-2-documentation/secondary-components/grid-area-disabler): Disables specific areas of the grid.
* [**Grid Area Enabler**](https://soulgamess-studio.gitbook.io/easy-grid-builder-pro-2-documentation/secondary-components/grid-area-enabler): Overrides disabled areas to enable specific grid sections.

Let’s dive into these components and see how to set them up in our simple **City Builder Scene**.

***

## <mark style="color:green;">Setting Up Grid Area Disablers</mark>

There are two components in **Easy Grid Builder Pro 2** for managing grid areas: **Grid Area Disabler** and **Basic Grid Area Disabler**.

* [**Basic Grid Area Disabler**](https://soulgamess-studio.gitbook.io/easy-grid-builder-pro-2-documentation/secondary-components/grid-area-disabler/basic-grid-area-disabler): Extremely fast but offers limited control.
* [**Grid Area Disabler**](https://soulgamess-studio.gitbook.io/easy-grid-builder-pro-2-documentation/secondary-components/grid-area-disabler): Provides more features and control.

In this tutorial, we will focus on the **Grid Area Disabler** component. For more information about both components, use the provided links.

* **Create a New GameObject**
  * In the scene, create a new empty GameObject and name it **Grid Area Disablers**.
* **Reset the Transform Values**
  * Select the **Transform** component, right-click, and choose **Reset** to set the position, rotation, and scale to **0, 0, 0**.
* **Add the Grid Area Disabler Component**
  * Add the **Grid Area Disabler** component to the GameObject. You can do this by:
    * Navigating to <mark style="color:purple;">**SoulGames > Easy Grid Builder Pro 2 > Scripts > Grid Area Controller Scripts > Grid Area Disabler**</mark><mark style="color:purple;">,</mark> or
    * Using <mark style="color:purple;">**Add Component > Easy Grid Builder Pro > Grid Utilities > Grid Area Disabler**</mark>.

<figure><img src="https://2651556506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FeumhICLT4oHoEIEssOjB%2Fuploads%2FXHidLQ9P5vMKHtdxFj7u%2Fimage.png?alt=media&#x26;token=fcca983b-12af-4da6-a070-d8d2a53cca08" alt=""><figcaption></figcaption></figure>

* **Create a Child GameObject**
  * Right-click on the **Grid Area Disablers** GameObject and select **Create Empty** to create an empty child GameObject.
  * Rename this new child GameObject to **Grid Area 01**.
* **Add the Grid Area Component**

  * Add the **Grid Area** component to **Grid Area 01**. You can find it in:\ <mark style="color:purple;">**SoulGames > Easy Grid Builder Pro 2 > Scripts > Grid Area Controller Scripts**</mark><mark style="color:purple;">,</mark>\
    or by selecting <mark style="color:purple;">**Add Component > Easy Grid Builder Pro > Grid Utilities > Grid Area**</mark><mark style="color:purple;">.</mark>

  The **Grid Area** component is used to target a specific area of the grid.
* **Update the Grid Area Properties**\
  Keep all the properties as default except for the following:

  * **Grid Axis**: Set to **XY**.
  * **Cell Size**: Set to **1**.
  * **Width**: Set to **5**.
  * **Length**: Set to **10**.

  You should now see a gizmo representing the grid area in your scene. If the gizmo is not visible, ensure **Gizmos** are enabled in the Scene view.
* **Offset the Grid Area**
  * In the **Transform** component of **Grid Area 01**, add **-10** to the **Position X** value to offset it to the left of the grid.

This setup defines a targeted grid area that can be disabled using the **Grid Area Disabler** component.

<figure><img src="https://2651556506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FeumhICLT4oHoEIEssOjB%2Fuploads%2FgP0HqEbfWqu2thdYN9hR%2Fimage.png?alt=media&#x26;token=72a9e0d5-10ae-4627-b056-223f00c4ca89" alt=""><figcaption></figcaption></figure>

* **Duplicate the GameObject**
  * Right-click on the **Grid Area 01** GameObject and select **Duplicate**.
  * Rename the duplicate to **Grid Area 02**.
* **Update Transform Position**
  * Change the **Transform Position X** value to **5.5**.
* **Adjust Grid Area Properties**
  * In the **Grid Area** component, update the following:
    * **Width**: Set to **10**.
    * **Grid Area Shape**: Change to **Circle**.
* **Define the Radius**

  * When the **Area Shape** is set to **Circle**, the **Radius** property must be defined. Increase the **Radius** property to **5** (or another value to fit your design).

  Once you set the **Radius**, the circular gizmo representing the grid area will reappear in the Scene view, showing the new circular grid cells.

<figure><img src="https://2651556506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FeumhICLT4oHoEIEssOjB%2Fuploads%2FzMzYWtDO23Boe4kuSOKK%2Fimage.png?alt=media&#x26;token=0a0f491e-6536-4b58-b640-c7c5515cd2da" alt=""><figcaption></figcaption></figure>

* **Add Grid Areas to the List**
  * Select the **Grid Area Disablers** parent GameObject.
  * Drag and drop **Grid Area 01** and **Grid Area 02** into the **Grid Area List** property of the **Grid Area Disabler** component.
* **Enable Block All Grid Object**
  * In the **Grid Area Disabler** component, enable the **Block All Grid Object** property to block the areas defined by the grid areas.
* **Enable and Configure Blocked Cell Color**
  * Scroll down in the **Grid Area Disabler** component and enable the **Change Blocked Cell Color** property.
  * Set the **Blocked Cell Color** property to an **orange** or **red** color.
  * Increase the **Alpha** value of the color (by default, it is set to **0**) to make the blocked areas visible on the grid.

This setup will visually highlight the blocked grid areas using the specified color, helping you clearly identify them in the Scene view.

<figure><img src="https://2651556506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FeumhICLT4oHoEIEssOjB%2Fuploads%2FoNBpYetB0r9VuAritCJa%2Fimage.png?alt=media&#x26;token=74a46ced-52ea-4f70-9836-4c2fbdf159b7" alt=""><figcaption></figcaption></figure>

Now, you can **enter Play Mode** to test the setup:

* **Enter Play Mode**
  * Click the **Play** button in Unity to start the scene.
* **Switch to Build Mode**
  * By default, the **Grid Mode** is set to **Default (None)**.
  * To enable **Build Mode**, click the **Build** button in the **Main UI Panel** (located at the bottom left of the screen), or press the **'R'** key on your keyboard.
* **Observe the Disabled Grid Areas**
  * Once in Build Mode, the grid and the areas disabled using the **Grid Area Disabler** component will become visible.
  * The blocked areas will appear with the color you configured (e.g., orange or red), clearly indicating the disabled regions of the grid.

<figure><img src="https://2651556506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FeumhICLT4oHoEIEssOjB%2Fuploads%2FAGNPF4NmQO0vpdLIKF4M%2Fimage.png?alt=media&#x26;token=ec90c5bc-86fc-4627-89e1-b7f1c2339396" alt=""><figcaption></figcaption></figure>

You can now start placing objects on the grid:

* **Select a Buildable Object**
  * Open the **Buildable Objects UI panel** on the right side of the screen.
  * Select a Buildable Object to place.
  * Use the **Q** and **E** keys, or the UI buttons, to rotate the selected object.
* **Place TopDown House 01**
  * As configured earlier, the **TopDown House 01 Buildable Grid Object** uses **Box Placement**.
  * Click the **Orange House Icon** to select **TopDown House 01**.
  * Click and hold on the grid, then drag the mouse to define an area for placing multiple objects.
  * Release the mouse to place the objects.
  * Notice that objects will not be placed in the orange-colored disabled grid areas defined by the **Grid Area Disabler** component.
* **Place TopDown Tree with Spline Placement**
  * Select the **Tree Buildable Object** from the UI panel.
  * Click on the grid to create the first knot of the spline.
  * Move the mouse and click again to create additional knots. Continue this process to add more knots as needed.
  * When ready to confirm and build, right-click to finalize the spline. The trees will spawn along the spline.
* **Placement Behavior in Disabled Areas**
  * You’ll notice that trees can still be placed in the disabled grid areas.
  * This is because only the **Block All Grid Objects** property was enabled in the **Grid Area Disabler** component.
  * If you want to prevent tree placement in disabled areas, enable the **Block All Free Objects** property in the **Grid Area Disabler** component.

<figure><img src="https://2651556506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FeumhICLT4oHoEIEssOjB%2Fuploads%2FZI2DrfPPCBdkNLlIU1Tp%2Fimage.png?alt=media&#x26;token=5078fee7-3147-4337-bad7-0219e59672a9" alt=""><figcaption></figcaption></figure>

As you might notice, there’s a big blue rectangular shape following the mouse pointer. This is the **Grid Cell Indicator**, and its size appears incorrect because the **Cell Size** value hasn’t been set properly. Let’s fix that.

<figure><img src="https://2651556506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FeumhICLT4oHoEIEssOjB%2Fuploads%2FwooPIpbDGZcdmQ22ZIrq%2Fimage.png?alt=media&#x26;token=0318f3eb-5577-4d02-93ed-d328c7b8428d" alt=""><figcaption></figcaption></figure>

* **Exit Play Mode**
  * Click the **Play** button to stop the scene.
* **Locate the Buildable Object Selector**
  * In the **Hierarchy**, navigate to the **Grid Managers** GameObject.
  * Select the **Buildable Object Selector** GameObject.
* **Disable the Grid Cell Indicator**
  * In the **Buildable Object Selector** component, locate the **Enable Grid Cell Indicator** property.
  * Uncheck this property to disable the visual indicator that follows the mouse pointer and snaps to the nearest grid cell.

For this guide, disabling the Grid Cell Indicator simplifies the setup. We’ll cover these features and their functionality in more detail in future tutorials.

<figure><img src="https://2651556506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FeumhICLT4oHoEIEssOjB%2Fuploads%2FdHLu7FN1OcjeyyPiRBzF%2Fimage.png?alt=media&#x26;token=598cdd21-6df6-443b-8157-5338c5c98370" alt=""><figcaption></figcaption></figure>

After exiting Play Mode, you might notice the grid disappears from the Editor Scene view. This happens because the **Active Grid Mode** property resets in the **Editor Grid Visual Handler XY** component.

To fix this, select the **Editor Grid Visual Handler XY** child GameObject inside your **EGB Pro 2 Grid XY** GameObject and set its **Active Grid Mode** property back to **Build Mode**.

If you don’t want to change this every time you enter and exit Play Mode, enable the **Grid Mode Default** property in the **Visual - Grid Object** section of the **Easy Grid Builder Pro XY** component under **Display Object Grid On Grid Mode**. This will keep the grid always visible in the Editor.

<figure><img src="https://2651556506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FeumhICLT4oHoEIEssOjB%2Fuploads%2Fy2dX8MZ5Vqozx01Ia5qk%2Fimage.png?alt=media&#x26;token=a7cd039f-b051-491c-87e7-7a9b1179365e" alt=""><figcaption></figcaption></figure>

<figure><img src="https://2651556506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FeumhICLT4oHoEIEssOjB%2Fuploads%2FeBs5ksBkKcxNo2TJZ3tP%2Fimage.png?alt=media&#x26;token=6a993fad-4cb0-4b3d-b31a-3df041436f97" alt=""><figcaption></figcaption></figure>

***

## <mark style="color:green;">Setting Up Grid Area Enablers</mark>

Similar to **Grid Area Disablers**, **Easy Grid Builder Pro 2** also includes **Basic Grid Area Enablers** and **Grid Area Enablers**.

* [**Basic Grid Area Enablers:**](https://soulgamess-studio.gitbook.io/easy-grid-builder-pro-2-documentation/secondary-components/grid-area-enabler/basic-grid-area-enabler) These are faster but offer limited control and flexibility.
* [**Grid Area Enablers:**](https://soulgamess-studio.gitbook.io/easy-grid-builder-pro-2-documentation/secondary-components/grid-area-enabler) These provide more advanced features and customization options.

For this guide, we will use the **Grid Area Enabler** component. Use the links to read more about both components.

***

Instead of adding a **Grid Area Enabler** directly to the grid, we’ll attach it to the **TopDown House 02** Buildable Object. This approach allows the Buildable Object to dynamically enable specific areas when placed on the grid. This method can also be applied to **Grid Area Disablers** for similar behavior.

* **Locate and Open the Prefab**
  * Navigate to <mark style="color:purple;">**2D City Builder Tutorial Demo > 2D Buildable Objects > TopDown House 02**</mark><mark style="color:purple;">.</mark>
  * Double-click the prefab to open it in **Prefab Mode**.
* **Add the Grid Area Enabler Component**
  * Select the **root GameObject** of the prefab.
  * Add the **Grid Area Enabler** component by navigating to:\ <mark style="color:purple;">**SoulGames > Easy Grid Builder Pro 2 > Scripts > Grid Area Controller Scripts > Grid Area Enablers**</mark><mark style="color:purple;">,</mark>\
    or by clicking <mark style="color:purple;">**Add Component > Easy Grid Builder Pro > Grid Utilities > Grid Area Enabler**</mark><mark style="color:purple;">.</mark>
* **Create and Configure a Child GameObject**
  * Create a new **Empty Child GameObject** under the root object and name it **Grid Area**.
  * Add the **Grid Area** component to the child object by clicking:\ <mark style="color:purple;">**Add Component > Easy Grid Builder Pro > Grid Utilities > Grid Area**</mark><mark style="color:purple;">.</mark>
* **Set the Grid Area Component Properties**
  * Configure the **Grid Area** component with these settings:
    * **Grid Axis**: **XY**
    * **Area Shape**: **Circle**
    * **Cell Size**: **1**
    * **Width**: **10**
    * **Length**: **10**
    * **Radius**: **5**
* **Save the Prefab**
  * Exit **Prefab Mode** to save all changes made to the prefab.

<figure><img src="https://2651556506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FeumhICLT4oHoEIEssOjB%2Fuploads%2FSKHzLjR6EvbNY5pFSKPV%2Fimage.png?alt=media&#x26;token=b9f606f8-bb44-494c-81bf-2affd37ab055" alt=""><figcaption></figcaption></figure>

* **Assign the Grid Area to the List**
  * Drag and drop the **Grid Area** child GameObject into the **Grid Area List** property of the **Grid Area Enabler** component.
* **Enable Grid Object Property**
  * In the **Grid Area Enabler** component, enable the **Enable All Grid Object** property.
* **Set Cell Highlight Color**
  * Enable the **Change Blocked Cell Color** property.
  * Set the **Enable Cell Highlight Color** property to a green color.

This setup ensures the specified area is enabled with a clear green highlight when the **TopDown House 02** object is placed on the grid.

<figure><img src="https://2651556506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FeumhICLT4oHoEIEssOjB%2Fuploads%2FMJckcv7wv8CNstqGIKrZ%2Fimage.png?alt=media&#x26;token=a51851ab-764d-4078-87b5-21507271fccb" alt=""><figcaption></figcaption></figure>

* **Exit Prefab Mode**
  * Close Prefab Mode to save the changes made to the **TopDown House 02** prefab.
* **Enter Play Mode**
  * Start the scene by entering **Play Mode**.
* **Select the TopDown House 02 Object**
  * In the **Buildable Objects UI Panel**, select the **Black House Icon**, which represents the **TopDown House 02 Buildable Grid Object** that now includes the **Grid Area Enablers**.
* **Place the Object**
  * Place the **TopDown House 02** object on **non-disabled grid areas**.
  * Observe that the area around the placed object is overridden by the **Grid Area Enabler**, enabling the grid cells within the defined area.
* **Test Placement in Enabled Areas**
  * After placing the object, try placing other objects within the enabled area. They should now be allowed inside the previously disabled grid areas.

This demonstrates how the **Grid Area Enabler** dynamically overrides and enables grid cells, allowing flexible object placement.

<figure><img src="https://2651556506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FeumhICLT4oHoEIEssOjB%2Fuploads%2F8NgtzDwzgFpkrGgcgB97%2Fimage.png?alt=media&#x26;token=3e665df5-730c-43c1-8dc1-00db672f064f" alt=""><figcaption></figcaption></figure>
