다음을 통해 공유

이미지 라이브러리 뷰어

  • 아티클

Visual Studio 이미지 라이브러리 뷰어 도구는 사용자가 Visual Studio와 동일한 방식으로 조작할 수 있도록 이미지 매니페스트를 로드 및 검색할 수 있습니다. 사용자는 배경, 크기, DPI, 고대비 및 기타 설정을 변경할 수 있습니다. 또한 이 도구는 각 이미지 매니페스트에 대한 로드 정보를 표시하고 이미지 매니페스트에 있는 각 이미지에 대한 원본 정보를 표시합니다. 이 도구는 다음과 같은 경우에 유용합니다.

  1. 오류 진단

  2. 사용자 지정 이미지 매니페스트에 특성이 올바르게 설정되었는지 확인

  3. Visual Studio 확장이 Visual Studio 스타일에 맞는 이미지를 사용할 수 있도록 Visual Studio 이미지 카탈로그에서 이미지 검색

Image Library Viewer Hero

이미지 모니커

이미지 모니커(줄여서 모니커)는 이미지 라이브러리에서 이미지 자산 또는 이미지 목록 자산을 고유하게 식별하는 GUID:ID 쌍입니다.

이미지 매니페스트 파일

이미지 매니페스트(.imagemanifest) 파일은 이미지 자산 집합, 해당 자산을 나타내는 모니커, 각 자산을 나타내는 실제 이미지를 정의하는 XML 파일입니다. 이미지 매니페스트는 레거시 UI 지원을 위해 독립 실행형 이미지 또는 이미지 목록을 정의할 수 있습니다. 또한 자산 또는 각 자산 뒤에 있는 개별 이미지에서 설정하여 이러한 자산이 표시되는 시기와 방법을 변경할 수 있는 특성이 있습니다.

이미지 매니페스트 스키마

전체 이미지 매니페스트는 다음과 같습니다.

<ImageManifest>
      <!-- zero or one Symbols elements -->
      <Symbols>
        <!-- zero or more Guid, ID, or String elements -->
      </Symbols>
      <!-- zero or one Images elements -->
      <Images>
        <!-- zero or more Image elements -->
      </Images>
      <!-- zero or one ImageLists elements -->
      <ImageLists>
        <!-- zero or more ImageList elements -->
      </ImageLists>
</ImageManifest>

Symbols

가독성 및 유지 관리 지원으로 이미지 매니페스트는 특성 값에 대한 기호를 사용할 수 있습니다. 기호는 다음과 같이 정의됩니다.

<Symbols>
      <Import Manifest="manifest" />
      <Guid Name="ShellCommandGuid" Value="8ee4f65d-bab4-4cde-b8e7-ac412abbda8a" />
      <ID Name="cmdidSaveAll" Value="1000" />
      <String Name="AssemblyName" Value="Microsoft.VisualStudio.Shell.UI.Internal" />
      <!-- If your assembly is strongly named, you'll need the version and public key token as well -->
      <!-- <String Name="AssemblyName" Value="Microsoft.VisualStudio.Shell.UI.Internal;v17.0.0.0;b03f5f7f11d50a3a" /> -->
</Symbols>
하위 요소 정의
가져오기 현재 매니페스트에서 사용할 지정된 매니페스트 파일의 기호를 가져옵니다.
GUID 기호는 GUID를 나타내며 GUID 서식과 일치해야 합니다.
ID 기호는 ID를 나타내며 음수 정수여야 합니다.
문자열 기호는 임의의 문자열 값을 나타냅니다.

기호는 대/소문자를 구분하며 $(symbol-name) 구문을 사용하여 참조됩니다.

<Image Guid="$(ShellCommandGuid)" ID="$(cmdidSaveAll)" >
      <Source Uri="/$(AssemblyName);Component/Resources/image.xaml" />
</Image>

일부 기호는 모든 매니페스트에 대해 미리 정의됩니다. <원본> 또는 <가져오기> 요소의 URI 속성에서 로컬 컴퓨터의 경로를 참조하는 데 사용할 수 있습니다.

기호 설명
CommonProgramFiles %CommonProgramFiles% 환경 변수의 값
LocalAppData %LocalAppData% 환경 변수의 값
ManifestFolder 매니페스트 파일이 포함된 폴더
MyDocuments 현재 사용자의 내 문서 폴더 전체 경로
ProgramFiles %ProgramFiles% 환경 변수의 값
시스템 Windows\System32 폴더
WinDir %WinDir% 환경 변수의 값

이미지

<이미지> 요소는 모니커에서 참조할 수 있는 이미지를 정의합니다. 함께 가져온 GUID 및 ID는 이미지 모니커를 구성합니다. 이미지의 모니커는 전체 이미지 라이브러리에서 고유해야 합니다. 둘 이상의 이미지에 지정된 모니커가 있는 경우 라이브러리를 빌드하는 동안 발생한 첫 번째 이미지가 유지됩니다.

원본을 하나 이상 포함해야 합니다. 크기 중립적 원본은 광범위한 크기에서 최상의 결과를 제공하지만 필수는 아닙니다. 서비스가 <이미지> 요소에 정의되지 않은 크기의 이미지를 요청하고 크기 중립적 원본이 없는 경우 서비스는 가장 적합한 크기별 원본을 선택하고 요청한 크기로 크기를 조정합니다.

<Image Guid="guid" ID="int" AllowColorInversion="true/false">
      <Source ... />
      <!-- optional additional Source elements -->
</Image>
Attribute 정의
Guid [필수] 이미지 모니커의 GUID 부분
ID [필수] 이미지 모니커의 ID 부분
AllowColorInversion [선택 사항, 기본값은 true] 어두운 배경에서 이미지를 사용할 때 프로그래밍 방식으로 색을 반전시킬 수 있는지 여부를 나타냅니다.

원본

<원본> 요소는 단일 이미지 원본 자산(XAML 및 PNG)을 정의합니다.

<Source Uri="uri" Background="background">
      <!-- optional NativeResource element -->
 </Source>
Attribute 정의
URI [필수] 이미지를 로드할 수 있는 위치를 정의하는 URI입니다. 다음 중 하나일 수 있습니다.

- application:/// 권한을 사용하는 팩 URI

- 절대 구성 요소 리소스 참조

- 네이티브 리소스를 포함하는 파일의 경로
배경 [선택 사항] 원본에서 사용할 배경의 종류를 나타냅니다.

다음 중 하나일 수 있습니다.

- Light: 원본을 밝은 배경에서 사용할 수 있습니다.

- Dark: 원본을 어두운 배경에서 사용할 수 있습니다.

- HighContrast: 고대비 모드의 모든 배경에서 원본을 사용할 수 있습니다.

- HighContrastLight: 고대비 모드의 밝은 배경에서 원본을 사용할 수 있습니다.

-HighContrastDark: 고대비 모드의 어두운 배경에서 원본을 사용할 수 있습니다.

Background 특성을 생략하면 어떤 백그라운드에서든 원본을 사용할 수 있습니다.

Background가 Light, Dark, HighContrastLight 또는 HighContrastDark인 경우 원본 색이 반전되지 않습니다. Background가 생략되거나 HighContrast로 설정된 경우 원본 색의 반전은 이미지의 AllowColorInversion 특성을 통해 제어됩니다.

<Source> 요소에는 다음과 같은 선택적 하위 요소 중 하나만 포함될 수 있습니다.

요소 특성(모두 필수) 정의
<크기> 값 원본은 지정된 크기의 이미지(디바이스 단위)에 사용됩니다. 이미지는 정사각형입니다.
<SizeRange> MinSize, MaxSize 원본은 MinSize에서 MaxSize(디바이스 단위)에 이르는 이미지에 포함됩니다. 이미지는 정사각형입니다.
<차원> 너비, 높이 원본은 지정된 너비 및 높이의 이미지(디바이스 단위)에 사용됩니다.
<DimensionRange> MinWidth, MinHeight,

MaxWidth, MaxHeight		 원본은 최소 너비/높이에서 최대 너비/높이(디바이스 단위)에 이르는 이미지에 사용됩니다.

<Source> 요소에는 관리되는 어셈블리가 아닌 네이티브 어셈블리에서 로드되는 <Source>를 정의하는 선택적 <NativeResource> 하위 요소가 있을 수도 있습니다.

<NativeResource Type="type" ID="int" />
Attribute 정의
형식 [필수] 네이티브 리소스의 형식(XAML 또는 PNG)
ID [필수] 네이티브 리소스의 정수 ID 부분

ImageList

<ImageList> 요소는 단일 스트립에서 반환할 수 있는 이미지 컬렉션을 정의합니다. 스트립은 필요에 따라 주문 시 빌드됩니다.

<ImageList>
      <ContainedImage Guid="guid" ID="int" External="true/false" />
      <!-- optional additional ContainedImage elements -->
 </ImageList>
Attribute 정의
Guid [필수] 이미지 모니커의 GUID 부분
ID [필수] 이미지 모니커의 ID 부분
외부 [선택 사항, 기본값은 false] 이미지 모니커가 현재 매니페스트의 이미지를 참조하는지 여부를 나타냅니다.

포함된 이미지의 모니커는 현재 매니페스트에 정의된 이미지를 참조할 필요가 없습니다. 이미지 라이브러리에서 포함된 이미지를 찾을 수 없는 경우 빈 자리 표시자 이미지가 해당 위치에 사용됩니다.

이 도구를 사용 하는 방법

사용자 지정 이미지 매니페스트 유효성 검사

사용자 지정 매니페스트를 만들려면 ManifestFromResources 도구를 사용하여 매니페스트를 자동으로 생성하는 것이 좋습니다. 사용자 지정 매니페스트의 유효성을 검사하려면 이미지 라이브러리 뷰어를 시작하고 파일 > 집합 경로...를 선택하여 디렉터리 검색 대화 상자를 엽니다. 이 도구는 검색 디렉터리를 사용하여 이미지 매니페스트를 로드하지만 이를 사용하여 매니페스트의 이미지를 포함하는 .dll 파일도 찾으므로, 이 대화 상자에서 매니페스트와 DLL 디렉터리를 모두 포함해야 합니다.

Image Library Viewer Search

추가...를 클릭하여 매니페스트 및 해당 DLL을 검색하기 위한 새 검색 디렉터리를 선택합니다. 이 도구는 이러한 검색 디렉터리를 기억하며 디렉터리를 선택하거나 선택 취소하여 설정하거나 해제할 수 있습니다.

기본적으로 이 도구는 Visual Studio 설치 디렉터리를 찾고 이러한 디렉터리를 검색 디렉터리 목록에 추가하려고 시도합니다. 도구에서 찾을 수 없는 디렉터리는 수동으로 추가할 수 있습니다.

사용자가 이미지 자산을 시각적으로 조사하여 여러 설정에 따라 올바르게 렌더링되었는지 확인할 수 있도록 모든 매니페스트가 로드된 다음, 이 도구를 사용하여 이미지에 대해 배경 색, DPI, 고대비 또는 회색조를 토글할 수 있습니다.

Image Library Viewer Background

배경색을 Light, Dark 또는 사용자 지정 값으로 설정할 수 있습니다. “사용자 지정 색”을 선택하면 색 선택 대화 상자가 열리고 나중에 쉽게 확인할 수 있도록 배경 콤보 상자 하단에 해당 사용자 지정 색이 추가됩니다.

Image Library Viewer Custom Color

이미지 모니커를 선택하면 오른쪽 이미지 세부 정보 창에서 해당 모니커 뒤에 각 실제 이미지에 대한 정보가 표시됩니다. 또한 이 창에서 사용자가 이름 또는 원시 GUID:ID 값으로 모니커를 복사할 수 있습니다.

Image Library Viewer Image Details

각 이미지 원본에 표시되는 정보에는 이를 표시할 배경 종류, 테마를 지정할 수 있는지 또는 고대비를 지원하는지 여부, 유효한 크기, 크기 중립적인지 여부 그리고 네이티브 어셈블리에서 이미지가 시작되는지 여부가 포함됩니다.

Image Library Viewer Can Theme

이미지 매니페스트의 유효성을 검사할 때 실제 위치에 매니페스트 및 이미지 DLL을 배포하는 것이 좋습니다. 이렇게 하면 모든 상대 경로가 올바르게 작동하는지 그리고 이미지 라이브러리가 매니페스트 및 이미지 DLL을 찾고 로드할 수 있는지 확인합니다.

이미지 카탈로그 KnownMonikers 검색

Visual Studio 스타일과 더 일치할 수 있도록 Visual Studio 확장은 자체 이미지를 만들고 사용하는 대신 Visual Studio 이미지 카탈로그에서 이미지를 사용할 수 있습니다. 이렇게 하면 이러한 이미지를 유지 관리할 필요가 없다는 이점이 있으며, Visual Studio에서 지원하는 모든 DPI 설정에서 올바르게 표시되도록 이미지에 높은 DPI 지원 미지가 사용되도록 보장합니다.

이미지 라이브러리 뷰어는 사용자가 이미지 자산을 나타내는 모니커를 찾고 이 모니커를 코드에 사용할 수 있도록 매니페스트 검색을 허용합니다. 이미지를 검색하려면 검색 상자에 원하는 검색어를 입력하고 Enter 키를 누릅니다. 하단의 상태 표시줄에는 모든 매니페스트에서 총 이미지 중 발견된 일치하는 항목 수가 표시됩니다.

Image Library Viewer Filter

기존 매니페스트에서 이미지 모니커를 검색할 때는 Visual Studio 이미지 카탈로그의 모니커, 기타 의도적으로 공개 액세스가 가능한 모니커 또는 자체 사용자 지정 모니커만 검색하고 사용하는 것이 좋습니다. 비공개 모니커를 사용할 경우 이러한 비공개 모니커 및 이미지가 변경되거나 업데이트될 경우 사용자 지정 UI가 손상되거나 이미지가 예기치 않은 방식으로 변경될 수 있습니다.

또한 GUID로 검색이 가능합니다. 이 유형의 검색은 단일 매니페스트로 목록을 필터링하거나 해당 매니페스트에 여러 GUID가 포함된 경우 매니페스트의 단일 하위 집합으로 목록을 필터링하는 데 유용합니다.

Image Library Viewer Filter GUID

마지막으로 ID로 검색도 가능합니다.

Image Library Viewer Filter ID

주의

  • 기본적으로 이 도구는 Visual Studio 설치 디렉터리에 있는 여러 이미지 매니페스트를 가져옵니다. 공개적으로 사용 가능한 모니커가 있는 유일한 매니페스트는 Microsoft.VisualStudio.ImageCatalog 매니페스트입니다. GUID: ae27a6b0-e345-4288-96df-5eaf394ee369(사용자 지정 매니페스트에서는 이 GUID를 재정의하지 않음) 유형: KnownMonikers

  • 이 도구는 시작 시 발견된 모든 이미지 매니페스트를 로드하려고 시도합니다. 따라서 애플리케이션이 실제로 표시되려면 몇 초 정도 걸릴 수 있습니다. 또한 매니페스트를 로드하는 동안 속도가 느려지거나 응답하지 않을 수도 있습니다.

샘플 출력

이 도구는 출력을 생성하지 않습니다.