How to make a tkinter canvas background transparent?
I am making a chess program and I want to be able to drag the pieces. In order to do this, I put the image of the piece on a Canvas so it can be dragged (I can also use a Label if I want). However, when I drag the piece there is a white square that surrounds the image of the piece.

When I researched the problem, many people gave this solution:
drag_canvas = Canvas(self, height=80, width=80, bg="yellow")
root.wm_attributes("-transparentcolor", "yellow")
This caused the background to be transparent but it was not the chessboard that was visible, it was the program behind the GUI
.
Is there any way I can have the background be transparent and show the chessboard behind rather than the program behind the tkinter window?
Note: I do not mind using any other widget (e.g. a Label) but they must use modules that come default with Python (so no PIL) as this program needs to be used in an environment where I cannot download other modules.
python python-3.x canvas tkinter transparent
add a comment |
I am making a chess program and I want to be able to drag the pieces. In order to do this, I put the image of the piece on a Canvas so it can be dragged (I can also use a Label if I want). However, when I drag the piece there is a white square that surrounds the image of the piece.

When I researched the problem, many people gave this solution:
drag_canvas = Canvas(self, height=80, width=80, bg="yellow")
root.wm_attributes("-transparentcolor", "yellow")
This caused the background to be transparent but it was not the chessboard that was visible, it was the program behind the GUI
.
Is there any way I can have the background be transparent and show the chessboard behind rather than the program behind the tkinter window?
Note: I do not mind using any other widget (e.g. a Label) but they must use modules that come default with Python (so no PIL) as this program needs to be used in an environment where I cannot download other modules.
python python-3.x canvas tkinter transparent
Read this updating-tkinter-label-with-an-image
– stovfl
Oct 27 '18 at 17:09
@stovfl That uses PIL
– Milan Tom
Oct 28 '18 at 23:39
Your pices are allready transparent, why do you want to use a.Canvas(...? Edit your Question and add info about the image format.
– stovfl
Oct 29 '18 at 7:14
@stovfl Yes, they are transparent but in order to be dragged around the board, I need to put them on some sort of widget. This widget has a background which is not transparent so I needed to make the background transparent. I just used aCanvasbecause I thought that this would be the best way judging by similar posts on stackoverflow. So, if there is a way to accomplish this without aCanvasthen I am more than happy to use it.
– Milan Tom
Oct 29 '18 at 10:55
add a comment |
I am making a chess program and I want to be able to drag the pieces. In order to do this, I put the image of the piece on a Canvas so it can be dragged (I can also use a Label if I want). However, when I drag the piece there is a white square that surrounds the image of the piece.

When I researched the problem, many people gave this solution:
drag_canvas = Canvas(self, height=80, width=80, bg="yellow")
root.wm_attributes("-transparentcolor", "yellow")
This caused the background to be transparent but it was not the chessboard that was visible, it was the program behind the GUI
.
Is there any way I can have the background be transparent and show the chessboard behind rather than the program behind the tkinter window?
Note: I do not mind using any other widget (e.g. a Label) but they must use modules that come default with Python (so no PIL) as this program needs to be used in an environment where I cannot download other modules.
python python-3.x canvas tkinter transparent
I am making a chess program and I want to be able to drag the pieces. In order to do this, I put the image of the piece on a Canvas so it can be dragged (I can also use a Label if I want). However, when I drag the piece there is a white square that surrounds the image of the piece.

When I researched the problem, many people gave this solution:
drag_canvas = Canvas(self, height=80, width=80, bg="yellow")
root.wm_attributes("-transparentcolor", "yellow")
This caused the background to be transparent but it was not the chessboard that was visible, it was the program behind the GUI
.
Is there any way I can have the background be transparent and show the chessboard behind rather than the program behind the tkinter window?
Note: I do not mind using any other widget (e.g. a Label) but they must use modules that come default with Python (so no PIL) as this program needs to be used in an environment where I cannot download other modules.
python python-3.x canvas tkinter transparent
python python-3.x canvas tkinter transparent
edited Oct 28 '18 at 23:40
Milan Tom
asked Oct 27 '18 at 11:47
Milan TomMilan Tom
15910
15910
Read this updating-tkinter-label-with-an-image
– stovfl
Oct 27 '18 at 17:09
@stovfl That uses PIL
– Milan Tom
Oct 28 '18 at 23:39
Your pices are allready transparent, why do you want to use a.Canvas(...? Edit your Question and add info about the image format.
– stovfl
Oct 29 '18 at 7:14
@stovfl Yes, they are transparent but in order to be dragged around the board, I need to put them on some sort of widget. This widget has a background which is not transparent so I needed to make the background transparent. I just used aCanvasbecause I thought that this would be the best way judging by similar posts on stackoverflow. So, if there is a way to accomplish this without aCanvasthen I am more than happy to use it.
– Milan Tom
Oct 29 '18 at 10:55
add a comment |
Read this updating-tkinter-label-with-an-image
– stovfl
Oct 27 '18 at 17:09
@stovfl That uses PIL
– Milan Tom
Oct 28 '18 at 23:39
Your pices are allready transparent, why do you want to use a.Canvas(...? Edit your Question and add info about the image format.
– stovfl
Oct 29 '18 at 7:14
@stovfl Yes, they are transparent but in order to be dragged around the board, I need to put them on some sort of widget. This widget has a background which is not transparent so I needed to make the background transparent. I just used aCanvasbecause I thought that this would be the best way judging by similar posts on stackoverflow. So, if there is a way to accomplish this without aCanvasthen I am more than happy to use it.
– Milan Tom
Oct 29 '18 at 10:55
Read this updating-tkinter-label-with-an-image
– stovfl
Oct 27 '18 at 17:09
Read this updating-tkinter-label-with-an-image
– stovfl
Oct 27 '18 at 17:09
@stovfl That uses PIL
– Milan Tom
Oct 28 '18 at 23:39
@stovfl That uses PIL
– Milan Tom
Oct 28 '18 at 23:39
Your pices are allready transparent, why do you want to use a
.Canvas(...? Edit your Question and add info about the image format.– stovfl
Oct 29 '18 at 7:14
Your pices are allready transparent, why do you want to use a
.Canvas(...? Edit your Question and add info about the image format.– stovfl
Oct 29 '18 at 7:14
@stovfl Yes, they are transparent but in order to be dragged around the board, I need to put them on some sort of widget. This widget has a background which is not transparent so I needed to make the background transparent. I just used a
Canvas because I thought that this would be the best way judging by similar posts on stackoverflow. So, if there is a way to accomplish this without a Canvas then I am more than happy to use it.– Milan Tom
Oct 29 '18 at 10:55
@stovfl Yes, they are transparent but in order to be dragged around the board, I need to put them on some sort of widget. This widget has a background which is not transparent so I needed to make the background transparent. I just used a
Canvas because I thought that this would be the best way judging by similar posts on stackoverflow. So, if there is a way to accomplish this without a Canvas then I am more than happy to use it.– Milan Tom
Oct 29 '18 at 10:55
add a comment |
1 Answer
1
active
oldest
votes
Question: How to make a tkinter canvas background transparent?
The only possible config(... option, to set the background to nothing
c.config(bg='')
results with: _tkinter.TclError: unknown color name ""
To get this result:

you have to hold the chess board and figures within the same .Canvas(....
self.canvas = Canvas(self, width=500, height=200, bd=0, highlightthickness=0)
self.canvas.create_rectangle(245,50,345,150, fill='white')
self.image = tk.PhotoImage(file='chess.png')
self.image_id = self.canvas.create_image(50,50, image=self.image)
self.canvas.move(self.image_id, 245, 100)
Tested with Python: 3.5 - TkVersion: 8.6
Oh WOW! REALLY??? bg='' results in a transparent background? This is very cool indeed
– MikeyB
Oct 29 '18 at 20:01
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53021603%2fhow-to-make-a-tkinter-canvas-background-transparent%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
Question: How to make a tkinter canvas background transparent?
The only possible config(... option, to set the background to nothing
c.config(bg='')
results with: _tkinter.TclError: unknown color name ""
To get this result:

you have to hold the chess board and figures within the same .Canvas(....
self.canvas = Canvas(self, width=500, height=200, bd=0, highlightthickness=0)
self.canvas.create_rectangle(245,50,345,150, fill='white')
self.image = tk.PhotoImage(file='chess.png')
self.image_id = self.canvas.create_image(50,50, image=self.image)
self.canvas.move(self.image_id, 245, 100)
Tested with Python: 3.5 - TkVersion: 8.6
Oh WOW! REALLY??? bg='' results in a transparent background? This is very cool indeed
– MikeyB
Oct 29 '18 at 20:01
add a comment |
Question: How to make a tkinter canvas background transparent?
The only possible config(... option, to set the background to nothing
c.config(bg='')
results with: _tkinter.TclError: unknown color name ""
To get this result:

you have to hold the chess board and figures within the same .Canvas(....
self.canvas = Canvas(self, width=500, height=200, bd=0, highlightthickness=0)
self.canvas.create_rectangle(245,50,345,150, fill='white')
self.image = tk.PhotoImage(file='chess.png')
self.image_id = self.canvas.create_image(50,50, image=self.image)
self.canvas.move(self.image_id, 245, 100)
Tested with Python: 3.5 - TkVersion: 8.6
Oh WOW! REALLY??? bg='' results in a transparent background? This is very cool indeed
– MikeyB
Oct 29 '18 at 20:01
add a comment |
Question: How to make a tkinter canvas background transparent?
The only possible config(... option, to set the background to nothing
c.config(bg='')
results with: _tkinter.TclError: unknown color name ""
To get this result:

you have to hold the chess board and figures within the same .Canvas(....
self.canvas = Canvas(self, width=500, height=200, bd=0, highlightthickness=0)
self.canvas.create_rectangle(245,50,345,150, fill='white')
self.image = tk.PhotoImage(file='chess.png')
self.image_id = self.canvas.create_image(50,50, image=self.image)
self.canvas.move(self.image_id, 245, 100)
Tested with Python: 3.5 - TkVersion: 8.6
Question: How to make a tkinter canvas background transparent?
The only possible config(... option, to set the background to nothing
c.config(bg='')
results with: _tkinter.TclError: unknown color name ""
To get this result:

you have to hold the chess board and figures within the same .Canvas(....
self.canvas = Canvas(self, width=500, height=200, bd=0, highlightthickness=0)
self.canvas.create_rectangle(245,50,345,150, fill='white')
self.image = tk.PhotoImage(file='chess.png')
self.image_id = self.canvas.create_image(50,50, image=self.image)
self.canvas.move(self.image_id, 245, 100)
Tested with Python: 3.5 - TkVersion: 8.6
answered Oct 29 '18 at 13:57
stovflstovfl
7,60931031
7,60931031
Oh WOW! REALLY??? bg='' results in a transparent background? This is very cool indeed
– MikeyB
Oct 29 '18 at 20:01
add a comment |
Oh WOW! REALLY??? bg='' results in a transparent background? This is very cool indeed
– MikeyB
Oct 29 '18 at 20:01
Oh WOW! REALLY??? bg='' results in a transparent background? This is very cool indeed
– MikeyB
Oct 29 '18 at 20:01
Oh WOW! REALLY??? bg='' results in a transparent background? This is very cool indeed
– MikeyB
Oct 29 '18 at 20:01
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53021603%2fhow-to-make-a-tkinter-canvas-background-transparent%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Read this updating-tkinter-label-with-an-image
– stovfl
Oct 27 '18 at 17:09
@stovfl That uses PIL
– Milan Tom
Oct 28 '18 at 23:39
Your pices are allready transparent, why do you want to use a
.Canvas(...? Edit your Question and add info about the image format.– stovfl
Oct 29 '18 at 7:14
@stovfl Yes, they are transparent but in order to be dragged around the board, I need to put them on some sort of widget. This widget has a background which is not transparent so I needed to make the background transparent. I just used a
Canvasbecause I thought that this would be the best way judging by similar posts on stackoverflow. So, if there is a way to accomplish this without aCanvasthen I am more than happy to use it.– Milan Tom
Oct 29 '18 at 10:55