windows 8 pixel Density

안드로이드 개발시 다양한 해상도에 따른 이미지 처리를 어떻게 할것이냐로 고민을 했었는데..

윈도우 8 메트로에서 화면 해상도에 따른 UI 요소의 실제 크기를 일관되게 유지하도록 앱크기를 조정하는 기준을

제공 개발편의성을 도와준다.

 

크기 조정 안정 상태	최소 화면 해상도
1.0 100% 조정없음	1024x768
1.4 140% 조정	1440x1080
1.8 180% 조정	1920x1440

 

 

권장 사항

• SVG(Scalable Vector Graphics)를 사용하세요. JavaScript 앱에 SVG를 사용하고 C#/C++/VB 앱에 XAML을 사용합니다. Windows에서 이러한 형식의 크기가 눈에 띄는 아티팩트 없이 자동으로 조정됩니다.
• 앱 패키지에서 비트맵 이미지에 리소스 로드 사용 앱 패키지에 저장된 비트맵 이미지의 경우, 배율 인수(100%, 140% 및 180%)마다 별도 이미지를 제공하고 아래에 설명된 "배율" 명명 규칙에 따라 이미지 파일의 이름을 지정합니다. Windows에서는 현재 배율에 적합한 이미지를 자동으로 로드합니다. 자세한 내용은 빠른 시작: 파일 또는 이미지 리소스 사용(JavaScript 및 HTML로 작성한 Windows 스토어 앱) 및 Quickstart: 파일 또는 이미지 리소스 사용(C#/VB/C++ 및 XAML로 작성한 Windows 스토어 앱)을 참조하세요.

  Important  제공하는 이미지는 1024x1024픽셀을 넘지 않아야 하며 200KB 이하여야 합니다.

  파일 이름 또는 폴더 명명 규칙을 사용하여 여러 버전의 이미지를 저장합니다.

  Note  매니페스트에 지정된 로고 및 와이드 로고 이미지의 경우 배율의 추가 80% 배율을 지정할 수 있습니다. 최상의 결과를 얻으려면 이러한 이미지에 대한 네 가지 배율을 제공하세요.

  DPI 샘플에 따라 크기 조정에서는 이미지를 위해 로드되는 리소스의 사용 방법을 보여 줍니다.

• 원격 웹 이미지에 대해 해상도 미디어 쿼리 사용 앱이 JavaScript 앱이며 원격 웹 이미지가 있으면 background-image 속성과 함께 CSS @media 해상도 미디어 기능을 사용하여 런타임 시 이미지를 대체합니다.
• 런타임 시 배율에 따라 수동으로 이미지 로드 앱이 런타임 시 코드를 사용하여 이미지를 로드하는 경우(예: XAML 또는 HTML이 아니라 직접 DirectX를 사용하여 UI 만들기) DisplayProperties.ResolutionScale 속성을 사용하여 배율을 결정하고, 배율에 따라 수동으로 이미지를 로드합니다.
• 파일 시스템의 사용자 이미지에 대해 파일 액세스 미리 보기 API 사용 앱이 파일 시스템에서 사용자 이미지를 로드하면, 미리 보기 이미지를 표시하여 사용자가 탐색하는 동안 파일을 미리 보도록 할 수 있습니다. 파일 형식에 맞게 최적화된 미리 보기 이미지를 자동으로 검색하려면 미리 보기 API를 사용하세요. 미리 보기 사용에 대한 자세한 내용은 미리 보기에 대한 지침을 참조하세요.
• 이미지의 너비 및 높이 지정 큰 이미지가 로드될 때 레이아웃이 변경되지 않도록 이미지에 대해 자동 크기 조정을 사용하지 않고 대신에 이미지에서 너비 및 높이를 지정합니다.
• 인쇄 그리드 단위 및 보조 단위 사용 주 그리드 단위로 20px, 부 그리드 단위로 5px의 정의된 인쇄 그리드 단위를 사용하여 해당 레이아웃에서 픽셀 반올림으로 인한 픽셀 이동이 발생하지 않도록 합니다. 5px로 나눌 수 있는 크기의 단위를 사용할 경우 픽셀 반올림이 발생하지 않습니다.

금지 사항

• 확대된 작은 이미지를 사용하지 마세요. 이미지가 기본적으로 확대되어 있으므로 100% 배율 이미지만 사용할 수 있는 경우 HD 태블릿에서 140% 배율의 이미지는 흐릿하게 보입니다. 위의 지침에 따라 이미지가 더 높은 140% 배율에서 선명하게 보이도록 해야 합니다.
• 축소된 큰 이미지를 사용하지 마세요. 축소된 큰 이미지는 표준 태블릿에서 들쭉날쭉한 가장자리나 크기 조정으로 인한 아티팩트를 나타냅니다. 단, 사진은 축소된 상태에서도 선명하게 보일 수 있으므로 예외입니다. 위의 지침에 따라 이미지가 100% 배율에서 선명하게 보이도록 해야 합니다.
• 5px 배수가 아닌 크기를 지정하지 마세요. 5px의 배수가 아닌 단위를 사용하면 140% 및 180%로 확대했을 때 픽셀 이동이 발생할 수 있습니다.

 

http://msdn.microsoft.com/ko-kr/library/windows/apps/hh465362.aspx 발췌