3. 다각형간 자연스러운 전환 구현

지난번에 육각형 오각형 사각형 배경을 구현하는데 성공했다.

하지만 저런식으로 딱딱하게 움직이면 게임플레이가 불가능할 것이다.

게임 플레이중 배경이 스르륵 하고 자연스럽게 전환되어야 한다.

 

실제 슈퍼 헥사곤 게임에서는 하나의 타일이 줄어들어 사라지거나 생성되는 방식으로 다각형간 전환이 이루어지고있다

생각해야할 점은 하나의 타일이 줄어들거나 늘어나면 나머지 타일들이 균등하게 늘어나거나 줄어들어야 한다는 점이다.

여러가지 방법을 생각해 보았지만 기존의 함수를 수정해 정점을 생성하는 단계에서 한쪽 타일이 줄어들거나 늘어나는 기능을 구현해야 할 것 같았다.

 

타일이 랜덤하게 줄어들거나 늘어날 필요는 없다. 변하는 타일은 항상 정해진 하나의 타일이어도 상관없다는 뜻이다.

내 함수는 개념적으로 둥근 원을 반시계방향을 그리며 일정한 각도마다 점을 찍어 정점을 저장하는 방식이다

고로 첫번째 타일은 유동적인 크기를 받아 생성하고 나머지는 (360º-첫번째 타일각도) / (다각형 꼭짓점의 수 -1) 하면

첫번째 타일을 제외한 나머지 타일의 각도가 균등하게 구해질 것이다.

 

게임메니저에서 다각형의 변경을 감지하면 첫번째 타일의 각을 저장하고 있는 변수의 값이 변하게 되고

그 값을 다각형이 완성될 때까지 받아 배경을 계속해서 다시 그려주며 부드럽게 전환되는 것처럼 구현한다.

 

if (polyold != polygon)
        {
            if(polyold>polygon)
            {
                if(firstin==false)
                {
                    firstin = true;
                    firstDegree = 360 / polyold;
                    tmppoly = polyold;
                }
                else
                {
                    firstDegree -= 1 * Time.deltaTime * GameSpeed / 3.0f;
                    if(firstDegree<=0)
                    {
                        tmppoly = polygon;
                        polyold = polygon;
                        firstin = false;
                        firstDegree = 360 / polygon;
                    }
                }
            }
            else
            {
                if(firstin==false)
                {
                    firstin = true;
                    firstDegree = 0;
                    tmppoly = polygon;
                }
                else
                {
                    firstDegree += 1 * Time.deltaTime * GameSpeed / 3.0f;
                    if(firstDegree>=(360/polygon))
                    {
                        polyold = polygon;
                        firstin = false;
                        firstDegree = 360 / polygon;
                    }
                }
            }
            //배경
            BackGroundNode = BackGroundpoly.PolygonFunc(radius, tmppoly, firstDegree);
            BackGroundpoly.createProceduralMesh(BackGroundNode);

            //중앙 바깥
            MiddleOutNode = MiddleOutPoly.PolygonFunc(radius2, tmppoly, firstDegree);
            MiddleOutPoly.createProceduralMesh(MiddleOutNode);

            //중앙 중앙
            MiddleInNode = MiddleInPoly.PolygonFunc(radius3, tmppoly, firstDegree);
            MiddleInPoly.createProceduralMesh(MiddleInNode);
        }

각이 늘어나는 경우와 줄어드는 경우 다르게 생각해야한다.

정점을 찍는 함수는 하나고 항상 첫번째 각을 받아 도형을 그리기 때문에 도형이 완성될때 첫번째 각은

변한 후의 다각형의 각도가 되어야 한다. 또한 변화가 끝나면 더이상 계속해서 화면을 갱신할 필요가 없으므로 함수를 호출할 필요가 없다. 그래서 상당히 복잡한 형태의 조건문이 사용된다.

 

public Vector3[] PolygonFunc(float radius, int vertex, float firstDegree)
    {
        Vector3[] node = new Vector3[vertex * 3];
        float deg = (360-firstDegree) / (vertex-1);

        node[0] = new Vector3(0, 0);
        for (int i = 1; i <= 2; i++)
        {
            var rad = Mathf.Deg2Rad * (firstDegree * (i - 1));
            var x = radius * Mathf.Sin(rad);
            var y = radius * Mathf.Cos(rad);
            node[i] = new Vector3(x, y);
        }

        for (int j = 1; j < vertex; j++)
        {
            node[j * 3] = new Vector3(0, 0);
            for (int i = 1; i <= 2; i++)
            {
                var rad = Mathf.Deg2Rad * ((deg * (j + i - 2))+firstDegree);
                var x = radius * Mathf.Sin(rad);
                var y = radius * Mathf.Cos(rad);
                node[j * 3 + i] = new Vector3(x, y);
            }
        }

        return node;
    }

정점이 세배인 가장 큰 배경의 정점 생성 함수이다. 항상 처음 타일의 각도를 받아오고 처음 타일 이후의 타일을 잘 생성하도록 처리되어있다. 나머지 중앙 다각형도 큰 차이 없다.

 

기대했던것 보다 훨씬 이쁘게 전환이 되는것을 볼 수 있었다!

 

이제 배경은 모두 구현되었고 다음은 내려오는 벽을 구현해야한다.

내려오는 벽은 한번에 많은 오브젝트가 처리되어야 하고 계속해서 화면을 갱신해주어야 하기 때문에

최적화에 꽤 신경을 써서 작업해야 할 것 같다.