Unity UGUI折线图

using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
using DG.Tweening;

public class UILineImage : MonoBehaviour
{
	public float[] _datas;//数据

	public float _lineWidth = 3;//线宽
	public Image _linePrefab;//线Prefab
	public RectTransform _lineContent;//线Content

	public RectTransform _dotPrefab;//点Prefab
	public float _dotRadius = 8;//点半径
	public RectTransform _dotContent;//点Content


	public Transform _leftSide;//左侧描述
	public RectTransform _descContent;//描述Content
	public Text _descPrefab;//描述Prefab

	public float _tweenTime = 2f;//动画时间

	private List<Text> _descs;
	private List<RectTransform> _dots;
	private List<Image> _lines;

	private float _maxValue = 10;

	private void Awake()
	{
		_descs = new List<Text>();
		_dots = new List<RectTransform>();
		_lines = new List<Image>();
	}

	private void Start()
	{
		_datas = new float[] { 1, 2, 3, 4, 5, 1, 8 };
		Draw(_datas, _maxValue);
	}

	public void Draw(float[] _tempDatas, float _tempMaxValue)
	{
		this._datas = _tempDatas;
		this._maxValue = _tempMaxValue;
		DrawDesc();
		DrawDot();
		DrawLines();
	}

	private void DrawDesc()
	{
		for (int i = 0; i < _datas.Length; i++)
		{
			Text desc = null;
			if (_descs.Count <= i)
			{
				desc = Instantiate<Text>(_descPrefab, _descContent);
				_descs.Add(desc);
			}
			else
			{
				desc = _descs[i];
			}
			desc.gameObject.SetActive(true);
			desc.text = i.ToString();
			desc.transform.SetAsLastSibling();//使用对象池和自动布局组件会调乱顺序,要重置
			desc.gameObject.SetActive(true);
		}
		LayoutRebuilder.ForceRebuildLayoutImmediate(_descContent);//使用自动布局组件要刷新UI,刷新位置

		for (int i = _datas.Length; i < _descs.Count; i++)
		{
			_descs[i].gameObject.SetActive(false);
		}
	}

	private void DrawDot()
	{
		float height = _dotContent.rect.height;
		for (int i = 0; i < _datas.Length; i++)
		{
			RectTransform dot = null;
			if (_dots.Count <= i)
			{
				dot = Instantiate<RectTransform>(_dotPrefab, _dotContent);
				_dots.Add(dot);
			}
			else
			{
				dot = _dots[i];
			}
			dot.localPosition = new Vector3(_descs[i].transform.localPosition.x, height * (_datas[i] / _maxValue - 0.5f), 0);//锚点在中心
			dot.sizeDelta = Vector2.one * _dotRadius * 2;
			dot.gameObject.SetActive(true);
		}
		for (int i = _datas.Length; i < _dots.Count; i++)
		{
			_dots[i].gameObject.SetActive(false);
		}
	}

	private void DrawLines()
	{
		for (int i = 0; i < _lines.Count; i++)
		{
			_lines[i].gameObject.SetActive(false);
		}
		DrawLine(_datas.Length);
	}

	private void DrawLine(int count, int index = 0)
	{
		if (index >= count) return;
		Vector2 curPos = _dots[index].localPosition;
		Vector2 nextPos = _dots[index + 1].localPosition;
		float length = Vector2.Distance(curPos, nextPos);
		Vector3 dir = curPos - nextPos;
		float angle = Vector3.Angle(Vector3.up, dir);
		Vector2 center = (curPos + nextPos) / 2;
		Image line = null;
		if (_lines.Count <= index)
		{
			line = Instantiate<Image>(_linePrefab, _lineContent);
			_lines.Add(line);
		}
		else
		{
			line = _lines[index];
		}
		line.rectTransform.localEulerAngles = Vector3.forward * angle;
		line.rectTransform.localPosition = center;
		line.rectTransform.sizeDelta = new Vector2(_lineWidth, length);
		line.gameObject.SetActive(true);
		line.fillAmount = 0;
		line.fillOrigin = dir.x > 0 ? 0 : 1;
		line.DOFillAmount(1, _tweenTime / count).OnComplete(() => DrawLine(count, index + 1));
		_lines[index] = line;
	}

}

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

cchoop

有用的话请杯肥宅水

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值