remove
powerd by nog twitter

説明書(ジグソーパズル)


好きな画像をジグソーパズルにして遊べるアプレットです。

アプレットが起動するとまず次のような画面になります。

アプレットの外観

テキストフィールドにジグソーパズルにしたい画像ファイルを相対パスで指定してください。
相対パスというのはこのフォルダにある jigsaw.html から見た画像ファイルの位置を表します。
例えば、jigsaw.htmlC:\Program Files\jigsaw_v1-1\jigsaw\jigsaw.html にあるとすると、
C:\Program Files\jigsaw_v1-1\jigsaw\picture.jpg ならば「picture.jpg」と、
C:\Program Files\jigsaw_v1-1\jigsaw\image\picture.jpg ならば「image/picture.jpg」と、
C:\picture.jpg ならば「../../../picture.jpg」と入力してください。
よく分からない場合は jigsaw.html と同じフォルダに画像ファイルを入れて単純にその画像ファイルの名前を入力すれば大丈夫です。

画像の形式についてですが、
Java では標準で GIF と JPEG をサポートしていますので、この2種類は確実に読み取れます。
PNG は Java 2 SDK 1.3 からサポートされました。
ブラウザが 1.3 以降の Java を搭載しているか、Java plug-in 1.3 以降が入っていれば PNG も読み取れるかもしれません。
BMP は Windows と Internet Explorer という環境であれば読み取れるようですが、Java の標準ではなく Microsoft の独自仕様なので正しい動作は保証できません。
他にもいろいろな形式の画像がありますが PNG と BMP も含めて、ペイントソフトや画像変換ソフトを使えば大抵の画像は GIF か JPEG に変換することができますので、あらかじめ GIF か JPEG に変換しておけばどんな画像でもジグソーパズルにすることができます。

このアプレットでは 自然いっぱいの素材集 で配布されている画像の1つをサンプル画像として使用させて頂いています。
[サンプル] ボタンを押すとそのファイルを選ぶことができます。
とりあえずどんなものか試してみたい方はサンプル画像でパズルをやってみてください。

[内容を消去] ボタンはテキストフィールドの内容を消去して空にします。

画像ファイルを指定したら [パズルを開く] ボタンを押してください。
画像の読み取りに成功した場合は次のようなウインドウが開きます。

フレーム

このウインドウは画面いっぱいに(画面と同じ大きさで)表示されます。
パズルをするにはなるべく広い領域が必要なのでこういう仕様にしています。
最大化ボタンが押されるなどしてウインドウの大きさが変わると意図しない表示・動作になってしまいますので、大きさを変えないでください。

まず、画像をどんな形でいくつのピースに切り分けるかを選択します。
選択したら [この設定で新規パズルを開始する] ボタンを押してください。
画像を切り分ける作業、ピースを配置する作業が終わると「準備が完了しました」と表示されパズルができる状態になります。
(この作業には少し時間がかかります。また当然ですがピース数が多ければ多いほどメモリを消費しますので、マシンスペックが低い場合はピース数をあまり多くしない方がいいと思います。)

パズルは上部にあるタブをクリックしてタブを移動しながら行います。

・ 完成図タブ
読み込んだ画像がそのまま表示されます。
この絵を参考にしながらピースを配置していってください。

・ パネルタブ
ピースを置いていきパズルを完成させるパネルの役割を持っています。
ピース1 〜 ピース4タブにバラバラになっているピースをこのパネルに置いていきパズルを完成してください。

・ ピース1 〜 ピース4タブ
すべてのピースはこの4つのタブの中のどこかにバラバラに配置されます。
このバラバラのピースを正しくパネルに置いていくのがパズルの目的です。

・ 設定タブ
ゲームの設定やウインドウを閉じるボタンがあります。
パズルが行われている最中でも設定を変えて新しいパズルを始めることができます。
その場合は前に行っていたパズルには戻れません。

ピースを移動させるにはまず移動させたいピースをクリックします。
そうすると選択状態になるので移動させたいタブをクリックして、そのタブの中の移動させたい場所までマウスポインタを移動させてクリックするとその位置にピースを置くことができます。
またピースは角度もバラバラになっています。
ピースが選択されている状態で右クリックすると90度右回転します。
またキーボードのLキーを押すと左に90度、Rキーを押すと右に90度回転します。

パネルにピースを置くときに限ってのことですが、
置こうとしている場所にすでにピースが置いてある場合や、置こうとしている場所の隣にそのピースとはつながらないピースが置いてある場合は置けません。


更新履歴

v1.1ひとまず公開
v1.2ピースをピース1に集める機能を追加
3×3など一部の切り分け方によってはピースの配置で止まってしまうバグを修正