前提
Unityでスマホアプリを作っています。
画面を横にスワイプして切り替える機能を実装しようとしています。
使用コードはこちらhttps://www.youtube.com/watch?v=rjFgThTjLso
(Swaiping Pages In Unity)を参照しています。
以下は画面のスクリーンショットです。
Canvas設定は、
Render Mode : ScreenSpace-Camera
UI Scale Mode : Scale with ScreenSize
にしています。使い慣れているから、という理由です。
スクリプトはPanelConというオブジェクトに付与しています。
赤→青→緑とスワイプしたいと思っています。
発生している問題
上記のCanvas設定だと、上記のコードSwaiping Pages In Unityを使っても
スワイプ動作が早すぎるなど、うまくいきませんでした。
そのため、自分でわかる範囲で変更を加えました。
(変更後が以下のコードです。)
スワイプ自体はするようになりました。
ただ、どうしてもわからない部分が、
一ページ分だけ、綺麗にスワイプさせる動作の実装です。
中段あたりにある
newLocation += new Vector3(-Screen.width, 0, 0);
のコードですが、
Screen.widthを使ってスワイプすると、
PanelConというパネルがだいぶ遠くに飛んでしまい、
何も見えない状態になってしまいます。
該当のソースコード
PanelCon
1public class Swipeeasier : MonoBehaviour, IDragHandler, IEndDragHandler 2{ 3 public RectTransform canvas; 4 private Vector3 panelLocation; 5 public float percentThreshold = 0.2f; 6 7 // Start is called before the first frame update 8 void Start() 9 { 10 panelLocation = transform.position; 11 } 12 public void OnDrag(PointerEventData data) 13 { 14 float difference = data.pressPosition.x - data.position.x; 15 //transform.position = (panelLocation - new Vector3(difference, 0, 0)) * 0.01f; 16 transform.position += 17 (panelLocation - new Vector3(difference, 0, 0))*0.0006f; 18 19 } 20 public void OnEndDrag(PointerEventData data) 21 { 22 float percentage = (data.pressPosition.x - data.position.x) / Screen.width; 23 Debug.Log(Screen.width); 24 if(Mathf.Abs(percentage) >= percentThreshold) 25 { 26 Vector3 newLocation = panelLocation; 27 if(percentage > 0) 28 { 29 newLocation += new Vector3(-Screen.width, 0, 0); 30 } 31 else if(percentage < 0) 32 { 33 newLocation += new Vector3(Screen.width, 0, 0); 34 } 35 transform.position = newLocation; 36 panelLocation = newLocation; 37 }else 38 { 39 transform.position = panelLocation; 40 } 41 42 } 43 44} 45
試したこと
new Vector3のあとの、Screen.widthの部分をほかの数字に変えてみて、どう映るか確認してみました。
小さい数字にすると、画面にページの色は映るのですが、
画面が中途半端にスクロールされてしまいます。
例えば、上記のようになります。
動画見本とCanvas設定が違うのでうまくいかないのかもしれませんが、
できればこのままの設定で解決できないかなあと思っています。
もしお分かりの方いらっしゃれば、
よろしくお願いいたします。
回答1件
あなたの回答
tips
プレビュー
下記のような回答は推奨されていません。
このような回答には修正を依頼しましょう。
また依頼した内容が修正された場合は、修正依頼を取り消すようにしましょう。
2022/08/10 15:00 編集
2022/08/10 16:40
2022/08/10 17:49 編集
2022/08/10 19:40
2022/08/13 16:38 編集