Scroll Rect

Overview

Scroll Rect extends Unity's native ScrollRect with element snapping, scaling, fading, and focus events. It keeps all standard ScrollRect behavior and settings while adding smooth snap animations and optional visual emphasis on the focused item.

All standard ScrollRect options (scroll sensitivity, inertia, movement type, etc.) still apply.

Usage

Add Scroll Rect component (the one with colors) to a RectTransform

Enable features:

Enable Snapping to snap to the closest item
Enable Scaling to scale items by distance
Enable Fading to fade items by distance
Disable Unfocused to disable interaction for non focused items

The layout updates automatically when values change

Properties

Snapping

Name	Type	Description
`enableSnapping`	`bool`	Enables snapping behavior after drag or when using snap methods
`snapDuration`	`float`	Time used for the snap animation
`snapCurve`	`AnimationCurve`	Easing curve for snapping interpolation
`disableUnfocused`	`bool`	When true, only the focused item remains interactable, others are disabled via CanvasGroup

Scaling

Name	Type	Description
`enableScaling`	`bool`	Enables scaling items based on distance from viewport center
`minScale`	`float`	Smallest scale applied to far elements (closest item stays at scale 1)
`scaleDistance`	`float`	Distance used to normalize scaling falloff

Fading

Name	Type	Description
`enableFading`	`bool`	Enables fading items based on distance from viewport center
`minAlpha`	`float`	Minimum alpha applied to far elements
`fadeDistance`	`float`	Distance used to normalize fading falloff

Events

Name	Type	Description
`onItemFocused`	`UnityEvent<int>`	Invoked when focus changes to a new item. The parameter is the focused item index

Public Methods

Name	Parameters	Description
`RefreshItems()`	None	Rebuilds the internal list of items based on current content children and applies initial visual effects
`AddTransform(rectTransform)`	`RectTransform`	Registers a new item manually and prepares it for effects
`InstantiateObject(rectObject, parent)`	`GameObject`, `Transform`	Instantiates a prefab under a parent and registers it as an item
`SnapToElement(index)`	`int`	Smoothly snaps the scroll content so the item at the given index is focused
`SnapToElementInstant(index, offset = 0)`	`int`, `float`	Immediately moves content so the item at index is focused, with optional extra offset
`SnapToElement(targetRect)`	`RectTransform`	Smoothly snaps to the item with the given RectTransform
`ScrollToNext()`	None	Snaps to the next item if snapping is enabled
`ScrollToPrevious()`	None	Snaps to the previous item if snapping is enabled

Code Example

ScrollRectExample.cs

using UnityEngine;
using Evo.UI;

public class ScrollRectExample : MonoBehaviour
{
    public ScrollRect scrollRect;

    void Start()
    {
        // Ensure content and viewport are assigned in the inspector
        // Populate content with items before calling RefreshItems

        // Enable snapping and visual effects
        scrollRect.enableSnapping = true;
        scrollRect.snapDuration = 0.35f;
        scrollRect.snapCurve = AnimationCurve.EaseInOut(0, 0, 1, 1);

        scrollRect.enableScaling = true;
        scrollRect.minScale = 0.7f;
        scrollRect.scaleDistance = 220f;

        scrollRect.enableFading = true;
        scrollRect.minAlpha = 0.35f;
        scrollRect.fadeDistance = 180f;

        // Disable interaction for unfocused items
        scrollRect.disableUnfocused = false;

        // Register items and apply initial visual state
        scrollRect.RefreshItems();

        // Listen to focus changes
        scrollRect.onItemFocused.AddListener(OnItemFocused);
    }

    void OnItemFocused(int index)
    {
        Debug.Log("Focused item index: " + index);
    }

    public void OnNextButton()
    {
        scrollRect.ScrollToNext();
    }

    public void OnPreviousButton()
    {
        scrollRect.ScrollToPrevious();
    }

    public void SnapToFirst()
    {
        scrollRect.SnapToElement(0);
    }
}

On this page