空白のマスに隣接するタイルをスライドさせるには、まずマウスのボタンが押された際の座標から、現在マウスのポインタがどのタイルの上にあるのかを計算します。次にそのタイルが空白に隣接しているかを判断し、隣接していた場合はタイルと空白のマスの情報を交換します。

ポイントがひとつあります。

タイル情報と空白のマスの情報はマウスのボタンが押された直後に交換しますが、絵柄の座標は交換しません。絵柄の座標を交換しないので画面上は何も変化がない状況になります。

では絵柄の座標はどのようなタイミングで更新するのかというと、答えは「常に」です。絵柄はゲームループに中で常に「今、自分がいるのは自分のタイルの上だろうか？」を判定します。もし自分のタイルの上でなかった場合は自分のタイルを見つけて座標を少し補正します。座標を少しずつ補正することによってアニメーション効果を実現するというわけです。

なぜこのような設計するかというと、今回のゲームがタイムアタックだからです。つまり、タイルがスライドしているアニメーションの間も、マウス操作で次のタイルを交換できるようにするためです。 15 パズルは慣れてくると１秒の間に３～４個のタイルを動かすこともあります。スライドのアニメーションが待ち時間にならないようにこういう設計になっているというわけです。