facebook twitter hatena line email

「Unity/おすすめアセット/SafeAreaHelper」の版間の差分

提供: 初心者エンジニアの簡易メモ
移動: 案内検索
(SafeAreaHelperの対応方法)
(GooglePixel5で下の部分が適用されてない)
 
(同じ利用者による、間の4版が非表示)
行13: 行13:
  
 
==SafeAreaHelperの対応方法==
 
==SafeAreaHelperの対応方法==
 +
GameタブじゃなくてSimulatorタブの方を見る。
 +
 +
===新規作成===
 
#Canvasの下にImageを追加し、anchorをstretchに変更する。
 
#Canvasの下にImageを追加し、anchorをstretchに変更する。
 
#Canvasの下のImageを、SafeAreaという名前に変更し、SafeArea.csを、AddComponentする。
 
#Canvasの下のImageを、SafeAreaという名前に変更し、SafeArea.csを、AddComponentする。
 
#SafeArea の下に、コンテンツを設置していく。
 
#SafeArea の下に、コンテンツを設置していく。
 +
#UnityEditorを起動する。
 
#unityメインメニュー/Window/General/DeviceSimuratorを開く
 
#unityメインメニュー/Window/General/DeviceSimuratorを開く
 
#起動すると、SafeAreaのAnchorsのMin(0,0.04028)とMax(1, 094431)とかになり、切り欠きなどが除外されたSafeAreaが表示される。
 
#起動すると、SafeAreaのAnchorsのMin(0,0.04028)とMax(1, 094431)とかになり、切り欠きなどが除外されたSafeAreaが表示される。
  
GameタブじゃなくてSimulatorタブの方を見る。
+
===デモ側からコピーして作成===
 +
#Assets/CrystalFramework/Utility/Demos/SafeAreaDemoを開く
 +
#Canvasの下にPnlTopがあるので、Assetsにドラッグして、Prefabとして作成。
 +
#新規でSceneを作成し、Canvasを作成しておく。
 +
#新規のSceneのCanvasの下に、PnlTopのPrefabを設置。
 +
#UnityEditorを起動する。
 +
#unityメインメニュー/Window/General/DeviceSimuratorを開く
 +
 
 +
===GooglePixel5で下の部分が適用されてない===
 +
確認すると、SafeAreaHelperでも、やっぱり下の部分がsafeareaとして認識されてる・・・
 +
 
 +
参考:https://neusstudio.blog/unity-safearea/
 +
 
 +
===SafeAreaの確認===
 +
DeviceSimulatorタブの部分に、SafeAreaボタンがあるので、有効にすると、SafeArea部分が、黄色枠で表示される。
 +
 
 +
===SafeAreaHelperを少し解析===
 +
Screen.safeAreaを使っている。
 +
<pre>
 +
Rect safeArea = Screen.safeArea;
 +
</pre>
 +
公式:https://docs.unity3d.com/ScriptReference/Screen-safeArea.html
  
 
==参考==
 
==参考==
行25: 行50:
  
 
https://note.com/game_shiori/n/nad0fa3ea3dc7
 
https://note.com/game_shiori/n/nad0fa3ea3dc7
 +
 +
https://torisan-net.com/blog/5399/

2024年9月26日 (木) 07:32時点における最新版

SafeAreaHelperとは

端末の切り欠きなどを含めない範囲を検出できるプラグイン

SafeAreaHelperのインストール

  1. https://assetstore.unity.com/packages/tools/gui/safe-area-helper-130488
  2. "Add to MyAssets"ボタンを押す
  3. UnityのPackageManagerを開き、MyAssetsを開く
  4. SafeAreaHelperをダウンロード

SafeAreaHelperのファイル一覧

  • Assets/CrystalFramework/Utility/SafeArea.cs
  • Assets/CrystalFramework/Utility/Demo

SafeAreaHelperの対応方法

GameタブじゃなくてSimulatorタブの方を見る。

新規作成

  1. Canvasの下にImageを追加し、anchorをstretchに変更する。
  2. Canvasの下のImageを、SafeAreaという名前に変更し、SafeArea.csを、AddComponentする。
  3. SafeArea の下に、コンテンツを設置していく。
  4. UnityEditorを起動する。
  5. unityメインメニュー/Window/General/DeviceSimuratorを開く
  6. 起動すると、SafeAreaのAnchorsのMin(0,0.04028)とMax(1, 094431)とかになり、切り欠きなどが除外されたSafeAreaが表示される。

デモ側からコピーして作成

  1. Assets/CrystalFramework/Utility/Demos/SafeAreaDemoを開く
  2. Canvasの下にPnlTopがあるので、Assetsにドラッグして、Prefabとして作成。
  3. 新規でSceneを作成し、Canvasを作成しておく。
  4. 新規のSceneのCanvasの下に、PnlTopのPrefabを設置。
  5. UnityEditorを起動する。
  6. unityメインメニュー/Window/General/DeviceSimuratorを開く

GooglePixel5で下の部分が適用されてない

確認すると、SafeAreaHelperでも、やっぱり下の部分がsafeareaとして認識されてる・・・

参考:https://neusstudio.blog/unity-safearea/

SafeAreaの確認

DeviceSimulatorタブの部分に、SafeAreaボタンがあるので、有効にすると、SafeArea部分が、黄色枠で表示される。

SafeAreaHelperを少し解析

Screen.safeAreaを使っている。

Rect safeArea = Screen.safeArea;

公式:https://docs.unity3d.com/ScriptReference/Screen-safeArea.html

参考

http://halcyonsystemblog.jp/blog-entry-973.html

https://note.com/game_shiori/n/nad0fa3ea3dc7

https://torisan-net.com/blog/5399/