-
Notifications
You must be signed in to change notification settings - Fork 1
/
dl4.html
405 lines (356 loc) · 15.9 KB
/
dl4.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
<!DOCTYPE html>
<!--[if IEMobile 7 ]><html class="no-js iem7"><![endif]-->
<!--[if lt IE 9]><html class="no-js lte-ie8"><![endif]-->
<!--[if (gt IE 8)|(gt IEMobile 7)|!(IEMobile)|!(IE)]><!--><html class="no-js" lang="en"><!--<![endif]-->
<head>
<meta charset="utf-8">
<title>DL-4; メッセージ表示ウインドウ — Daydreaming in Greater Boston</title>
<meta name="author" content="Kyos">
<!-- http://t.co/dKP3o1e -->
<meta name="HandheldFriendly" content="True">
<meta name="MobileOptimized" content="320">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="/favicon.png" rel="icon">
<link href="/theme/css/main.css" media="screen, projection"
rel="stylesheet" type="text/css">
<link href="//fonts.googleapis.com/css?family=PT+Serif:regular,italic,bold,bolditalic"
rel="stylesheet" type="text/css">
<link href="//fonts.googleapis.com/css?family=PT+Sans:regular,italic,bold,bolditalic"
rel="stylesheet" type="text/css">
</head>
<body>
<header role="banner"><hgroup>
<h1><a href="/">Daydreaming in Greater Boston</a></h1>
</hgroup></header>
<nav role="navigation"><ul class="subscription" data-subscription="rss">
</ul>
<ul class="main-navigation">
<li><a href="/pages/about.html">About Me</a></li>
<li >
<a href="/category/blog.html">Blog</a>
</li>
<li >
<a href="/category/english.html">English</a>
</li>
<li >
<a href="/category/linux.html">Linux</a>
</li>
<li class="active">
<a href="/category/python.html">Python</a>
</li>
<li >
<a href="/category/tech.html">Tech</a>
</li>
</ul></nav>
<div id="main">
<div id="content">
<div>
<article class="hentry" role="article">
<header>
<h1 class="entry-title">DL-4; メッセージ表示ウインドウ</h1>
<p class="meta">
<time datetime="2021-02-27T00:00:00-05:00" pubdate>Sat 27 February 2021</time> </p>
</header>
<div class="entry-content"><div id="table-of-contents">
<h2>Table of Contents</h2>
<div id="text-table-of-contents">
<ul>
<li><a href="#org9d45556">1. はじめに</a></li>
<li><a href="#org1ec652b">2. メッセージウインドウクラス</a></li>
<li><a href="#orge1a28bb">3. メッセージ表示メソッド</a></li>
<li><a href="#orgb8f694f">4. ユーザーインプットメソッド</a></li>
<li><a href="#org6ddf54a">5. 1文字入力メソッド</a></li>
<li><a href="#orgeb27c5b">6. 次は、、</a></li>
</ul>
</div>
</div>
<div id="outline-container-org9d45556" class="outline-2">
<h2 id="org9d45556"><span class="section-number-2">1</span> はじめに</h2>
<div class="outline-text-2" id="text-1">
<p>
Rogue+Wizライクなゲーム(仮称Daemon Lord)を作るプロジェクトの4回目です。今回はメッセージウインドウとその上での文字列入力を実装します。
</p>
<p>
コードのリファクタリングが進んで状況がわからなくなっていると思うので、githubでコードを <a href="https://github.com/achiwa912/daemonlord">公開</a> しています。MacとLinuxで動作確認していますが、Windowsは未対応です。
</p>
<p>
メッセージウインドウはスペックがなかなか決まらず、どういったものを作るかを決めるのにだいぶ時間がかかりました。スクロール画面の一部に常時表示する形態としました。
</p>
</div>
</div>
<div id="outline-container-org1ec652b" class="outline-2">
<h2 id="org1ec652b"><span class="section-number-2">2</span> メッセージウインドウクラス</h2>
<div class="outline-text-2" id="text-2">
<p>
仮想スクロール画面クラス(Vscr)の一部にするか悩んだのですが、肥大化するのも嫌なので、メッセージウインドウクラス(Meswin)として独立させました。
</p>
<p>
ウインドウ自体のサイズ(width, height)とその中のメッセージ表示エリアのサイズ(mes_width, mes_height)とを分けて管理しています。(x, y)はスクロールウインドウ内のメッセージウインドウの表示位置(左上)です。
</p>
<p>
mes_linesに表示するメッセージ(文字列)のリストを入れます。これを空にするとメッセージウインドウをクリアすることができます(cls())。
</p>
<div class="org-src-container">
<pre class="src src-python">class Meswin:
"""
Message window. Max 40x8 at the upper center of the scroll window.
The message area is max 36x6 and a message starts with " * ".
"""
def __init__(self, vscr):
self.vscr = vscr
self.width = min(40, vscr.width)
self.height = min(8, vscr.height)
self.x = max(0, (vscr.width-self.width)//2) # center
self.y = max(0, (vscr.height-self.height)//10) # uppper
self.mes_width = self.width - 4 # Message area width
self.mes_height = self.height - 2 # Message area height
self.cur_x = 0 # cursor position in message area
self.cur_y = 0
self.show = False
self.mes_lines = []
self.cls()
def cls(self):
# clear message area
self.mes_lines = []
</pre>
</div>
</div>
</div>
<div id="outline-container-orge1a28bb" class="outline-2">
<h2 id="orge1a28bb"><span class="section-number-2">3</span> メッセージ表示メソッド</h2>
<div class="outline-text-2" id="text-3">
<p>
print()メソッドでメッセージを表示します。昔のファミコンRPGのように、メッセージの先頭には" * "を付けます。この記号はstart引数で変更できます。
</p>
<p>
引数msgはメッセージで、この中に含まれる'\n'を改行として処理します。メソッドの最初に'\n'でsublinesリストにsplitしていますが、'\n'の情報が失われないように正規表現のre.split()を使っています。
</p>
<p>
sublineは更にウインドウの右端&単語の境界で折り返すようにtextwrap.wrap()を使います。ここで折り返した行の先頭には' * 'が付かないようにしました。
</p>
<p>
改行オンリーの行を正しく処理するように、len(ssls)がゼロの時にもmes_linesに登録する処理を入れています。
</p>
<p>
表示行数がメッセージエリアの行数よりも多い文はmes_linesから抜いています。こうすることで、メッセージウインドウがスクロールします。
</p>
<div class="org-src-container">
<pre class="src src-python">def print(self, msg, start='*'):
"""
Print a message in the message window. Long text wraps
to the next line. Process '\n' in texts.
"""
sublines = re.split('\n', msg)
for idx, sl in enumerate(sublines): # subline
header = ' '
if idx == 0:
header = start + ' '
ssls = textwrap.wrap(sl, width=self.mes_width)
if len(ssls) == 0:
self.mes_lines.append(header)
else:
for ssl in ssls:
self.mes_lines.append(''.join([header, ssl]))
header = ' '
if len(self.mes_lines) > self.mes_height:
self.mes_lines = self.mes_lines[len(
self.mes_lines)-self.mes_height:]
self.cur_y = len(self.mes_lines)-1
self.show = True
</pre>
</div>
<p>
スクリーンショット(笑)です。1歩歩くたびにメッセージ出力するようにしてみました。
</p>
<pre class="example">
^^^^^^^^^^^^^^^^^^^^----------------------------------------^^^^^^^^^^^^^^^^^^^^
^^^^^^^^^^^^^^^^^^^^| * north |^^^^^^^^^^^^^^^^^^^
^^^^^^^^^^^^^^^^^^^^| * north |^^^^^^^^^^^^^^^^^^^
^^^^^^^^^^^^^^^^^^^^| * south |^^^^^^^^^^^^^^^^^^^
^^^^^^^^^^^^^^^^^^^^| * west |^^^^^^^^^^^^^^^^^^^
^^^^^^^^^^^^^^^^^^^^| * south |###...#############
^^^^^^^^^^^^^^^^^^^^| * east |###...##...........
^^^^^^^^^^^^^^^^^^^^----------------------------------------+..+...##...........
^^^^^^^^^^^^^^^^^^^^^^^^^^^^##########..........#####.......####...##...........
^^^^^^^^^^^^^^^^^^^^^^^^^^^^##########..........########+#######...########+####
^^^^^^^^^^^^^^^^^^^^^^^^^^^^##########..........########+#######...########.####
^^^^^^^^^^^^^^^^^^^^^^^^^^^^##########..@.......*.....+.....+...+++++.......####
^^^^^^^^^^^^^^^^^^^^^^^^^^^^##########..........#######.....####.....###########
^^^^^^^^^^^^^^^^^^^^^^^^^^^^##########..........#######.....####.....###########
</pre>
</div>
</div>
<div id="outline-container-orgb8f694f" class="outline-2">
<h2 id="orgb8f694f"><span class="section-number-2">4</span> ユーザーインプットメソッド</h2>
<div class="outline-text-2" id="text-4">
<p>
メッセージウインドウ内でユーザーインプットできるようにしました。"* "の代わりに"> "で入力を促します。
</p>
<pre class="example">
^^^^^^^^^^^^^^^^^^^^----------------------------------------####......##########
<snip>
^^^^^^^^^^^^^^^^^^^^| * How? |*......#####.......
^^^^^^^^^^^^^^^^^^^^| > |#####..#####.......
^^^^^^^^^^^^^^^^^^^^----------------------------------------.#####++#####.......
</pre>
<p>
宝箱の罠やスペル(魔法)の名前の入力でこのメソッドを使います。
</p>
<pre class="example">
^^^^^^^^^^^^^^^^^^^^| * How? |.######*#####......
^^^^^^^^^^^^^^^^^^^^| > poison needle |.*......#####......
^^^^^^^^^^^^^^^^^^^^| * Input: poison needle |.#####..#####......
^^^^^^^^^^^^^^^^^^^^----------------------------------------.#####++#####.......
</pre>
<p>
inputメソッドです。メッセージとプロンプトを表示して、その右にカーソルを持って行き、後は普通に標準ライブラリのinput()関数を呼んでいます。こちらの関数で画面表示された文字列はメッセージウインドウに登録されておらず、次回の表示で消えてしまうために、メッセージウインドウに登録しなおしています。
</p>
<div class="org-src-container">
<pre class="src src-python">def input(self, msg):
"""
Input a string in the message window.
"""
self.print(msg)
self.print('', start='>')
self.vscr.show_meswin()
self.vscr.display()
print(f"\033[{self.y+self.cur_y+1};{self.x+5}H", end='', flush=True)
try:
value = input()
self.mes_lines[self.cur_y] = "> " + value
except:
pass
return value
</pre>
</div>
</div>
</div>
<div id="outline-container-org6ddf54a" class="outline-2">
<h2 id="org6ddf54a"><span class="section-number-2">5</span> 1文字入力メソッド</h2>
<div class="outline-text-2" id="text-5">
<p>
次は1文字入力メソッドです。Yes/Noに答える際に'y'または'n'の入力待ちをするようなケースで使用します。
</p>
<pre class="example">
^^^^^^^^^^^^^^^^^^^^----------------------------------------^^^^^^^^^^^^^^^^^^^^
^^^^^^^^^^^^^^^^^^^^| * east |^^^^^^^^^^^^^^^^^^^
^^^^^^^^^^^^^^^^^^^^| * east |^^^^^^^^^^^^^^^^^^^
^^^^^^^^^^^^^^^^^^^^| * east |^^^^^^^^^^^^^^^^^^^
^^^^^^^^^^^^^^^^^^^^| * Do you? (y/n) > f |^^^^^^^^^^^^^^^^^^^
^^^^^^^^^^^^^^^^^^^^| * Do you? (y/n) > y |^^^^^^^^^^^^^^^^^^^
^^^^^^^^^^^^^^^^^^^^| * Input char: y |^^^^^^^^^^^^^^^^^^^
^^^^^^^^^^^^^^^^^^^^----------------------------------------####################
</pre>
<p>
期待する文字をリストで渡して、それが出るまでループさせることもできます。このメソッドはnon-blocking 1文字入力のgetch()関数を使っていて、リターンキーの入力が不要です。
</p>
<div class="org-src-container">
<pre class="src src-python">def input_char(self, msg, values=[]):
"""
Input a character in the message window.
"""
ch = ''
while ch not in values:
self.print(msg+' >')
self.vscr.show_meswin()
self.vscr.display()
print(f"\033[{self.y+self.cur_y+1};{self.x+len(msg)+8}H",
end='', flush=True)
ch = getch()
l = self.mes_lines.pop()
self.print(''.join([l, ' ', ch])[2:])
self.vscr.show_meswin()
self.vscr.display()
if not values:
break
return ch
</pre>
</div>
</div>
</div>
<div id="outline-container-orgeb27c5b" class="outline-2">
<h2 id="orgeb27c5b"><span class="section-number-2">6</span> 次は、、</h2>
<div class="outline-text-2" id="text-6">
<p>
メッセージも出力できるようになったので、次はいよいよWizardry画面らしい、パーティーリストの画面表示にチャレンジします。
</p>
</div>
</div>
</div>
<footer>
<p class="meta">
<span class="byline author vcard">
Posted by <span class="fn">
きょうす
</span>
</span>
<time datetime="2021-02-27T00:00:00-05:00" pubdate>Sat 27 February 2021</time> <span class="categories">
<a class='category' href='/category/python.html'>Python</a>
</span>
<span class="categories">
<a class="category" href="/tag/python.html">Python</a>, <a class="category" href="/tag/game.html">game</a> </span>
</p><div class="sharing">
</div> </footer>
</article>
</div>
<aside class="sidebar">
<section>
<h1>Recent Posts</h1>
<ul id="recent_posts">
<li class="post">
<a href="/tello.html">アメリカ格安SIMをSpeedtalkからTelloに変えました</a>
</li>
<li class="post">
<a href="/improve_eng2.html">上級者向け英語学習法(実践編)</a>
</li>
<li class="post">
<a href="/improve_eng1.html">上級者向け英語学習法(考察編)</a>
</li>
<li class="post">
<a href="/vocabulary.html">オススメのボキャビル方法</a>
</li>
<li class="post">
<a href="/emacs_build.html">Rokcy LinuxとM1 MacBook上でemacsをソースからビルドしてみる</a>
</li>
</ul>
</section>
<section>
<h1>Categories</h1>
<ul id="recent_posts">
<li><a href="/category/blog.html">Blog</a></li>
<li><a href="/category/english.html">English</a></li>
<li><a href="/category/linux.html">Linux</a></li>
<li><a href="/category/python.html">Python</a></li>
<li><a href="/category/tech.html">Tech</a></li>
</ul>
</section>
<section>
<h1>Tags</h1>
<a href="/tag/blog.html">Blog</a>, <a href="/tag/amerikasheng-huo.html">アメリカ生活</a>, <a href="/tag/tech.html">Tech</a>, <a href="/tag/ying-yu.html">英語</a>, <a href="/tag/emacs.html">emacs</a>, <a href="/tag/sekiyuritei.html">セキュリティ</a>, <a href="/tag/investment.html">Investment</a>, <a href="/tag/python.html">Python</a>, <a href="/tag/english.html">English</a>, <a href="/tag/linux.html">Linux</a>, <a href="/tag/mac.html">Mac</a>, <a href="/tag/toraburu.html">トラブル</a>, <a href="/tag/game.html">game</a>, <a href="/tag/vacation.html">Vacation</a>, <a href="/tag/ying-yu-jiao-yu.html">英語教育</a>, <a href="/tag/ying-jian.html">英検</a> </section>
<section>
<h1>Social</h1>
<ul>
<li><a href="#" target="_blank">You can add links in your config file</a></li>
<li><a href="#" target="_blank">Another social link</a></li>
</ul>
</section>
<section>
<h1>Blogroll</h1>
<ul>
<li><a href="https://getpelican.com/" target="_blank">Pelican</a></li>
<li><a href="https://www.python.org/" target="_blank">Python.org</a></li>
<li><a href="https://palletsprojects.com/p/jinja/" target="_blank">Jinja2</a></li>
<li><a href="#" target="_blank">You can modify those links in your config file</a></li>
</ul>
</section>
</aside> </div>
</div>
<footer role="contentinfo"><p>
Copyright © 2020–2024 Kyos —
<span class="credit">Powered by <a href="http://getpelican.com">Pelican</a></span>
</p></footer>
<script src="/theme/js/modernizr-2.0.js"></script>
<script src="/theme/js/ender.js"></script>
<script src="/theme/js/octopress.js" type="text/javascript"></script>
</body>
</html>