====== 화면 이동하기 ======

보통 여러개의 화면을 준비해 놓고, 상황에 따라서 이 화면 저 화면을 옮겨가면서 UI를 구성하게 됩니다. 그 방법에 대해서 알아보겠습니다.

우선, Visualization 을 2개 추가해주세요. 추가하실때 이렇게 이름을 바꾸실 수 있습니다. Page1, Page2 로 하겠습니다.

{{ :codesysmanual:makepage1.png?nolink |}}

{{ :codesysmanual:page2.png?nolink |}}

그 다음은 각 화면의 내용을 채우세요. 

{{ :codesysmanual:page1screen.png?nolink |}}

{{ :codesysmanual:page2screen.png?nolink |}}

화면을 보시면 아시겠지만, Button 을 사용해서 다른 페이지로 이동할 수 있게 하였습니다. 이제 버튼 속성을 보시죠.

마우스를 클릭(또는 화면터치)했을때 어떤 동작을 해야하므로, Input configuration의 OnMouseClick에서 Configure를 클릭하세요.

{{ :codesysmanual:page3.png?nolink |}}

그러면 이런 화면이 뜨는데, 여기에서 Change Shown Visualization을 선택해서 추가하고, 변경할 페이지를 Page1으로 해주세요.

{{ :codesysmanual:page4.png?nolink |}}

다른 페이지도 마찬가지로 해줍니다. 결과는 다음과 같습니다.

{{ :codesysmanual:movepagevideo.gif?nolink |}}

[[codesysmanual:index|CODESYS]]