まずスケーリングから。
状態遷移を4つ作る。
拡大表示、縮小中、縮小表示、拡大中
フレームごとにステートカウントを更新し、表示倍率も更新(特に縮小中、拡大中のとき)
スケーリングの中心点を1カ所決める。とくに拡大中のときに使う。ダブルタップした点がそこに相当。
縮小中の場合は、スケーリング中心は必ず全体の中心になる。なぜなら、縮小表示は全体を表示すると決めているから。
次にスクロール。
基準点を決める。今回は左上点とした。
これは、等倍表示(=縮小表示の倍率)の場合の点である。
拡大・縮小しただけでは位置は変わらない。
というか、ずっと表示範囲の左上点のスクリーン座標を保持したまま、値が変わらない。
スクロールした際は、スケーリングの中心点を移動させた。
ブロックのサイズ(表示中の倍率を乗じたサイズ)分だけ移動させる。(スクロール方向と同じ向き)
描画する関数には、
左上点座標(スクリーン座標)
ブロックサイズ
だけを渡す。
この関数は、左上点を基準に、渡されたブロックサイズでブロックを単純に描画していく。
この関数に渡す左上点座標は、
スケーリング中心座標を基準に、スクロール基準としている左上点座標がどこにあるか、を渡す
式で言うと、
posScaleCenter - (posScaleCenter - posLT) * scaleRate
となる。
posScaleCenter(1 - scaleRate) + posLT * scaleRate
posLTの位置から、scaleRate倍したブロックサイズを並べていくと、posScaleCenterの位置で重なる。
要するに、表示中心座標Pと、スケール値Rがあればいいはずなんだ。
あとはアンカーポイントA。
フィールドの座標Pを、スクリーンのAの位置に合わせ、サイズをRとして描画。
基本は、スケーリングするときはRを変化させ、スクロールするときはAを変化する。
ただ、スケーリングのときにスケーリング中心点を付けたいので、これがちょっと面倒になるということなのだ。
P,A,Rの3つを持つ構造体を作って、どれかを指定したらあとは自動で計算してくれたりすると便利かも。
PR