--- title: "앱에서 팝업 창을 만드는 방법" date: "2018-03-06" categories: - "app-development" - "development" - "mobile" - "mobile-development" tags: - "app-development" - "cross-platform-mobile-development" - "mobiletogether" description: MobileTogether를 사용하여 모바일 앱에서 팝업 창을 만들고 설정하는 방법을 알아보세요. 메시지 및 입력 기능을 위한 모달 다이얼로그를 활용하여 사용자 경험을 향상시키세요. --- Status: #blog Tags: #app-development #cross-platform-mobile-development #mobiletogether Categories: [mobile-development](/blog/ko/category/mobile-development.md) | [development](/blog/ko/category/development.md) | [mobile-development](/blog/ko/category/mobile-development.md) | [mobile-development](/blog/ko/category/mobile-development.md) # 앱에서 팝업 창을 만드는 방법 동안 [모바일 앱 개발](https://www.altova.com/ko/mobiletogether/) 개발자는 종종 사용자가 빠르게 완료할 수 있는 작업을 제공하거나, 현재 앱 화면 위에 표시될 메시지를 전달하고자 합니다. 이를 "팝업 창"이라고도 합니다. 이러한 기능은 사용자가 앱 사용 중인 흐름을 방해하지 않고, 특정 작업을 완료하거나 메시지를 확인하도록 돕는 데 유용합니다. MobileTogether를 사용하면 원하는 크기의 팝업 창을 쉽게 설정할 수 있습니다. 작동 방식을 자세히 살펴보겠습니다. ![사용자가 앱과 상호 작용 중입니다](/blog/images/shutterstock_160560011-1.jpg) ## 팝업 창 정의 앱 내에서 팝업 창은 짧은 메시지를 표시하거나 사용자가 일부 정보를 입력하도록 하는 데 유용하며, 전체 기기 화면을 가리지 않습니다. 팝업 작업이 완료되면 사용자는 원래 작업 흐름의 동일한 위치로 돌아가 앱에서 작업을 계속할 수 있습니다. 팝업 창은 앱의 주요 화면과의 상호 작용을 일시적으로 차단하기 때문에 "모달 창"이라고도 불립니다. 예를 들어, 팝업 창은 알림 메시지를 표시하거나, 애플리케이션의 일반적인 작업 흐름을 방해할 수 있는 정보를 표시하는 데 적합합니다. [MobileTogether](https://www.altova.com/ko/mobiletogether)에서 앱 개발자는 "액션 대화 상자"의 "_하위 페이지로 이동_" 기능을 사용하여 모든 하위 페이지를 팝업 창으로 정의할 수 있습니다. 단순히 옆에 있는 확인란에 체크하세요 _서브 페이지를 모달 다이얼로그 형태로 표시합니다_ 그리고 원하는 팝업 창의 높이와 너비를 입력하세요. 여기서는 팝업 창이 화면 너비의 75%를 차지하고 높이는 65%가 되도록 설정했습니다. 퍼센트(%)를 사용하면 모달 창이 iOS, Android 또는 Windows 장치 등 어떤 기기에서도 잘 표시됩니다.   ![앱 팝업 창 정의](/blog/images/app-pop-up.png)   원하는 경우, 세로 방향과 가로 방향에 대해 각각 다른 값을 설정할 수도 있습니다. MobileTogether Designer에 내장된 시뮬레이터를 사용하면 팝업 창을 쉽게 테스트할 수 있으며, 이를 통해 모든 운영체제와 다양한 기기 환경에서 테스트가 가능합니다.   ![모든 기기에서 앱을 시뮬레이션하세요](/blog/images/simulate-app.png)   도구 모음에서 "_클라이언트에서 테스트 실행_" 버튼을 클릭하면, 디자인 도구 내에서 직접 여러분의 장치에서 테스트를 실행해 볼 수 있습니다. 제가 위에서 정의한 팝업 창이 제 휴대폰 화면에 어떻게 보이는지 보여드리겠습니다   ![휴대폰 화면에 나타나는 팝업 창](/blog/images/pop-up-phone.png)   팝업 창을 정의하는 것뿐만 아니라, 다양한 기능을 설정하는 것이 얼마나 쉬운지 확인해 보세요 [고급 앱 기능](https://www.altova.com/ko/mobiletogether/features) 다음은 번역입니다: [앱 개발](https://www.altova.com/ko/mobiletogether/download) 무료 모바일투게더 디자이너를 사용하면 됩니다.