How to make a tkinter canvas background transparent?












3















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.



enter image description here



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



enter image description here.



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.










share|improve this question

























  • 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 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


















3















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.



enter image description here



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



enter image description here.



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.










share|improve this question

























  • 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 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
















3












3








3








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.



enter image description here



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



enter image description here.



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.










share|improve this question
















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.



enter image description here



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



enter image description here.



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






share|improve this question















share|improve this question













share|improve this question




share|improve this question








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 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





















  • 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 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



















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














1 Answer
1






active

oldest

votes


















3















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:



enter image description here



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






share|improve this answer
























  • Oh WOW! REALLY??? bg='' results in a transparent background? This is very cool indeed

    – MikeyB
    Oct 29 '18 at 20:01













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
});


}
});














draft saved

draft discarded


















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









3















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:



enter image description here



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






share|improve this answer
























  • Oh WOW! REALLY??? bg='' results in a transparent background? This is very cool indeed

    – MikeyB
    Oct 29 '18 at 20:01


















3















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:



enter image description here



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






share|improve this answer
























  • Oh WOW! REALLY??? bg='' results in a transparent background? This is very cool indeed

    – MikeyB
    Oct 29 '18 at 20:01
















3












3








3








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:



enter image description here



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






share|improve this answer














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:



enter image description here



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







share|improve this answer












share|improve this answer



share|improve this answer










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





















  • 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




















draft saved

draft discarded




















































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.




draft saved


draft discarded














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





















































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







這個網誌中的熱門文章

Academy of Television Arts & Sciences

L'Équipe

1995 France bombings