質問編集履歴

4

2019/01/10 12:16

投稿

tomo1998
tomo1998

スコア34

test CHANGED
@@ -1 +1 @@
1
- 背景のみ透明になるCanvasを作成したい
1
+ Canvasの地色のみ透明にしたい
test CHANGED
File without changes

3

コード追加

2019/01/10 12:16

投稿

tomo1998
tomo1998

スコア34

test CHANGED
File without changes
test CHANGED
@@ -126,6 +126,22 @@
126
126
 
127
127
 
128
128
 
129
+ Back_Ground_Layer=tk.Cancas.....
130
+
131
+ Character_Layer=tk.Cancas.....
132
+
133
+ Object_Layer=tk.Cancas.....
134
+
135
+
136
+
137
+ ゲームの背景=Back_Ground_Layer.create_image.....
138
+
139
+ キャラクター=Character_Layer.create_image.....
140
+
141
+ 手前側オブジェクト=Object_Layer.create_image.....
142
+
143
+
144
+
129
145
  しかしそこで他の問題がありまして・・・
130
146
 
131
147
  実は、Canvasを作成するときには、Canvasの地色も設定しないといけないのですが、この地色が問題なのです。

2

内容と画像の追加

2019/01/10 12:15

投稿

tomo1998
tomo1998

スコア34

test CHANGED
File without changes
test CHANGED
@@ -2,13 +2,41 @@
2
2
 
3
3
 
4
4
 
5
- GUIを使っゲームを作っているのですが、画面表示を昔のゲームの様に、スプライトを使ったものにしたいと考えています。
5
+ 今tkinterのCanvasを使っゲームを作っています。
6
6
 
7
- つまり、背景画像表示を担当するCanvas,キャラ表示を担当するCanvasを作成してそれを重ね合わせて作る、といった感じです。
8
7
 
9
- しかしそのためにはまず手前に来るCanvas,つまりキャラ表示を担当するCanvasの背景(物が配置されていない部分)を透明化させて後ろ側に来る背景の画像を表示するCanvasを見えるようにする必要があります。
10
8
 
9
+ しかし1つ問題があり、canvasではオブジェクト同士が重なると、新しく作成されたオブジェクトのほうが上の様に来るようになります。
10
+
11
+
12
+
13
+ 例えば、ゲーム内の画面では、背景の上にキャラクターが来て、キャラクターの前に手前側オブジェクトが来る、といった仕組みになっているのでこれを作成しようと思えば・・・
14
+
15
+ canvas=tk.Cancas.....
16
+
17
+ ゲームの背景=canvas.create_image.....
18
+
19
+ キャラクター=canvas.create_image.....
20
+
21
+ 手前側オブジェクト=canvas.create_image.....
22
+
11
- しかし、どうもうく行きません・・・
23
+ といった順番で作成されす。
24
+
25
+
26
+
27
+ しかし、ゲーム中で新しいキャラクターを登場させることになれば、それは手前側オブジェクトよりも新しく作成されることになるので、その新しいキャラクターとオブジェクトが重なったら、キャラクターが手前側に来てしまいます。
28
+
29
+
30
+
31
+ つまり、
32
+
33
+ 手前側オブジェクト=canvas.create_image.....
34
+
35
+ の後で
36
+
37
+ キャラクター2=canvas.create_image.....
38
+
39
+ をすると、キャラクター2が手前側オブジェクトの前に来てしまう。
12
40
 
13
41
 
14
42
 
@@ -84,15 +112,31 @@
84
112
 
85
113
  ### 試したこと
86
114
 
87
- Canvas作成時に
88
-
89
- tk.Canvas(bg="Transparent")とか書いてみたりしましたがダメでした・・・
115
+ そこでこの問題を解決するには、1つのCanvas上に画像を生成するのではなく、ゲーム背景専用、キャラークター専用そして手前側オブジェクト専用のCanvasを作成して、Canvasを重ね合わせて、それぞれのオブジェクト(ゲーム背景、キャラクター、オブジェクト)をそれぞれの対応するCanvas(ゲーム背景専用、キャラークター専用そして手前側オブジェクト専用)で作成すれば問題は解決できると思うんです。
90
116
 
91
117
 
92
118
 
93
- ネットで調べてて、こちらサイト拝見したのですが、tkinterで作成した画面を丸ご透明にするという方法を使っていました。しかしこれでは画面上に生成したものが透明なってしまいます( ̄▽ ̄;)
119
+ つまり、1つのCanvasの上にすべての画像を作成しようとすると、新しいもの表示されてしまうけど
94
120
 
121
+ それぞれのCanvasで新しい画像を生成しても、その上にはほかのCanvasがあるからしっかりと期待した順番に表示される という感じになると思うんです。
122
+
123
+
124
+
125
+ ![イメージ](6ec67c795b06530198e75566ac5072c5.png)
126
+
127
+
128
+
129
+ しかしそこで他の問題がありまして・・・
130
+
131
+ 実は、Canvasを作成するときには、Canvasの地色も設定しないといけないのですが、この地色が問題なのです。
132
+
95
- https://stackoverflow.com/questions/42869590/python-tkinter-canvas-transparent?noredirect=1&lq=1
133
+ 地色を透明に出来れば、下に来るCanvasのアイテムも見れるようになるのですが、透明になれなければ下のCanvasを覆いかぶさなってしまいます。
134
+
135
+
136
+
137
+ そこで、Canvasの地色を透明にする方法を探しているのですが・・・どうすればいいでしょうか?
138
+
139
+ また、他の解決方法などはありますでしょうか?
96
140
 
97
141
 
98
142
 

1

コードを追加

2019/01/10 12:13

投稿

tomo1998
tomo1998

スコア34

test CHANGED
File without changes
test CHANGED
@@ -9,6 +9,76 @@
9
9
  しかしそのためにはまず手前に来るCanvas,つまりキャラ表示を担当するCanvasの背景(物が配置されていない部分)を透明化させて後ろ側に来る背景の画像を表示するCanvasを見えるようにする必要があります。
10
10
 
11
11
  しかし、どうもうまく行きません・・・
12
+
13
+
14
+
15
+ ### 該当のソースコード
16
+
17
+
18
+
19
+ ```python
20
+
21
+ import tkinter as tk
22
+
23
+
24
+
25
+ class App(object):
26
+
27
+ def GUI(self):
28
+
29
+ root=tk.Tk()
30
+
31
+ root.geometry("300x300")
32
+
33
+ img001=tk.PhotoImage(file="picture001.png")
34
+
35
+ img002=tk.PhotoImage(file="picture002.png")
36
+
37
+
38
+
39
+ #奥側のCanvas
40
+
41
+ Background_Layer=tk.Canvas(width=400, height=400)
42
+
43
+ Background_Layer.place(x=0,y=0)
44
+
45
+ #手前のCanvas
46
+
47
+ Floor_Layer=tk.Canvas(width=400, height=400)
48
+
49
+ Floor_Layer.place(x=0,y=0)
50
+
51
+
52
+
53
+ #奥側のCanvasに書くもの
54
+
55
+ Background_Img=Background_Layer.create_image(220, 220, image=img001)
56
+
57
+ #手前のCanvasに書くもの
58
+
59
+ item_Img=Floor_Layer.create_image(20, 20, image=img002)
60
+
61
+
62
+
63
+ #id = Floor_Layer.create_bitmap(0, 0,bitmap=img002)うまく行かなかった・・・
64
+
65
+
66
+
67
+ root.mainloop()
68
+
69
+
70
+
71
+
72
+
73
+ app=App()
74
+
75
+ app.GUI()
76
+
77
+
78
+
79
+ ```
80
+
81
+
12
82
 
13
83
 
14
84