イメージ エディターImage Editor

このドキュメントでは、Visual StudioVisual Studio イメージ エディターを使用してテクスチャ リソースとイメージ リソースを表示および変更する方法について説明します。This document describes how to work with the Visual StudioVisual Studio Image Editor to view and modify texture and image resources.

イメージ エディターを使用すると、DirectX アプリの開発で使用される多様なテクスチャおよびイメージ形式を処理できます。DirectX がサポートする、人気のイメージ ファイル形式、色のエンコーディング、機能 (アルファ チャネル形式、MIP マッピング形式、高圧縮ハードウェア アクセラレータ テクスチャ形式など) もサポート対象になります。You can use the Image Editor to work with the kinds of rich texture and image formats that are used in DirectX app development—this includes support for popular image file formats and color encodings, features such as alpha-channels and MIP-mapping, and many of the highly-compressed, hardware-accelerated texture formats that DirectX supports.

サポートされる形式Supported formats

イメージ エディターは次のイメージ形式をサポートします。The Image Editor supports these image formats:

形式名Format name ファイル名の拡張子File Name Extension
ポータブル ネットワーク グラフィックス (PNG)Portable Network Graphics .png.png
JPEGJPEG .jpg、.jpeg、.jpe、.jfif.jpg, .jpeg, .jpe, .jfif
DirectDraw SurfaceDirect Draw Surface .dds.dds
グラフィックス インターチェンジ (GIF) 形式Graphics Interchange Format .gif.gif
ビットマップBitmap .bmp、.dib.bmp, .dib
TIFF 形式Tagged Image File Format .tif、.tiff.tif, .tiff
TGA (Targa)TGA (Targa) .tga.tga

作業の開始Getting started

ここではイメージを Visual StudioVisual Studio プロジェクトに追加し、要件に応じて構成する方法について説明します。This section describes how to add an image to your Visual StudioVisual Studio project and configure it for your requirements.

プロジェクトにイメージを追加するにはTo add an image to your project

  1. ソリューション エクスプローラーで、イメージを追加するプロジェクトのショートカット メニューを開き、[追加][新しい項目] の順にクリックします。In Solution Explorer, open the shortcut menu for the project that you want to add the image to, and then choose Add, New Item.

  2. [新しい項目の追加] ダイアログ ボックスで、[インストール済み][グラフィックス] を選択し、イメージの適切なファイル形式を選択します。In the Add New Item dialog box, under Installed, select Graphics, and then select an appropriate file format for the image. 要件に基づいてファイル形式を選択する方法については、次のセクションを参照してください。For information about how to choose a file format based on your requirements, see the following section.

  3. イメージ ファイルの [名前] を指定し、作成する [場所] を指定します。Specify the Name of the image file, and the Location where you want it to be created.

  4. [追加] ボタンをクリックします。Choose the Add button.

イメージ ファイル形式の選択Choosing the image format

イメージの用途によっては、特定のファイル形式が、他の形式より適切である場合があります。Depending on how you plan to use the image, certain file formats might be more appropriate than others. たとえば、形式によっては、透明度や特定の色形式など必要な機能がサポートされていない場合や、予定していたイメージ コンテンツの種類に適した圧縮がされていない場合があります。For example, some formats might not support a feature that you need—like transparency or a specific color format—or might not provide suitable compression for the kind of image content you have planned.

次の情報は、ニーズに応じたイメージ ファイル形式を選択するために役立ちます。The following information can help you choose an image format that meets your needs.

ビットマップ イメージ (.bmp)Bitmap Image (.bmp)
ビットマップ イメージ形式。The bitmap image format. 24 ビット カラーをサポートしている非圧縮イメージ形式。An uncompressed image format that supports 24-bit color. ビットマップ形式は透明度をサポートしていません。The bitmap format doesn't support transparency.

GIF イメージ (.gif)GIF Image (.gif)
GIF (グラフィックス インターチェンジ) イメージ形式。The Graphics Interchange Format (GIF) image format. 最大 256 色をサポートしている、LZW による可逆圧縮イメージ形式。An LZW-compressed, lossless image format that supports up to 256 colors. 色のディテールを大量に含んだ写真やイメージには適していませんが、カラー コヒーレンスの度合いが高いロー カラー イメージに対しては優れた圧縮比をもたらします。Unsuitable for photographs and images that have a significant amount of color detail, but provides good compression ratios for low-color images that have a high degree of color coherence.

JPG イメージ (.jpg)JPG Image (.jpg)
JPEG (Joint Photographic Experts Group) イメージ形式。The Joint Photographic Experts Group (JPEG) image format. 圧縮比の高い非可逆圧縮イメージ形式。24 ビット カラーをサポートし、カラー コヒーレンスの度合いが高いイメージの汎用圧縮に適しています。A highly-compressed, lossy image format that supports 24-bit color and is suitable for general-purpose compression of images that have a high degree of color coherence.

PNG イメージ (.png)PNG Image (.png)
PNG (ポータブル ネットワーク グラフィックス) イメージ形式。The Portable Network Graphics (PNG) image format. 圧縮比が中程度の可逆圧縮イメージ形式。24 ビット カラーとアルファ透明度をサポートしています。A moderately-compressed, lossless image format that supports 24-bit color and alpha transparency. 自然なイメージと人工的なイメージの両方に適していますが、圧縮比の点では JPG や GIF などの非可逆圧縮形式に劣ります。It is suitable for both natural and artificial images, but does not provide compression ratios as good as lossy formats such as JPG or GIF.

TIFF イメージ (.tif)TIFF Image (.tif)
TIFF または TIF イメージ形式。The Tagged Image File Format (TIFF or TIF) image format. 複数の圧縮スキームをサポートしている柔軟なイメージ形式。A flexible image format that supports several compression schemes.

DDS テクスチャ (.dds)DDS Texture (.dds)
DirectDraw Surface (DDS) テクスチャ形式。The DirectDraw Surface (DDS) texture format. 圧縮比の高い非可逆圧縮テクスチャ形式。24 ビット カラーとアルファ透明度をサポートしています。A highly-compressed, lossy texture format that supports 24-bit color and alpha transparency. 圧縮比は最大で 8:1 になる場合があります。Its compression ratios can be as high as 8:1. グラフィックス ハードウェアで圧縮解除できる、S3 テクスチャ圧縮に基づいています。It's based on S3 Texture compression, which can be decompressed on graphics hardware.

TGA イメージ (.tga)TGA Image (.tga)
TGA (Truevision Graphics Adapter) イメージ形式 (TARGA とも呼ばれます)。The Truevision Graphics Adapter (TGA) image format (also known as Targa). RLE による可逆圧縮イメージ形式。最大 24 ビット カラーとアルファ透明度を持つカラーマップ (カラー パレット) イメージとダイレクトカラー イメージの両方をサポートしています。An RLE-compressed, lossless image format that supports both color-mapped (color palette) or direct-color images of up to 24-bit color and alpha transparency. 色のディテールを大量に含んだ写真やイメージには適していませんが、スパンの長い同一カラーを持つイメージに対しては優れた圧縮比をもたらします。Unsuitable for photographs and images that have a significant amount of color detail, but provides good compression ratios for images that have long spans of identical colors.

イメージの構成Configuring the image

作成したイメージに対する操作を始める前に、そのイメージの既定の設定を変更できます。Before you begin to work with the image that you just created, you can change its default configuration. たとえば、使用する大きさや色形式を変更できます。For example, you can change its dimensions or the color format that it uses. イメージに関するこれらのプロパティおよびその他のプロパティを構成する方法については、「イメージのプロパティ」を参照してください。For information about how to configure these and other properties of the image, see Image properties.

注意

特定の色形式を使用する場合は、作業を保存する前に、[色形式] プロパティを設定してください。Before you save your work, make sure to set the Color Format property if you want to use a specific color format. 圧縮をサポートするファイル形式の場合は、ファイルを初めて保存するときか、[名前を付けて保存] を選択したときに圧縮の設定を調整できます。If the file format supports compression, you can adjust the compression settings when you save the file for the first time or when you choose Save As.

イメージ エディターを使用するWorking with the Image Editor

このセクションでは、イメージ エディターを使用してテクスチャやイメージを変更する方法について説明します。This section describes how to use the Image Editor to modify textures and images.

イメージ エディターのツール バーImage Editor toolbars

イメージ エディターのツール バーには、イメージの処理に役立つコマンドがあります。The Image Editor toolbars contain commands that help you work with images.

イメージ エディターの状態に影響を与えるコマンドは、高度なコマンドと共に、[イメージ エディターのモード] ツール バーにあります。Commands that affect the state of the Image Editor are located on the Image Editor Mode toolbar together with advanced commands. このツール バーは、イメージ エディターのデザイン サーフェイスの上端にあります。The toolbar is located along the topmost edge of the Image Editor design surface. 描画ツールは、イメージ エディターのデザイン サーフェイス左端の [イメージ エディター] ツール バーにあります。Drawing tools are located on the Image Editor toolbar along the leftmost edge of the Image Editor design surface.

[イメージ エディターのモード] ツール バーを次に示します。Here's the Image Editor Mode toolbar:

イメージ エディターのモーダル ツール バー。The Image Editor modal toolbar.

次の表は、[イメージ エディターのモード] ツール バーに、左から右へ順に表示される項目を示します。This table describes the items on the Image Editor Mode toolbar, which are listed in the order in which they appear from left to right.

ツール バーの項目Toolbar Item 説明Description
選択Select イメージの四角形の領域を選択できます。Enables selection of a rectangular region of an image. 領域の選択後、その領域を切り取り、コピー、移動、拡大縮小、回転、反転、または削除できます。After you select a region, you can cut, copy, move, scale, rotate, flip, or delete it. アクティブな選択範囲がある場合、その選択された領域で機能するのは図形描画ツールのみです。When there is an active selection, drawing tools only affect the selected region.
不規則選択Irregular Selection イメージの不規則な領域を選択できます。Enables selection of an irregular region of an image. 領域の選択後、その領域を切り取り、コピー、移動、拡大縮小、回転、反転、または削除できます。After you select a region, you can cut, copy, move, scale, rotate, flip, or delete it. アクティブな選択範囲がある場合、その選択された領域で機能するのは図形描画ツールのみです。When there is an active selection, drawing tools only affect the selected region.
杖選択Wand Selection イメージの同系色の領域を選択できます。Enables selection of a similarly-colored region of an image. 許容値 (同系色と見なされる範囲内での隣接する色の最大差の値) は、狭いまたは広い同系色範囲を含めるように構成できます。The tolerance—that is, the maximum difference between adjacent colors within which they are considered similar—can be configured to include a smaller or wider range of similar colors. 領域の選択後、その領域を切り取り、コピー、移動、拡大縮小、回転、反転、または削除できます。After you select a region, you can cut, copy, move, scale, rotate, flip, or delete it. アクティブな選択範囲がある場合、その選択された領域で機能するのは図形描画ツールのみです。When there is an active selection, drawing tools only affect the selected region.
パンPan ウィンドウ フレームに応じてイメージを移動できます。Enables movement of the image relative to the window frame. [パン] モードでは、イメージのポイントを選択してポイントを動かします。In Pan mode, select a point on the image and then move it around.

Ctrl キー長押しすると、[パン] モードを一時的にアクティブにできます。You can temporarily activate Pan mode by pressing and holding the Ctrl key.
ズームZoom ウィンドウ フレームに応じてイメージを拡大または縮小表示できます。Enables the display of more or less image detail relative to the window frame. [ズーム] モードで、イメージのポイントを選択し、右または下へ移動して拡大表示するか、左または上へ移動して縮小表示します。In Zoom mode, select a point on the image and then move it right or down to zoom in, or left or up to zoom out.

マウス ホイールを使用するか、正符号 (+) または負符号 (-) 押しながら Ctrl キーを長押しすると、拡大または縮小できます。You can zoom in or out by pressing and holding Ctrl while you either use the mouse wheel or press the Plus Sign (+) or Minus Sign (-).
実際のサイズに大きさを変更Zoom to Actual Size イメージ ピクセルと画面ピクセルの 1:1 の関係を使用してイメージを表示します。Displays the image by using a 1:1 relationship between the pixels of the image and the pixels of the screen.
ウィンドウのサイズに合わせて大きさを変更Zoom To Fit ウィンドウ フレームにイメージ全体を表示します。Displays the full image in the window frame.
幅に合わせて大きさを変更Zoom To Width ウィンドウ フレームにイメージの全幅を表示します。Displays the full width of the image in the window frame.
グリッドGrid ピクセルの境界を示すグリッドを有効または無効にします。Enables or disables the grid that shows pixel boundaries. イメージを拡大しないとグリッドが表示されないことがあります。The grid might not appear until you zoom into the image.
次の MIPMAP レベルを表示View Next MIP Level MIP マップ チェーン内の次に大きい MIPMAP レベルをアクティブにします。Activates the next larger MIP level in a MIP map chain. デザイン サーフェイスにアクティブな MIPMAP レベルが表示されます。The active MIP level is displayed on the design surface. この項目は MIPMAP レベルがあるテクスチャに対してのみ使用できます。This item is only available for textures that have MIP levels.
前の MIPMAP レベルを表示View Previous MIP Level MIP マップ チェーン内の次に小さい MIPMAP レベルをアクティブにします。Activates the next smaller MIP level in a MIP map chain. デザイン サーフェイスにアクティブな MIPMAP レベルが表示されます。The active MIP level is displayed on the design surface. この項目は MIPMAP レベルがあるテクスチャに対してのみ使用できます。This item is only available for textures that have MIP levels.
赤チャネルRed Channel

緑チャネルGreen Channel

青チャネルBlue Channel

アルファ チャネルAlpha Channel
特定のカラー チャネルを有効または無効にします。Enables or disables the specific color channel. 注記: カラー チャネルを体系的に有効または無効にすると、1 つまたは複数のカラー チャネルに関連する問題を特定できます。Note: By systematically enabling or disabling color channels, you can isolate problems that are related to one or more of them. たとえば、誤ったアルファ透明度を特定できる場合があります。For example, you could identify incorrect alpha transparency.
背景Background 画像の透明な部分での背景表示を有効または無効にします。Enables or disables display of the background through transparent parts of the image. 背景の表示方法は、次のオプションを選択して構成できます。You can configure how the background is displayed by choosing from these options:

[チェッカーボード]Checkerboard
緑色と指定された背景色で、背景をチェッカーボード パターンとして表示します。Uses a green color together with the specified background color to display the background as a checkerboard pattern. このオプションを使用すると、イメージの透明な部分が明確になります。You can use this option to help make transparent parts of the image more apparent.

[背景を白にする]White Background
背景を白色で表示します。Uses the color white to display the background.

[背景を黒にする]Black Background
背景を黒色で表示します。Uses the color black to display the background.

[背景のアニメーション]Animate Background
チェッカーボード パターンを低速でパンします。Pans the checkerboard pattern slowly. このオプションを使用すると、イメージの透明な部分が明確になります。You can use this option to help make transparent parts of the image more apparent.
プロパティProperties [プロパティ] ウィンドウを表示または非表示にします。Alternately opens or closes the Properties window.
詳細設定Advanced 追加のコマンドとオプションがあります。Contains additional commands and options.

フィルターFilters

一般的なイメージ フィルターがいくつかあります。[白黒][ぼかし][輝度][暗][境界の検出][エンボス][色の反転][水面][セピア調]、および [シャープネス] の 10 種類です。Provides several common image filters: Black and White, Blur, Brighten, Darken, Edge Detection, Emboss, Invert Colors, Ripple, Sepia Tone, and Sharpen.

グラフィックス エンジンGraphics Engines

D3D11 で描画Render with D3D11
Direct3D 11 を使用してイメージ エディターのデザイン サーフェイスを描画します。Uses Direct3D 11 to render the Image Editor design surface.

[D3D11WARP で描画]Render with D3D11WARP
Direct3D 11 Windows Advanced Rasterization Platform (WARP) を使用してイメージ エディターのデザイン サーフェイスを描画します。Uses Direct3D 11 Windows Advanced Rasterization Platform (WARP) to render the Image Editor design surface.

ツールTools

[左右反転]Flip Horizontal
イメージを水平方向または x 軸上で入れ替えます。Transposes the image around its horizontal, or x, axis.

[上下反転]Flip Vertical
イメージを垂直方向または y 軸上で入れ替えます。Transposes the image around its vertical, or y, axis.

MIPS の生成Generate Mips
イメージの MIPMAP レベルを生成します。Generates MIP levels for an image. MIPMAP レベルが既に存在する場合は、最大の MIPMAP レベルで再作成されます。If MIP levels already exist, they are recreated from the largest MIP level. 小さい MIPMAP レベルに対して行われた変更内容はすべて失われます。Any changes that were made to smaller MIP levels are lost. 生成した MIPMAP レベルを保存するには、.dds 形式でイメージを保存する必要があります。To save the MIP levels that you have generated, you must use the .dds format to save the image.

表示View

フレーム レートFrame Rate
有効にすると、デザイン サーフェイスの右上の隅にフレーム レートが表示されます。When enabled, displays the frame rate in the upper-right corner of the design surface. フレーム レートは、1 秒あたりの描画フレーム数です。The frame rate is the number of frames that are drawn per second. ヒント: [詳細設定] ボタンを選択すると、最後のコマンドを再実行できます。Tip: You can choose the Advanced button to run the last command again.

[イメージ エディター] ツール バーを次に示します。Here's the Image Editor toolbar.

イメージ エディターのツール バーImage Editor toolbar

次の表では、[イメージ エディター] ツール バーに、上から下へ順に表示される項目について説明します。The following table describes the items on the Image Editor toolbar, which are listed in the order in which they appear from top to bottom.

ツール バーの項目Toolbar Item 説明Description
鉛筆Pencil アクティブな色選択を使用してエイリアス ストロークを描画します。Uses the active color selection to draw an aliased stroke. ストロークの色と太さは、[プロパティ] ウィンドウで設定できます。You can set the color and thickness of the stroke in the Properties window.
ブラシBrush アクティブな色選択を使用してアンチエイリアス ストロークを描画します。Uses the active color selection to draw an anti-aliased stroke. ストロークの色と太さは、[プロパティ] ウィンドウで設定できます。You can set the color and thickness of the stroke in the Properties window.
エアブラシAirbrush アクティブな色選択を使用してイメージと調和させるアンチエイリアス ストロークを描画し、時間に応じてより浸透します。Uses the active color selection to draw an anti-aliased stroke that blends together with the image and becomes more saturated as a function of time. ストロークの色と太さは、[プロパティ] ウィンドウで設定できます。You can set the color and thickness of the stroke in the Properties window.
スポイトEyedropper アクティブな色選択を選択したピクセルの色に設定します。Sets the active color selection to the color of the selected pixel.
塗りつぶしFill アクティブな色選択を使用してイメージの特定の領域を塗りつぶします。Uses the active color selection to fill a region of the image. 影響を受ける領域は、同色のピクセルによって関連付けられているピクセルと、色が同一のピクセルそのものと一緒に、塗りつぶしが適用されるピクセルとして定義されます。The affected region is defined as the pixel where the fill is applied, together with every pixel that is connected to it by pixels of the same color and that is the same color itself. アクティブな選択範囲で塗りつぶしが適用されると、影響を受ける領域は、その選択範囲によって制限されます。If the fill is applied within an active selection, then the affected region is constrained by the selection.

既定では、アクティブな色選択範囲は、アルファ要素に応じてイメージの影響を受ける領域と共に調和されます。By default, the active color selection is blended together with the affected region of the image according to its alpha component. アクティブな色選択範囲を使用して影響を受ける領域を上書きするには、塗りつぶしツールを使用しながら Shift キーを長押しします。To use the active color selection to overwrite the affected region, press and hold the Shift key when you use the fill tool.
消しゴムEraser イメージがアルファ チャネルをサポートする場合は、ピクセルに完全に透明な色を設定します。Sets pixels to the fully transparent color if the image supports an alpha channel. それ以外の場合は、アクティブな背景色に設定します。Otherwise, sets the pixels to the active background color.
[ライン][四角形][角丸四角形][楕円]Line, Rectangle, Rounded Rectangle, Ellipse イメージに図形を描画します。Draws a shape on the image. アウトラインの色と太さは、[プロパティ] ウィンドウで設定できます。You can set the color and thickness of the outline in the Properties window.

幅と高さが等しいプリミティブを描画するには、描画しながら Shift キーを長押しします。To draw a primitive that has equal width and height, press and hold Shift as you draw.
テキストText 前景色の選択範囲を使用してテキストを描画します。Uses the foreground color selection to draw text. 背景色は、背景色の選択によって決定されます。The background color is determined by the background color selection. 透明な背景の場合、背景色の選択範囲のアルファ値を 0 にする必要があります。For a transparent background, the alpha value of the background color selection must be 0. テキスト領域がアクティブなときには、[プロパティ] ウィンドウで、アンチエイリアス ストロークでテキスト描画できるかどうかを設定したり、テキストの [値][フォント][サイズ]、およびスタイル ([太字][斜体]、または [下線]) を設定したりできます。While the text region is active, you can set whether the text is drawn with an anti-aliased stroke, and you can set the text Value, Font, Size, and style—Bold, Italics, or Underlined—in the Properties window. テキストの内容と外観は、テキスト領域がアクティブにならなくなったときに最終処理されます。The content and appearance of the text is finalized when the text region is no longer active.
回転Rotate イメージを時計回りに 90 度回転させます。Rotates the image 90 degrees clockwise.
トリミングTrim アクティブな選択範囲にイメージをトリミングします。Trims the image to the active selection.

MIPMAP レベルの操作Working with MIP levels

DirectDraw Surface (.dds) などの一部のイメージ形式では、テクスチャ空間詳細レベル (LOD) の MIPMAP レベルがサポートされます。Some image formats—for example, DirectDraw Surface (.dds)—support MIP levels for texture-space Level-of-Detail (LOD). MIPMAP レベルの生成方法と操作方法の詳細については、「方法: MIP レベルを作成および変更する」を参照してください。For information about how to generate and work with MIP levels, see How to: Create and Modify MIP Levels

透明度の操作Working with transparency

DirectDraw Surface (.dds) などの一部のイメージ形式では透明度がサポートされます。Some image formats—for example, DirectDraw Surface (.dds)—support transparency. 使用するツールに応じて、透明度を使用できる方法がいくつかあります。There are several ways that transparency can be used, depending on the tool that you are using. 色の選択で透明度のレベルを指定するには、[プロパティ] ウィンドウで、色の選択の A (アルファ) 要素を選択します。To specify the level of transparency for a color selection, in the Properties window, set the A (alpha) component of the color selection. さまざまな種類のツールで透明度の適用を制御する方法を次に示します。Here's how different kinds of tools control how transparency is applied:

ツールTool 説明Description
鉛筆ブラシエアブラシライン四角形角丸四角形楕円テキストPencil, Brush, Airbrush, Line, Rectangle, Rounded Rectangle, Ellipse, Text アクティブな色の選択をイメージと調和させるには、[プロパティ] ウィンドウで [チャネル] プロパティ グループを展開し、[アルファ] チャネルの [描画] チェック ボックスをオンにして、通常どおり描画します。To blend the active color selection together with the image, in the Properties window, expand the Channels property group and set the Draw checkbox on the Alpha channel, and then draw normally.

アクティブな色の選択を使用して描画し、イメージのアルファ値をそのまま維持するには、[アルファ] チャネルの [描画] チェック ボックスをオフにします。To draw by using the active color selection and leave the alpha value of the image in place, clear the Draw checkbox of the Alpha channel, and then draw normally.
塗りつぶしFill アクティブな色の選択をイメージと調和させるには、塗りつぶす領域を選択します。To blend the active color selection together with the image, just choose the area to fill.

アルファ チャネルの値を含め、アクティブな色の選択を使用してイメージを上書きするには、Shift キーを長押しして塗りつぶす領域を選択します。To use the active color selection—including the value of the alpha channel—to overwrite the image, press and hold Shift and then choose the area to fill.

イメージのプロパティImage properties

イメージのさまざまなプロパティを指定するには、[プロパティ] ウィンドウを使用します。You can use the Properties window to specify various properties of the image. たとえば、イメージのサイズを変更するには、[幅] プロパティと [高さ] プロパティを設定します。For example, you can set the Width and Height properties to resize the image.

次の表では、イメージのプロパティについて説明します。The following table describes image properties.

プロパティProperty 説明Description
Width イメージの幅。The width of the image.
高さHeight イメージの高さ。The height of the image.
ピクセルあたりのビット数Bits Per Pixel 各ピクセルを表すビット数。The number of bits that represent each pixel. このプロパティの値は、イメージの色形式によって異なります。The value of this property depends on the Color Format of the image.
透明の選択Transparent Selection 選択範囲のレイヤーのアルファ値に基づいて、選択範囲のレイヤーをメインのイメージと調和させる場合は True。それ以外の場合は FalseTrue to blend the selection layer together with the main image, based on the alpha value of the selection layer; otherwise, False. この項目はアルファをサポートするイメージに対してのみ使用できます。This item is only available for images that support alpha.
形式Format イメージの色形式。The color format of the image. イメージの形式に応じて、さまざまな色形式を指定できます。A variety of color formats can be specified, depending on the image format. 色形式はイメージに含まれるカラー チャネルの数と種類、さらに、さまざまなチャネルのサイズとエンコードも定義します。The color format defines the number and kind of color channels that are included in the image, and also the size and encoding of various channels.
MIPMAP レベルMip Level アクティブな MIPMAP レベル。The active MIP level. この項目は MIPMAP レベルがあるテクスチャに対してのみ使用できます。This item is only available for textures that have MIP levels.
MIPMAP レベル数Mip Level Count イメージ内の MIPMAP レベルの総数。The total number of MIP levels in the image. この項目は MIPMAP レベルがあるテクスチャに対してのみ使用できます。This item is only available for textures that have MIP levels.
フレーム数Frame Count イメージ内のフレームの総数。The total number of frames in the image. この項目はテクスチャ配列をサポートするイメージに対してのみ使用できます。This item is only available for images that support texture arrays.
フレームFrame 現在のフレーム。The current frame. 最初のフレームのみ表示できます。その他のフレームはイメージを保存するとすべて失われます。Only the first frame can be viewed; all other frames are lost when the image is saved.
深度スライス数Depth Slice Count イメージ内の深度スライスの総数。The total number of depth slices in the image. この項目はボリューム テクスチャをサポートするイメージに対してのみ使用できます。This item is only available for images that support volume textures.
深度スライスDepth Slice 現在の深度スライス。The current depth slice. 最初のスライスのみ表示できます。その他のスライスはイメージを保存するとすべて失われます。Only the first slice can be viewed; all other slices are lost when the image is saved.

注意

[回転の角度] プロパティは、すべてのツールと選択した領域に適用されるため、他のツール プロパティと共に [プロパティ] ウィンドウの下部に常に表示されます。Because the Rotate by property applies to all tools and selected regions, it always appears at the bottom of the Properties window together with other tool properties. [回転の角度] が常に表示されるのは、他のオプションまたはアクティブなツールがない場合はイメージ全体が暗黙的に選択されるためです。Rotate by is always displayed because the whole image is implicitly selected when there is no other selection or active tool. [回転の角度] プロパティの詳細については、「ツールのプロパティ」を参照してください。For more information about the Rotate by property, see Tool Properties.

イメージのサイズ変更Resizing images

イメージのサイズを変更する方法は 2 つあります。Here are two ways to resize an image. いずれの場合も、イメージ エディターで双一次補間を使用してイメージの縦横比を調整します。In both cases, the Image Editor uses bi-linear interpolation to resample the image.

  • [プロパティ] ウィンドウの [幅][高さ] の各プロパティに新しい値を指定します。In the Properties window, specify new values for the Width and Height properties.

  • イメージ全体を選択し、境界線のマーカーを使用してイメージの縦横比を調整します。Select the entire image and use the border markers to resize the image.

ツールの操作Working with tools

選択された領域Selected regions

イメージ エディターの選択範囲は、アクティブなイメージの領域を定義します。つまり、この領域はツールと変換の影響を受けます。Selections in the Image Editor define regions of the image that are active—that is, the region will be affected by tools and transformations. アクティブな選択範囲がある場合、その選択された領域の外側にある領域は大部分のツールと変換の影響を受けません。When there is an active selection, areas outside the selected region are not affected by most tools and transformations. アクティブな選択範囲がない場合は、イメージ全体がアクティブになります。If there is not an active selection, the entire image is active.

大部分のツール ([鉛筆][ブラシ][エアブラシ][塗りつぶし][消しゴム]、2-D プリミティブおよび変換のための [回転][トリミング][色の反転][左右反転][上下反転]) は、アクティブな選択範囲によって制限または定義されます。Most tools—Pencil, Brush, Airbrush, Fill, Eraser, and 2-D primitives—and transformations—Rotate, Trim, Invert Colors, Flip Horizontal, and Flip Vertical—are constrained or defined by the active selection. ただし、一部のツール ([スポイト][テキスト]) と変換のための [MIPS の生成] はアクティブな選択範囲の影響を受けません。これらのツールは、イメージ全体がアクティブな選択範囲になっているときはいつもどおりに機能します。However, some tools—Eyedropper and Text—and transformations—Generate Mips—are not affected by any active selection; these tools always behave as if the entire image is the active selection.

領域を選択する場合、Shift キーを長押しして均整の取れた (四角形の) 選択範囲を作成します。そうしないと選択範囲が制限されません。While you are selecting a region, you can press and hold Shift to make a proportional (square) selection; otherwise, the selection is not constrained.

選択範囲のサイズ変更Resizing selections

領域の選択後、選択範囲のマーカーのサイズを変更すると、領域のサイズを変更したり画像のコンテンツを変更したりすることができます。After you select a region, you can resize it or its image contents by changing the size of the selection marker. 選択した領域のサイズを変更する際に、次の修飾子キーを使用して、選択した領域に対する動作を変更できます (キーを押しながらサイズを変更します)。While you are resizing the selected region, you can use the following modifier keys to change the behavior of the selected region as you resize it (press and hold the key as you resize).

CtrlCtrl
サイズを変更する前に、選択された領域のコンテンツをコピーします。Copies the contents of the selected region before it's resized. これにより、元のイメージは変更せずに、コピーのサイズを変更できます。This leaves the original image intact while the copy is resized.

シフトShift
選択した領域のサイズを、元のサイズに比例して変更します。Resizes the selected region in proportion to its original size.

AltAlt
選択した領域のサイズを変更します。Changes the size of the selection region. この場合、イメージは変更されません。This leaves the image unmodified.

有効な修飾子キーの組み合わせを次に示します。Here are the valid modifier key combinations:

CtrlCtrl シフトShift AltAlt 説明Description
選択された領域のコンテンツのサイズを変更します。Resizes the content of the selected region.
シフトShift 選択された領域のコンテンツのサイズを均等に変更します。Proportionally resizes the content of the selected region.
AltAlt 選択した領域のサイズを変更します。Resizes the selected region. 新しい選択領域が定義されます。This defines a new selection region.
シフトShift AltAlt 選択された領域のサイズを均等に変更します。Proportionally resizes the selected region. 新しい選択領域が定義されます。This defines a new selection region.
CtrlCtrl 選択された領域のコンテンツをコピーしてサイズを変更します。Copies and then resizes the content of the selected region.
CtrlCtrl シフトShift 選択された領域のコンテンツをコピーしてサイズを均等に変更します。Copies and then proportionally resizes the content of the selected region.

ツール プロパティTool Properties

ツールが選択された状態で、[プロパティ] ウィンドウを使用すると、イメージへの影響についての詳細を指定できます。While a tool is selected, you can use the Properties window to specify details about how it affects the image. たとえば、鉛筆ツールの太さやブラシ ツールの色を設定できます。For example, you can set the thickness of the Pencil tool or the color of the Brush tool.

前景色と背景色の両方を設定できます。You can set both a foreground color and a background color. ユーザー定義の不透明度を指定するアルファ チャネルが両方でサポートされます。Both support an alpha channel to provide user-defined opacity. 設定内容がすべてのツールに適用されます。The settings apply to all tools. マウスを使用する場合、マウスの左ボタンは前景色に、右ボタンは背景色に対応します。If you use a mouse, the left mouse button corresponds to the foreground color, and the right mouse button corresponds to the background color.

次の表では、ツールのプロパティについて説明します。The following table describes tool properties.

ツールTool プロパティProperties
すべてのツールと選択範囲All tools and selections 回転の角度Rotate by
選択範囲またはツールの効果が時計回り方向で回転する角度を定義します。Defines the amount, in degrees, that the selection or tool effect is rotated in the clockwise direction.
鉛筆ブラシエアブラシ消しゴムPencil, Brush, Airbrush, Eraser 太さThickness
ツールによって影響を受ける領域のサイズを定義します。Defines the size of the area that is affected by the tool.
テキストText アンチエイリアスAnti-alias
端がアンチエイリアス化されたテキストを描画します。Draws text that has anti-aliased edges. テキストがより滑らかな外観になります。This gives text a smoother appearance.

Value
描画されるテキスト。The text to be drawn.

フォントFont
テキストの描画に使用するフォント。The font used to draw the text.

SizeSize
テキストのサイズ。The size of the text.

太字Bold
フォントを太字にします。Makes the font bold.

斜体Italics
フォントを斜体にします。Makes the font italic.

下線Underlined
フォントを下線付きにします。Makes the font underlined.
2-D プリミティブ2-D Primitive アンチエイリアスAnti-alias
端がアンチエイリアス化されたプリミティブを描画します。Draws primitives that have anti-aliased edges. プリミティブがより滑らかな外観になります。This gives them a smoother appearance.

太さThickness
プリミティブの境界を形成する線の太さを定義します。Defines the thickness of the line that forms the boundary of the primitive.

半径 XRadius X
(角丸四角形のみ) プリミティブの上端と下端に丸め半径を定義します。(Rounded rectangle only) Defines the rounding radius for the top and bottom edges of the primitive.

半径 YRadius Y
(角丸四角形のみ) プリミティブの左端と右端に丸め半径を定義します。(Rounded rectangle only) Defines the rounding radius for the left and right edges of the primitive.
鉛筆ブラシエアブラシ2-D プリミティブPencil, Brush, Airbrush, 2-D Primitive チャネルChannels
表示と描画のための特定のカラー チャネルを有効または無効にします。Enables or disables specific color channels for viewing and drawing. 特定のカラー チャネルで [表示] が設定されていると、イメージにそのチャネルが表示されます。それ以外の場合は表示されません。If View is set for a specific color channel, that channel is visible in the image; otherwise, it is not visible. 特定のカラー チャネルで [描画] が設定されていると、該当のチャネルは描画操作の影響を受けます。それ以外の場合は影響を受けません。If Draw is set for a specific color channel, that channel is affected by drawing operations; otherwise, it is not.
杖選択塗りつぶしWand Selection, Fill 許容値Tolerance
類似性が低い色でも、同系色でも影響を受ける領域や選択された領域の一部となるように、隣接する色が同系色と見なされる範囲の最大差を定義します。Defines the maximum difference between adjacent colors within which they are considered similar, so that fewer or more similar colors are made a part of the affected or selected region. 既定値は 32 です。つまり、元の色の 32 段階の陰影 (濃淡) 内で隣接しているピクセルは、その領域の一部と見なされることを意味しています。By default, the value is 32, which means that adjacent pixels within 32 shades (lighter or darker) of the original color are considered to be part of the region.

キーボード ショートカットKeyboard shortcuts

コマンドCommand キーボード ショートカットKeyboard shortcuts
[選択] モードに切り替えSwitch to Select mode SS
[ズーム] モードに切り替えSwitch to Zoom mode ZZ
[パン] モードに切り替えSwitch to Pan mode KK
すべて選択Select all Ctrl + ACtrl+A
現在の選択範囲を削除します。Delete the current selection 削除Delete
現在の選択を取り消します。Cancel the current selection エスケープ特殊文字Escape
拡大表示Zoom in Ctrl + マウス ホイール前方移動Ctrl+Mouse wheel forward

Ctrl + PageUp キーCtrl+PageUp

プラス記号 (+)Plus Sign (+)
ズーム アウトZoom out Ctrl + マウス ホイール後方移動Ctrl-Mouse wheel backward

Ctrl + PageDown キーCtrl-PageDown

マイナス記号 (-)Minus Sign (-)
イメージを上方向へパンするPan the image up マウス ホイール後方移動Mouse wheel backward

PageDownPageDown
イメージを下方向へパンするPan the image down マウス ホイール前方移動Mouse wheel forward

PageUpPageUp
イメージを左方向へパンするPan the image left Shift + マウス ホイール後方移動Shift+Mouse wheel backward

マウス ホイール左Mouse wheel left

Shift + PageDownShift+PageDown
イメージを右方向へパンするPan the image right Shift + マウス ホイール前方移動Shift+Mouse wheel forward

マウス ホイール右Mouse wheel right

Shift + PageUpShift+PageUp
実際のサイズに大きさを変更Zoom to actual size Ctrl + 0 (ゼロ)Ctrl+0 (zero)
イメージをウィンドウに合わせるFit image to window Ctrl + G、Ctrl + FCtrl+G, Ctrl+F
イメージをウィンドウの幅に合わせるFit image to window width Ctrl + G、Ctrl + ICtrl+G, Ctrl+I
グリッドを切り替えるToggle grid Ctrl + G、Ctrl + GCtrl+G, Ctrl+G
イメージを現在の選択範囲にトリミングするCrop image to current selection Ctrl + G、Ctrl + CCtrl+G, Ctrl+C
次の (詳細な) MIPMAP レベルを表示するView next (higher detail) MIP level Ctrl + G、Ctrl + 6Ctrl+G, Ctrl+6
前の (詳細ではない) MIPMAP レベルを表示するView previous (lower detail) MIP level Ctrl + G、Ctrl + 7Ctrl+G, Ctrl+7
赤色のチャネルを切り替えるToggle red color channel Ctrl + G、Ctrl + 1Ctrl+G, Ctrl+1
緑色のチャネルを切り替えるToggle green color channel Ctrl + G、Ctrl + 2Ctrl+G, Ctrl+2
青色のチャネルを切り替えるToggle blue color channel Ctrl + G、Ctrl + 3Ctrl+G, Ctrl+3
アルファ (透明度) チャネルを切り替えるToggle alpha (transparency) channel Ctrl + G、Ctrl + 4Ctrl+G, Ctrl+4
アルファ チェッカーボード パターンを切り替えるToggle alpha checkerboard pattern Ctrl + G、Ctrl + BCtrl+G, Ctrl+B
不規則選択ツールに切り替えるSwitch to irregular selection tool LL
杖選択ツールに切り替えるSwitch to wand selection tool MM
鉛筆ツールに切り替えるSwitch to pencil tool PP
ブラシ ツールに切り替えるSwitch to brush tool BB
塗りつぶしツールに切り替えるSwitch to fill tool FF
消しゴム ツールに切り替えるSwitch to eraser tool EE
テキスト ツールに切り替えるSwitch to text tool TT
色選択 (スポイト) ツールに切り替えるSwitch to color-select (eyedropper) tool II
アクティブな選択範囲とそのコンテンツを移動するMove the active selection, and its contents. 方向キーArrow keys.
アクティブな選択範囲とそのコンテンツのサイズを変更するResize the active selection, and its contents. Ctrl + 方向キーCtrl+Arrow keys
アクティブな選択範囲を移動するが、そのコンテンツは移動しないMove the active selection, but not its contents. Shift + 方向キーShift+Arrow keys
アクティブな選択範囲のサイズを変更するが、そのコンテンツのサイズは変更しないResize the active selection, but not its contents. Shift + Ctrl + 方向キーShift+Ctrl+Arrow keys
現在のレイヤーをコミットするCommit the current layer リターンReturn
ツールの幅を狭くするDecrease tool thickness [[
ツールの幅を広くするIncrease tool thickness ]]
タイトルTitle 説明Description
ゲームとアプリ用の 3-D アセットの操作Working with 3-D Assets for Games and Apps テクスチャ、イメージ、3-D モデル、シェーダー効果などのグラフィックス アセットを処理するために Visual StudioVisual Studio で使用できるツールの概要について説明します。Provides an overview of the tools that you can use in Visual StudioVisual Studio to work with graphics assets such as textures and images, 3-D models, and shader effects.
モデル エディターModel Editor Visual StudioVisual Studio モデル エディターを使用して 3-D モデルを操作する方法について説明します。Describes how to use the Visual StudioVisual Studio Model Editor to work with 3-D models.
シェーダー デザイナーShader Designer Visual StudioVisual Studio シェーダー デザイナーを使用してシェーダーを操作する方法について説明します。Describes how to use the Visual StudioVisual Studio Shader Designer to work with shaders.