スライドパズル(JSF)
をテンプレートにして作成
[
トップ
] [
新規
|
一覧
|
単語検索
|
最終更新
|
ヘルプ
]
開始行:
*スライドパズル(JSF) [#h389dfcf]
JavaServer Facesで4×4のスライドパズルを作成する。~
ピースをクリックすると、ピースが隣の空きマスに移動する。~
~
まず、ManagedBeanを作成する。~
パズルの途中の状態をサーバー側に保持しておくために、~
クラスに@SessionScoped（セッションが有効な間使用可能）ア...
~
ピースの番号を左上から横方向に順に0,1,2,・・・,15とする。~
ただし、パズルを解いている間はピース0のみ空きマスとする。~
パズル上の現在のピースの番号を格納する4×4の2次元配列block...
また、パズルが解けたかどうかを表す変数finishedとそのgette...
~
ピースをシャッフルするshuffle()メソッドとピースを動かすmo...
~
shuffle()メソッドはピースの初期化後に空きマスに上下左右の...
@PostConstructアノテーションを付加し最初に表示されるとき...
シャッフルの方法によっては永遠に解けないパズルが出来上が...
~
move()メソッドはピースの上下左右に空きマスがあるか調べ、...
パズルが解けていればfinishedをtrueにする。~
~
これらのメソッドは、指定位置のピースの番号を取得（配列の...
指定位置のピースの番号を設定するsetメソッド、ピースを入れ...
パズルが解けているかチェックするcheckFinishedメソッドを使...
>
import javax.inject.Named;
import javax.enterprise.context.SessionScoped;
import java.io.Serializable;
import java.util.Random;
import javax.annotation.PostConstruct;
@Named(value = "puzzle")
@SessionScoped
public class Puzzle implements Serializable {
private static final int SIZE = 4;
private final int[][] blocks = new int[SIZE][SIZE];
private boolean finished;
public Puzzle() {
}
// getter省略
private int get(int x, int y) {
if (x < 0 || x >= SIZE || y < 0 || y >= SIZE) {
return -1;
}
return blocks[x][y];
}
private void set(int x, int y, int value) {
blocks[x][y] = value;
}
@PostConstruct
public void shuffle() {
for (int i = 0; i < SIZE; i++) {
for (int j = 0; j < SIZE; j++) {
set(j, i, i * SIZE + j);
}
}
Random r = new Random();
int x = 0;
int y = 0;
for (int i = 0; i < 1000; i++) {
switch (r.nextInt(4)) {
case 0:
if (get(x - 1, y) > 0) { // 左
swap(x, y, x - 1, y);
x = x - 1;
}
break;
case 1:
if (get(x + 1, y) > 0) { // 右
swap(x, y, x + 1, y);
x = x + 1;
}
break;
case 2:
if (get(x, y - 1) > 0) { // 上
swap(x, y, x, y - 1);
y = y - 1;
}
break;
case 3:
if (get(x, y + 1) > 0) { // 下
swap(x, y, x, y + 1);
y = y + 1;
}
break;
}
}
finished = false;
}
public void move(int x, int y) {
if (!finished) {
if (get(x - 1, y) == 0) { // 左
swap(x, y, x - 1, y);
} else if (get(x + 1, y) == 0) { // 右
swap(x, y, x + 1, y);
} else if (get(x, y - 1) == 0) { // 上
swap(x, y, x, y - 1);
} else if (get(x, y + 1) == 0) { // 下
swap(x, y, x, y + 1);
}
if (checkFinished()) {
finished = true;
}
}
}
private boolean checkFinished() {
for (int i = 0; i < SIZE; i++) {
for (int j = 0; j < SIZE; j++) {
if (get(j, i) != i * SIZE + j) {
return false;
}
}
}
return true;
}
private void swap(int x1, int y1, int x2, int y2) {
int v1 = get(x1, y1);
int v2 = get(x2, y2);
set(x1, y1, v2);
set(x2, y2, v1);
}
}
続いて、パズルの画面をFaceletsで作成する。~
事前に、4×4に分割した16枚の画像と空きマス用の画像をすべて...
プロジェクト名/プロジェクト名-war/webにフォルダ（ここでは...
#ref(sp1.jpg)~
各ピースを表に配置する。ピースとピースの間に隙間を作らな...
~
c:forEachタグとtrタグ（表の縦区切り）、tdタグ（表の横区切...
c:forEach var="i" begin="0" end="3"はfor (int i = 0; i <=...
~
各ピースはボタンに画像を貼り付けて作成する。~
貼り付ける画像は、blocksに格納されているピースの番号に対...
ただし、パズルを解いている途中でピースの番号が0の場合は空...
なお、style="vertical-align:bottom"は表に隙間を作らないた...
~
各ボタン（ピース）が押されたときに、move()メソッドを呼び...
ここではf:ajaxタグを使用してページ全体を再読みこみせずに...
~
また、ボタンが押されたときにshuffle()メソッドを呼び出して...
>
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitiona...
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:f="http://xmlns.jcp.org/jsf/core"
xmlns:c="http://xmlns.jcp.org/jsp/jstl/core">
<h:head>
<title>スライドパズル</title>
</h:head>
<h:body>
<h:form>
<table cellpadding="0" cellspacing="0">
<c:forEach var="i" begin="0" end="3">
<tr>
<c:forEach var="j" begin="0" end=...
<td>
<h:commandButton action="...
image="i...
style="v...
<f:ajax render="@form...
</h:commandButton>
</td>
</c:forEach>
</tr>
</c:forEach>
</table>
<h:commandButton value="シャッフル" action="#...
<f:ajax render="@form"/>
</h:commandButton>
</h:form>
</h:body>
</html>
~
*コメント [#z4bb37fa]
#comment
終了行:
*スライドパズル(JSF) [#h389dfcf]
JavaServer Facesで4×4のスライドパズルを作成する。~
ピースをクリックすると、ピースが隣の空きマスに移動する。~
~
まず、ManagedBeanを作成する。~
パズルの途中の状態をサーバー側に保持しておくために、~
クラスに@SessionScoped（セッションが有効な間使用可能）ア...
~
ピースの番号を左上から横方向に順に0,1,2,・・・,15とする。~
ただし、パズルを解いている間はピース0のみ空きマスとする。~
パズル上の現在のピースの番号を格納する4×4の2次元配列block...
また、パズルが解けたかどうかを表す変数finishedとそのgette...
~
ピースをシャッフルするshuffle()メソッドとピースを動かすmo...
~
shuffle()メソッドはピースの初期化後に空きマスに上下左右の...
@PostConstructアノテーションを付加し最初に表示されるとき...
シャッフルの方法によっては永遠に解けないパズルが出来上が...
~
move()メソッドはピースの上下左右に空きマスがあるか調べ、...
パズルが解けていればfinishedをtrueにする。~
~
これらのメソッドは、指定位置のピースの番号を取得（配列の...
指定位置のピースの番号を設定するsetメソッド、ピースを入れ...
パズルが解けているかチェックするcheckFinishedメソッドを使...
>
import javax.inject.Named;
import javax.enterprise.context.SessionScoped;
import java.io.Serializable;
import java.util.Random;
import javax.annotation.PostConstruct;
@Named(value = "puzzle")
@SessionScoped
public class Puzzle implements Serializable {
private static final int SIZE = 4;
private final int[][] blocks = new int[SIZE][SIZE];
private boolean finished;
public Puzzle() {
}
// getter省略
private int get(int x, int y) {
if (x < 0 || x >= SIZE || y < 0 || y >= SIZE) {
return -1;
}
return blocks[x][y];
}
private void set(int x, int y, int value) {
blocks[x][y] = value;
}
@PostConstruct
public void shuffle() {
for (int i = 0; i < SIZE; i++) {
for (int j = 0; j < SIZE; j++) {
set(j, i, i * SIZE + j);
}
}
Random r = new Random();
int x = 0;
int y = 0;
for (int i = 0; i < 1000; i++) {
switch (r.nextInt(4)) {
case 0:
if (get(x - 1, y) > 0) { // 左
swap(x, y, x - 1, y);
x = x - 1;
}
break;
case 1:
if (get(x + 1, y) > 0) { // 右
swap(x, y, x + 1, y);
x = x + 1;
}
break;
case 2:
if (get(x, y - 1) > 0) { // 上
swap(x, y, x, y - 1);
y = y - 1;
}
break;
case 3:
if (get(x, y + 1) > 0) { // 下
swap(x, y, x, y + 1);
y = y + 1;
}
break;
}
}
finished = false;
}
public void move(int x, int y) {
if (!finished) {
if (get(x - 1, y) == 0) { // 左
swap(x, y, x - 1, y);
} else if (get(x + 1, y) == 0) { // 右
swap(x, y, x + 1, y);
} else if (get(x, y - 1) == 0) { // 上
swap(x, y, x, y - 1);
} else if (get(x, y + 1) == 0) { // 下
swap(x, y, x, y + 1);
}
if (checkFinished()) {
finished = true;
}
}
}
private boolean checkFinished() {
for (int i = 0; i < SIZE; i++) {
for (int j = 0; j < SIZE; j++) {
if (get(j, i) != i * SIZE + j) {
return false;
}
}
}
return true;
}
private void swap(int x1, int y1, int x2, int y2) {
int v1 = get(x1, y1);
int v2 = get(x2, y2);
set(x1, y1, v2);
set(x2, y2, v1);
}
}
続いて、パズルの画面をFaceletsで作成する。~
事前に、4×4に分割した16枚の画像と空きマス用の画像をすべて...
プロジェクト名/プロジェクト名-war/webにフォルダ（ここでは...
#ref(sp1.jpg)~
各ピースを表に配置する。ピースとピースの間に隙間を作らな...
~
c:forEachタグとtrタグ（表の縦区切り）、tdタグ（表の横区切...
c:forEach var="i" begin="0" end="3"はfor (int i = 0; i <=...
~
各ピースはボタンに画像を貼り付けて作成する。~
貼り付ける画像は、blocksに格納されているピースの番号に対...
ただし、パズルを解いている途中でピースの番号が0の場合は空...
なお、style="vertical-align:bottom"は表に隙間を作らないた...
~
各ボタン（ピース）が押されたときに、move()メソッドを呼び...
ここではf:ajaxタグを使用してページ全体を再読みこみせずに...
~
また、ボタンが押されたときにshuffle()メソッドを呼び出して...
>
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitiona...
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:f="http://xmlns.jcp.org/jsf/core"
xmlns:c="http://xmlns.jcp.org/jsp/jstl/core">
<h:head>
<title>スライドパズル</title>
</h:head>
<h:body>
<h:form>
<table cellpadding="0" cellspacing="0">
<c:forEach var="i" begin="0" end="3">
<tr>
<c:forEach var="j" begin="0" end=...
<td>
<h:commandButton action="...
image="i...
style="v...
<f:ajax render="@form...
</h:commandButton>
</td>
</c:forEach>
</tr>
</c:forEach>
</table>
<h:commandButton value="シャッフル" action="#...
<f:ajax render="@form"/>
</h:commandButton>
</h:form>
</h:body>
</html>
~
*コメント [#z4bb37fa]
#comment
ページ名:
![[PukiWiki]](image/pukiwiki.png "[PukiWiki]")
