빠른 시작: 앱에서 인쇄(HTML)
[ 이 문서는 Windows 런타임 앱을 작성하는 Windows에서 8.x 및 Windows Phone 8.x 개발자를 대상으로 합니다. Windows 10용으로 개발하는 경우에는 최신 설명서를 참조하세요.]
이 빠른 시작에서는 Windows 스토어 앱에 인쇄 기능을 추가하는 가장 간단한 방법에 대해 설명합니다.
프로세스를 간단히 살펴보려면 이 짧은 동영상을 시청하세요.
Windows 스토어 앱에서 인쇄하는 가장 간단한 방법은 Windows 인쇄를 사용하는 것입니다. Windows 인쇄를 사용하려면 앱이 다음 조건을 갖추어야 합니다.
사용자가 인쇄할 수 있게 하려는 앱의 각 보기에서 인쇄 계약을 등록해야 합니다.
인쇄 계약 등록은 PrintManager 개체 가져오기, PrintTask 개체 만들기, 인쇄 이벤트 처리를 의미합니다.
인쇄할 형식의 콘텐츠를 제공해야 합니다.
이 빠른 시작에 나오는 기본 인쇄 환경은 Windows에서 앱의 화면을 인쇄하기 위한 것입니다.
참고 특정 페이지 인쇄 또는 사용자 지정 인쇄 설정과 같은 사용자 지정 인쇄 기능은 C++/C#/Visual Basic 및 XAML을 사용하는 Windows 스토어 앱에만 추가할 수 있습니다. 앱에 사용자 지정 인쇄 기능을 추가하는 방법에 대한 자세한 내용은 인쇄(XAML)를 참조하세요.
사전 요구 사항
- HTML, JavaScript, Windows 이벤트와 이벤트 처리에 대해 잘 알고 있어야 합니다.
- Microsoft Visual Studio가 설치되어 있어야 합니다.
- 프린터가 설치되어 있어야 합니다.
- 인쇄를 추가할 앱이 있어야 합니다. 자신이 개발한 앱이 없는 경우 인쇄 샘플 샘플 앱을 다운로드하여 사용할 수 있습니다.참고 이 빠른 시작의 예제는 인쇄 샘플 샘플 앱(영문)에 있습니다.
지침
1. 편집을 위해 앱의 소스 코드 열기
이 절차는 인쇄 샘플 샘플 앱의 PrintSampleJS 앱을 여는 방법에 대한 것입니다. 자신이 개발한 앱을 사용 중인 경우 Visual Studio에서 앱을 열고 다음 단계로 건너뜁니다.
- 인쇄 샘플 샘플 앱(영문)을 열고 JavaScript 예제를 컴퓨터에 다운로드합니다.
- Visual Studio에서 File > Open Project를 클릭하고 앞 단계에서 다운로드한 샘플 앱의 솔루션 파일이 있는 폴더로 이동합니다.
- PrintSampleJS 솔루션 파일을 선택하고 열기를 클릭합니다.
2. 앱 빌드 및 테스트
- 빌드 > 솔루션 빌드를 클릭하여 작업 중인 앱을 빌드합니다. 화면 아래쪽에 있는 출력 창에 오류 메시지가 없는지 확인합니다.
- 디버그 > 디버깅하지 않고 시작을 클릭합니다.
- 몇 초 후 화면에 인쇄 샘플 JS 앱이 표시되는지 확인합니다.
- 앱이 오류 없이 실행되면 Visual Studio로 돌아간 다음 디버그 > 디버깅 중지를 클릭합니다.
3. Windows 인쇄 등록
이제 앱 화면에 일부 콘텐츠가 표시될 것입니다.
앱에 인쇄 기능을 추가하는 첫 번째 단계는 인쇄 계약을 등록하는 것입니다. 고객이 인쇄할 수 있도록 할 모든 화면에 대해 앱에서 이 작업을 수행해야 합니다.
참고 사용자에게 표시되는 화면에서만 인쇄를 등록 할 수 있습니다. 앱의 한 화면에서 인쇄를 등록한 경우 이 화면을 나갈 때 인쇄 등록을 취소해야 합니다. 이 화면이 다른 화면으로 바뀔 경우 다음 화면이 열릴 때 새 인쇄 계약을 등록해야 합니다.
인쇄 계약 등록은 PrintManager 개체를 가져오고 PrintTaskRequested 이벤트에 대한 처리기를 정의하는 것을 의미합니다.
인쇄할 앱의 각 화면에 화면이 열릴 때 실행되도록 다음 코드를 추가합니다. PrintSampleJS 샘플 앱에서 이 작업은 화면을 만들기 위해 호출되는 WinJS.UI.Pages.define 함수에 대한 members 매개 변수의 ready 구성원에서 수행됩니다.
var printManager = Windows.Graphics.Printing.PrintManager.getForCurrentView(); printManager.onprinttaskrequested = onPrintTaskRequested;
참고 이 코드를 PrintSampleJS 샘플 앱에서와 같이 별도의 함수에 포함시킬 수 있습니다.
해당 화면에 대한 인쇄 작업 이벤트 처리기를 추가합니다. 예를 들어 화면별로 인쇄할 콘텐츠 형식을 다르게 지정해야 하는 경우 화면마다 다른 함수가 필요할 수 있습니다.
이 인쇄 샘플 JS 앱은 여기에 나온 완료 처리기를 포함합니다. 완료 이벤트를 처리하는 것은 오류가 발생했을 때 이를 사용자에게 알리고 가능한 해결 방법도 제공할 수 있으므로 좋은 방법입니다. 또한 인쇄 작업이 성공한 후 사용자가 수행할 다음 단계를 안내하는 데도 완료 이벤트를 사용할 수 있습니다.
function onPrintTaskRequested(printEvent) { var printTask = printEvent.request.createPrintTask("Print Sample", function (args) { args.setSource(MSApp.getHtmlPrintDocumentSource(document)); // Register the handler for print task completion event printTask.oncompleted = onPrintTaskCompleted; }); }
function onPrintTaskCompleted(printTaskCompletionEvent) { // Notify the user about the failure if (printTaskCompletionEvent.completion === Windows.Graphics.Printing.PrintTaskCompletion.failed) { WinJS.log && WinJS.log("Failed to print.", "sample", "error"); } }
앞에서 설명한 대로 앱을 빌드하고 테스트합니다.
4. 앱에서 인쇄
앱을 수정하고 빌드한 후 디버거에서 개 기능을 테스트합니다.
- 디버그 > 디버깅 시작을 클릭합니다.
- 몇 초 후 화면에 인쇄 샘플 JS 앱이 표시되는지 확인합니다.
- 화면 오른쪽에서 살짝 밀어 참 메뉴를 표시합니다.
- 장치 참 메뉴를 선택합니다.
- 프린터를 선택합니다. 인쇄 창이 나타납니다.
- 인쇄 창에서 인쇄 단추를 클릭하여 현재 화면의 콘텐츠를 인쇄합니다.
- 인쇄 결과를 검토합니다.
요약 및 다음 단계
이 빠른 시작에서는 사용자가 앱을 조작하는 방법이나 앱이 인쇄용 콘텐츠 형식을 지정하는 방법을 수정하지 않고 Windows 인쇄를 앱에 추가했습니다.
지금부터는 좀 더 고급 기능을 살펴볼 수 있습니다. 앱에서 바로 인쇄 단추를 사용하여 인쇄하는 방법에서는 사용자가 Windows 스토어 앱에서 인쇄하기 위해 클릭할 수 있는 인쇄 단추를 추가합니다.
참고
JavaScript 함수 window.print()를 사용하여 앱의 콘텐츠를 인쇄할 수 있지만 **window.print()**는 기본 인쇄 환경을 사용하여 화면에 표시되는 콘텐츠를 인쇄하기 위한 것입니다. Windows 스토어 앱 화면이 항상 좋은 인쇄 결과를 만들지는 못하므로 **window.print()**를 호출하는 것이 최선의 방법이 아닐 수 있습니다. 최적의 사용자 환경을 제공하려면 Windows 런타임 함수를 사용하고 이러한 항목에서 설명하는 인쇄 계약을 등록하는 것이 좋습니다.
Windows 스토어 앱에서 사용할 수 있는 다른 인쇄 시나리오를 보려면 인쇄 샘플 샘플 앱을 참조하세요.