tim-peters / TheFoehnThing

An interactive Foehn wind simulation for touch interfaces (2nd semester university project)
https://www.timjpeters.com/portfolio/the-foehn-thing
0 stars 0 forks source link

implemented UI with unity's native UI kit instead of NGUI #2

Open tim-peters opened 8 years ago

tim-peters commented 8 years ago

is seems not to be necessary anymore to use NGUI. Instead use Unity's new native possibility to implement a UI. This could go hand in hand with a redesign of the UI according to the originally intended designs (e.g. circular sliders).

tim-peters commented 8 years ago

Circular sliders can be implemented easily with an UI Image of a ring/circle and this c# class:

using UnityEngine;
using System.Collections;
using UnityEngine.UI;
using UnityEngine.EventSystems;

public class radialSliderBehavior : MonoBehaviour {
    [Range(0,1)]
    public float value = .5f;

    private Image imageComponent;
    private bool isClicked = false;
    private Vector2 dragStartPosition;

    void Start () {
        imageComponent = GetComponent<Image> ();
        imageComponent.fillAmount = 1 - value;
    }

    void Update () 
    {
        // Check if the left mouse button was clicked
        if (Input.GetMouseButton (0)) {
            // Check if the mouse was clicked over a UI element
            if (EventSystem.current.IsPointerOverGameObject ()) {
                if (!isClicked) { // active clicked state
                    isClicked = !isClicked;
                }
            }

        } else {
            // deactivate clicked state
            if(isClicked)
                isClicked = !isClicked;
        }

        if(isClicked) {
            var ray = GetComponentInParent<GraphicRaycaster>();
            Vector2 localPos; // Mouse position  
            RectTransformUtility.ScreenPointToLocalPointInRectangle( transform as RectTransform, Input.mousePosition, ray.eventCamera, out localPos );
            float angle = ((Mathf.Atan2(-localPos.y, localPos.x)*180f/Mathf.PI+180f)+90)/360f;
            angle = (angle > 1) ? angle - 1 : angle;
            updateSlider (1-angle);
        }
    }

    void updateSlider(float value) {
        imageComponent.fillAmount = 1 - value;
    }
}