チェスアプリ開発(8) マウス操作で駒を動かす

Python プログラムで動かすフェアリーチェスアプリ開発、連載第８回です。

はで画像を読み込み、盤面上に駒を表示しました。

今回はマウス操作で駒を動かせるようにしていきます。

完成イメージ

駒をクリックすると移動可能なマスが表示され、移動先をクリックするとそこに移動するようにします。

丸の描画

駒をクリックしたら丸を表示するので、丸を描画する関数を定義します。

utils.py
1
from math import pi, sin, cos
2
　
3
...
4
　
5
def circle(x, y, opponent, r=0.25):
6
    '''
7
    円を描画する
8

9
    Parameters
10
    ----------
11
    x, y : float
12
        中心の座標．
13
    opponent : bool
14
        True のとき，赤色で描画する．
15
    r : float, default 0.25
16
        半径．
17
    '''
18
    glPushMatrix()          # 変形範囲の開始
19
    glTranslate(x, y, 0)    # 平行移動
20

21
    # 色の指定
22
    if opponent:
23
        glColor(1.0, 0.5, 0.5, 0.7)     # 赤
24
    else:
25
        glColor(0.5, 0.5, 1.0, 0.7)     # 青
26

27
    # 円の描画
28
    glBegin(GL_POLYGON)     # 多角形の描画
29
    for k in range(12):
30
        xr = r * cos(2 * pi * k / 12)
31
        yr = r * sin(2 * pi * k / 12)
32
        glVertex(xr, yr, 0)
33
    glEnd()
34
    　
35
    glPopMatrix()           # 変形範囲の終了

円の描画としていますが、実は正十二角形を描画しているだけです。

数学の話になりますが、三角関数の引数は

で表されるので、

360 度は円周率の 2 倍の値（$2\pi$）になります。

角度と座標の関係は次の図のようになるので、

30-31 行目のような式が出来上がります。

マウスポインタ座標の取得

OpenGL では、glutMouseFunc() にユーザ定義の関数を登録しておけば、

マウスのどのボタンが押され離されたか、そのときのマウスポインタの位置はどこかなどの情報を取得できます。

マウスで動作を制御できるようになるので、キーボードからコマンドを入力するための関数や、

盤面が画面に表示されるので、コマンドラインに盤面を表示する関数は消してしまいます。

（赤は削除行です。可読性のため、キャメルケース CamelCase からスネークケース snake_case に変更するなど、表記を変えた部分があります。）

main.py
1
class Game:
2
    def __init__(self):
3
        ...
4
        # マウスポインタの位置
5
        self.mousepos = [-1.0, -1.0]
6
        # 行先の指定
7
        self.select_dest = False
8
        # 始点・終点
9
        self.startpos, self.endpos = (None, None), (None, None)
10
        ...
11
    ...
12
    def main(self):
13
        self.printBoard()
14
        print(self.message)
15
        self.message = ""
16
        startpos, endpos = self.parseInput()
17
        ...
18
        startpos, endpos = self.startpos, self.endpos
19
        if None not in startpos + endpos:
20
            ...
21
    ...
22
    def parseInput(self):
23
        try:
24
            a,b = input().split()
25
            a = ((ord(a[0])-97), int(a[1])-1)
26
            b = (ord(b[0])-97, int(b[1])-1)
27
            print(a,b)
28
            return (a,b)
29
        except:
30
            print("error decoding input. please try again")
31
            return((-1,-1),(-1,-1))
32
　
33
    def printBoard(self):
34
        print("  1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 |")
35
        for i in range(0,8):
36
            print("-"*32)
37
            print(chr(i+97),end="|")
38
            for j in range(0,8):
39
                item = self.gameboard.get((i,j)," ")
40
                print(str(item)+' |', end = " ")
41
            print()
42
        print("-"*32)
43
　
44
    def parse_mouse(self):
45
        '''マウスポインタの位置から指定したマス目を出力'''
46
        a, b = self.mousepos
47
        file_, rank = None, None
48
        for i in range(8):
49
            if abs(a - i) < 0.5: file_ = i
50
        for i in range(8):
51
            if abs(b - i) < 0.5: rank = i
52
        return (file_, rank)
53
　
54
    ...
55
　
56
    def mouse(self, button, state, x, y):
57
        '''
58
        マウス入力コールバック
59

60
        Parameters
61
        ----------
62
        button : GLUT_LEFT_BUTTON, GLUT_MIDDLE_BUTTON, GLUT_RIGHT_BUTTON or int > 0, 1, 2
63
            マウスボタン．
64
            GLUT_LEFT_BUTTON, 0 -- 左
65
            GLUT_MIDDLE_BUTTON, 1 -- 中
66
            GLUT_RIGHT_BUTTON, 2 -- 右
67
        state : GLUT_DOWN, GLUT_UP or int > 0, 1
68
            ボタンの状態．
69
            GLUT_DOWN, 0 -- 押された
70
            GLUT_UP, 1 -- 離された
71
        x, y : int
72
            ウィンドウ座標．
73
        '''
74
        # ウィンドウ座標をワールド座標に変換する
75
        self.mousepos = window2world(x, y, WSIZE)
76
        # 左クリック
77
        if (button == GLUT_LEFT_BUTTON
78
                and state == GLUT_DOWN):
79
            try:
80
                # 行先選択
81
                if (self.select_dest
82
                        and self.is_valid_move(self.gameboard[self.startpos],
83
                            self.startpos, self.parse_mouse(), self.gameboard)):
84
                    self.select_dest = False
85
                    self.endpos = self.parse_mouse()
86
                # 駒選択
87
                elif self.parse_mouse() in self.gameboard:
88
                    self.startpos, self.endpos = (None, None), (None, None)
89
                    self.select_dest = True
90
                    self.startpos = self.parse_mouse()
91
            except KeyError: pass
92
　　
93
            glutPostRedisplay()     # 再描画
94
　
95
    ...
96
　
97
    def glmain(self):
98
        ...
99
        glutMouseFunc(self.mouse)   # マウス入力コールバック
100
        ...

クリック操作をするたびにmouse()メソッドが呼び出されて処理をします。

parse_mouse()で、クリック時のマウスポインタの位置をもとに盤面上のどのマスが指定されたかを出力し、

駒やその移動先を指定することができます。

予期せぬ場所がクリックされたときのために、try-exceptで例外処理をしています。

glutPostRedisplay()は画面の再描画を行う関数で、draw()メソッドを呼び出します。

19 行目のif None not in startpos + endpos:は、開始位置と終了位置の両方が指定されていることを保証するものです。

ウィンドウ座標をワールド座標に変換

mouse()メソッドの引数として渡されるx, yはウィンドウ座標です。

ウィンドウ座標は、表示されているウィンドウの左上を(0, 0)とし、ピクセルを単位とする座標系です。

つまり、ウィンドウのサイズを 600x400 だとすると、右下の座標は(600, 400)となります。

これに対して、実際に描画に使用されているのはワールド座標です。

ワールド座標はユーザが定義できます。

でglOrtho()を使って指定しているのもワールド座標です。

さて、実際にマウスポインタの位置を情報として使用するにあたっては、

ワールド座標に変換したほうが何かと便利です。

そこで、ウィンドウ座標をワールド座標に変換する関数を作ります。

utils.py
1
def window2world(x, y, wsize):
2
    '''
3
    ウィンドウ座標を世界座標に変換する
4

5
    Parameters
6
    ----------
7
    x, y : int
8
        変換するもとの座標．
9
    wsize : int
10
        画面の大きさ．
11

12
    Returns
13
    -------
14
    list > [float, float]
15
        変換先の座標．
16
    '''
17
    return [9*x / wsize - 1, 7 - (9*y / wsize - 1)]

この変換によって、左下端をクリックしたときには(-1, -1)という座標が、右上端をクリックしたときには(8, 8)という座標が取得できることになります。

移動可能なマスに丸を表示

さきほど定義した丸を描画する関数を使って、駒を指定したときにその駒が移動可能なマスに丸を表示するようにします。

まずは、指定された位置すべてに丸を描画する関数を定義します。

utils.py
1
def draw_available_moves(poslist, opponent=None):
2
    '''動かせる位置を描画する
3

4
    Parameters
5
    ----------
6
    poslist : list > [(int, int), ...]
7
        移動先の座標のリスト．
8
    opponent : bool or None, default None
9
        True のとき，赤色で描画する．
10
    '''
11
    for pos in poslist:
12
        circle(*pos, opponent)

*posはアンパックというもので、posに格納されているデータのそれぞれをそのまま関数の引数に渡すために使っています。

これで、移動可能なマスの座標のリストを渡せばそこに丸を書いてくれるようになります。

main.py
1
def draw(self):
2
    ...
3
    draw_pieces(self.gameboard, piece_ID)
4
    # 可能な移動先の表示
5
    if self.select_dest and None not in self.startpos:
6
        piece = self.gameboard[self.startpos]
7
        draw_available_moves(
8
            [move for move in piece.available_moves(*self.startpos, self.gameboard, color=piece.color)
9
                if self.is_valid_move(piece, self.startpos, move, self.gameboard)],
10
            opponent=self.playersturn != piece.color)
11
    ...

条件文は、行先選択中であり、開始位置が指定されているということ。

それで、draw_available_moves()のopponentでは、自分の手番ではないときに相手の駒を触ったときにTrueとなるような条件式を与えています。

ただ、8-9 行目の内包表記が面倒くさいです。

available_moves()は移動先のリストを返しますが、チェック回避を考慮していないので、そのままでは使えません。

そのため、でチェック回避を考慮したis_valid_move()を作ったのですが、

こちらは移動可能かどうかを判定するだけで、移動先の座標のリストを返すわけではありません。

なんでこうしたんだろう、とちょっと後悔。

このままにしておいても面倒なので、移動先の座標のリストを返すようにis_valid_move()を書き換えます。

main.py
1
def is_valid_move(self, piece, startpos, endpos, gameboard):
2
    if endpos in piece.availableMoves(*startpos, gameboard, color=piece.color):
3
        # 盤面の複製
4
        gameboardTmp = copy(gameboard)
5
        # 複製した盤面の更新
6
        self.renew_gameboard(startpos, endpos, gameboardTmp)
7
        # チェック判定
8
        if self.is_check(piece.color, gameboardTmp):
9
            return False
10
        else:
11
            return True
12
    else:
13
        return False
14
def valid_moves(self, piece, startpos, gameboard):
15
    '''
16
    動ける位置を出力．味方駒上には移動不可．
17

18
    Parameters
19
    ----------
20
    piece : obj
21
        駒．
22
    startpos : tuple > (int, int)
23
        開始位置．絶対座標．
24
    gameboard : dict > {(int, int): obj, ...}
25
        盤面．
26

27
    Returns
28
    -------
29
    result : list > [(int, int), ...]
30
    '''
31
    result = piece.available_moves(*startpos, gameboard, color=piece.color)
32
    # チェック回避のため動き縛り
33
    result_tmp = copy(result)
34
    for endpos in result_tmp:
35
        gameboard_tmp = copy(gameboard)
36
        self.renew_gameboard(startpos, endpos, gameboard_tmp)
37
        if self.is_check(piece.color, gameboard_tmp):
38
            result.remove(endpos)
39
    return result

それに伴って関係各所の調整をします。

ところで、マウス操作では移動可能な場所をクリックしないと動作しないようにしているので、

main()内部の条件式は省いても構いません。

main.py
1
def main(self):
2
    ...
3
        if target:
4
            print("found "+str(target))
5
            if target.color != self.playersturn:
6
                self.message = "you aren't allowed to move that piece this turn"
7
            if self.is_valid_move(target, startpos, endpos, self.gameboard):
8
                self.message = "that is a valid move"
9
                ...
10
        if target and target.color == self.playersturn:
11
            print("found "+str(target))
12
            self.message = "that is a valid move"
13
            ...
14
...
15
　
16
def draw(self):
17
    ...
18
    if self.select_dest and None not in self.startpos:
19
        piece = self.gameboard[self.startpos]
20
        draw_available_moves(
21
            [move for move in piece.available_moves(*self.startpos, self.gameboard, color=piece.color)
22
                if self.is_valid_move(piece, self.startpos, move, self.gameboard)],
23
            self.valid_moves(piece, self.startpos, self.gameboard),
24
            opponent=self.playersturn != piece.color)
25
        ...
26
...
27
　
28
def mouse(self, button, state, x, y):
29
    ...
30
    # 左クリック
31
    if (button == GLUT_LEFT_BUTTON
32
            and state == GLUT_DOWN):
33
        try:
34
            # 行先選択
35
            if (self.select_dest
36
                    and self.is_valid_move(self.gameboard[self.startpos],
37
                        self.startpos, self.parse_mouse(), self.gameboard)):
38
                    and self.parse_mouse() in self.valid_moves(
39
                        self.gameboard[self.startpos], self.startpos, self.gameboard)):
40
                ...

これでマウス操作で駒を動かせるようになりました！

---

これで結構ゲームっぽくなってきましたね。

ただ、駒の動きがカクカクしています。

はおまけ的な感じで、駒の動きをスムーズにしてみたいと思います。

参考になったらうれしいです。

では