【Unity】スクリーン座標とビューポート座標の違い

スクリーン座標とビューポート座標の違いがよく分からないの…

両者の違いについて図を示しながら解説していくね。

Unityにおけるスクリーン座標とビューポート座標は、どちらとも画面左下を原点とした画面上の座標系ですが、次のような違いがあります。

スクリーン座標
- 左下を(0, 0)、右上を(画面の幅, 画面の高さ)とした座標系
- １ピクセルを１（単位）とするため、解像度に依存する
ビューポート座標
- 左下を(0, 0)、右上を(1, 1)とした座標系
- 画面サイズを１（単位）とするため、解像度に依存しない

両者の座標系を図示すると、次のようになります。

スクリーン座標はピクセル単位での扱いが楽な分、画面解像度に依存するといった特徴があります。一方、ビューポート座標には画面解像度に依存しないといった特徴があります。

本記事では、スクリーン座標とビューポート座標の違いについて、実際にサンプルを示しながら解説していきます。また、両者の座標系の相互変換についても触れます。

この作品はユニティちゃんライセンス条項の元に提供されています

動作環境

Unity 2021.2.10f1

目次非表示

スクリーン座標
ビューポート座標
スクリーン座標からビューポート座標に変換する
ビューポート座標からスクリーン座標に変換する
さいごに
参考サイト

スクリーン座標

左下を(0, 0)、右上を(画面の幅, 画面の高さ)とした座標系です。

上図のようにマス目の左下を基準とした場合、右上のピクセルのスクリーン座標は(画面の幅 – 1, 画面の高さ – 1)となります。1を引く理由は、画面左下ピクセルのスクリーン座標が0始まりであるためです。

ピクセルのマス目の中心座標は端数が.5となることに注意する必要があります。

Unityでは、マウスカーソル位置などを扱う際に使用されます。

// マウスカーソルのスクリーン座標
var mousePosition = Input.mousePosition;

ビューポート座標

左下を(0, 0)、右上を(1, 1)とした座標系です。画面解像度に依存しない座標を扱いたい場合に便利です。

例えば、カメラの描画領域（Viewport Rect）の指定などで使われます。

スクリーン座標からビューポート座標に変換する

Camera.ScreenToViewportPoint()メソッドから変換できます。

public Vector3 ScreenToViewportPoint(Vector3 position);

Cameraインスタンスのメソッドであることに注意する必要があります（staticではありません）

引数には変換前のスクリーン座標を指定します。
戻り値は変換後のビューポート座標です。

実際の使い方は次のようになります。

// マウスカーソルのスクリーン座標
var mouseScreenPoint = Input.mousePosition;

// ビューポート座標に変換
var mouseViewportPoint = Camera.main.ScreenToViewportPoint(mouseScreenPoint);

ビューポート座標からスクリーン座標に変換する

Camera.ViewportToScreenPoint()メソッドから変換できます。

public Vector3 ViewportToScreenPoint(Vector3 position);

引数には変換前のビューポート座標を指定します。
戻り値は変換後のスクリーン座標です。

使い方は先と同じ要領です。

var mainCamera = Camera.main;

// 表示領域の中心点（ビューポート座標）取得
var centerViewportPoint = mainCamera.rect.center;

// スクリーン座標に変換
var centerScreenPoint = mainCamera.ViewportToScreenPoint(centerViewportPoint);