Interactable Feature for Group Members

[mertcanozturk]

Hello. Is there a component that can replace Unity Canvas Group? I saw the clip mask component. I can use this for alpha. I also want to turn off the interactable of group members. Is there anything we can do for this?

[adgray1]

Unfortunately there's not currently a way to do this with a single checkbox, so I'm labeling this as "Under Consideration" to help us track active requests.

In the meantime, while perhaps not ideal, some current options that would work would be 1) having things on different layers and routing gestures to specific layers or 2) manually enabling/disabling the Interactable/Scroller components under a given root as desired.

[onewheelstudio]

I created a component to mimic at least some of the behavior of a Unity canvas group. I put it together rather quick and dirty, but I'm happy to share it. In my implementation, I use DoTween to tween the alpha. I commented those bits out but I thought I'd include them anyway in case folks are using DoTween. You could probably get more clever with caching references to children rather than calling GetComponentsInChildren all the time... But I wanted it to work more than I needed it to be clever.

//using DG.Tweening;
using Nova;
using UnityEngine;

public class NovaGroup : MonoBehaviour
{
    [SerializeField, Range(0f, 1f)]
    private float alpha = 1f;
    [SerializeField]
    private bool _interactable = true;
    public bool interactable
    {
        get { return _interactable; }
        set
        {
            SetInteractable(value);
            _interactable = value;
        }
    }

    [SerializeField] private bool _ObstructDrags;
    public bool obstructDrags
    {
        get { return _ObstructDrags; }
        set
        {
            SetObstructDrags(value);
            _ObstructDrags = value;
        }
    }

    private void OnValidate()
    {
        SetAlpha(this.alpha);
        SetInteractable(_interactable);
    }

    public void SetAlpha(float alpha)
    {
        this.alpha = alpha;
        foreach (var block in this.GetComponentsInChildren<UIBlock>(true))
        {
            Color color = block.Color;
            color.a = alpha;
            block.Color = color;
        }
    }

    private void SetInteractable(bool isInteractable)
    {
        foreach (var interact in this.GetComponentsInChildren<Interactable>())
        {
            interact.enabled = isInteractable;
        }
    }

    private void SetObstructDrags(bool blocksRaycast)
    {
        foreach (var interact in this.GetComponentsInChildren<Interactable>())
        {
            interact.ObstructDrags = blocksRaycast;
        }
    }

    //public Tween DOFade(float endValue, float duration)
    //{
    //    return DOTween.To(() => this.alpha, x => this.SetAlpha(x), endValue, duration);
    //}

}

[ZanKievit]

Great stuff!
I added a couple of things, Thought i'dd share. Mainly the Border and Shadow are now also being affected by Alpha. And I added some simple caching of the children.

using Nova;
using UnityEngine;

public class NovaGroup : MonoBehaviour
{
    [SerializeField, Range(0f, 1f)]
    private float alpha = 1f;
    [SerializeField]
    private bool interactable = true;
    public bool Interactable
    {
        get { return interactable; }
        set
        {
            SetInteractable(value);
            interactable = value;
        }
    }

    [SerializeField] private bool obstructDrags;
    public bool ObstructDrags
    {
        get { return obstructDrags; }
        set
        {
            SetObstructDrags(value);
            obstructDrags = value;
        }
    }

    private UIBlock[] childBlocks;
    private Interactable[] childInteractables;

    private void OnValidate()
    {
        SetAlpha(alpha);
        SetInteractable(interactable);
        SetObstructDrags(obstructDrags);
    }

    private void CacheChildren()
    {
#if UNITY_EDITOR
	childBlocks = GetComponentsInChildren<UIBlock>(true);
	childInteractables = GetComponentsInChildren<Interactable>();
#else
        if (childBlocks == null)
        {
            childBlocks = GetComponentsInChildren<UIBlock>(true);
        }
        if (childInteractables == null)
        {
            childInteractables = GetComponentsInChildren<Interactable>();
        }
#endif
    }

    public void SetAlpha(float alpha)
    {
        CacheChildren();

        this.alpha = alpha;
        foreach (var block in childBlocks)
        {
            Color color = block.Color;
            color.a = alpha;
            block.Color = color;

            if (block is UIBlock2D)
            {
                UIBlock2D uiBlock2D = (UIBlock2D)block;

                Color borderColor = uiBlock2D.Border.Color;
                borderColor.a = alpha;
                uiBlock2D.Border.Color = borderColor;

                Color shadowColor = uiBlock2D.Shadow.Color;
                shadowColor.a = alpha;
                uiBlock2D.Shadow.Color = shadowColor;
            }
        }
    }

    private void SetInteractable(bool isInteractable)
    {
        CacheChildren();

        foreach (var interact in childInteractables)
        {
            interact.enabled = isInteractable;
        }
    }

    private void SetObstructDrags(bool blocksRaycast)
    {
        CacheChildren();

        foreach (var interact in childInteractables)
        {
            interact.ObstructDrags = blocksRaycast;
        }
    }
}