【Unity】 丝滑的可控制阶段性Progress Bar + 分数显示 + 星级评定

应用场景:

类似三消中关卡结束时结算的画面,黄色的是星级 分数达到星星位置,星星变红

思路:

首先需要一个浮点型数组SplitScore[],储存分数条各个阶段的增加数值大小,也就是各项得分,比如剩余时间得分0.2,A项得分0.3,B项得分0.4,那么最终效果就是分数条丝滑运动到0.2 停一下继续运动,运动到0.5停一下……;还需要一个PreScore,代表当前正在增加的这一阶段的截至分数,也就是逐一访问刚才数组的元素。

其次,虽然progressbar只能接受0-1的取值,但是显示的分数应该是较大的数以提升玩家获得感,所以还需要一个用于text显示的浮点数,我叫做HugeScore

最后,三个星星分别需要三个浮点数我叫做StarPos,代表它们在进度条的显示位置(可以手动调节,但是会很麻烦,也不太准确),以及进度条的值(0-1)到哪里时它们该变色。

代码:

分数条的阶段性增加

写在Update里

slider.value += Time.deltaTime * Speed;//分数条增加
            if(slider.value - lastValue >= PreFurScore)//增加区间到达当前家具得分值
            {
                LittleStop();
                lastValue = slider.value;
                PreFurScore = NextScore();
            }

两个阶段之间的暂停是简单粗暴的全局暂停,还可以优化

void LittleStop()
	{
		System.Threading.Thread.Sleep(StopTime);
	}

text中的虚假分数显示 也在Update里

HugeScore = slider.value * Total;
            text.text = (int)HugeScore + "分";//实时改变分数文字

三个星星的位置安排

注意星星是Image,所以要RectTransform组件

星星初始位置必须都在进度条的最左侧,这样才能移动到指定的位置,也就是向右移动的距离为:StarPos*进度条的长度

Start{
        slider.GetComponent().GetWorldCorners(corners);
        //获取Slider四个角的三维坐标,出来的坐标的顺序是左下、左上、右上、右下
        float length = corners[3].x - corners[0].x;


        //改变三个星星的位置到设定的位置
        Star1.GetComponent().anchoredPosition3D += new Vector3 (length * Star1Pos,0f,0f);
        Star2.GetComponent().anchoredPosition3D += new Vector3 (length * Star2Pos,0f,0f);
        Star3.GetComponent().anchoredPosition3D += new Vector3 (length * Star3Pos,0f,0f);
    }

三个星星的变色判定

在Update里

//星级判定
            if(slider.value >= Star1Pos)
            {
                Star1.GetComponent().color = Color.red;
                money = 600;
                if(slider.value >= Star2Pos)
                {
                    Star2.GetComponent().color = Color.red;
                    money = 1000;
                    if(slider.value >= Star3Pos)
                    {
                        Star3.GetComponent().color = Color.red;
                        money = 1500;
                    }
                }
            }
            

最终效果

【Unity】 丝滑的可控制阶段性Progress Bar + 分数显示 + 星级评定_第1张图片

你可能感兴趣的:(【Unity】 丝滑的可控制阶段性Progress Bar + 分数显示 + 星级评定)