{"id":2308,"date":"2019-07-16T10:58:31","date_gmt":"2019-07-16T08:58:31","guid":{"rendered":"https:\/\/pythonprogramming.altervista.org\/?p=2308"},"modified":"2019-09-01T11:45:53","modified_gmt":"2019-09-01T09:45:53","slug":"tkinter-python-app-to-resize-images-part-1","status":"publish","type":"post","link":"https:\/\/pythonprogramming.altervista.org\/tkinter-python-app-to-resize-images-part-1\/","title":{"rendered":"Tkinter &#038; Python App to resize images (part. 1)"},"content":{"rendered":"<p>In this first part we will see how to build an app to resize images. The app will be very basic, just to show a practical application of tkinter and Python.<\/p>\n<h2>Where those lines of code at the beginning come<\/h2>\n<p>This will take the code that we&#8217;ve seen in another <a href=\"https:\/\/pythonprogramming.altervista.org\/make-covers-with-pil\/\">post to make covers for Youtube<\/a> with the <strong>PIL<\/strong> module, so I invite you to read that one before you watch this video below, if you do not get immediately the first lines of code. I am going to use a <strong>function<\/strong> that i made for that purpose to create an app with a <strong>GUI<\/strong> (graphic user interface) that makes easier to resize images. We will see the images in a folder and then we can select an image and resize them clicking a button. Nothin&#8217; too fancy, but useful to get a little into the way tkinter works to make a little more easy to use the function (shrink), withount having to change the code of the app everytime we want to resize an image.<\/p>\n<h2>Import<\/h2>\n<p>We need to import Image form PIL, for images, tkinter for the GUI and glob to search files<\/p>\n<ul>\n<li>from PIL import Image<\/li>\n<li>import tkinter as tk<\/li>\n<li>import glob<\/li>\n<\/ul>\n<pre class=\"lang:default decode:true \">from PIL import Image\r\nimport tkinter as tk\r\nimport glob<\/pre>\n<p>Then we will create a class that will create a window with the widgets for an image, the list of images in the folder, an entry for the shrink ratio (how much we want to make the image smaller&#8230; or bigger) and a button to do the action.<\/p>\n<p><a href=\"https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2019\/07\/shrink_sketch.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-2977\" src=\"https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2019\/07\/shrink_sketch.png\" alt=\"\" width=\"819\" height=\"460\" srcset=\"https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2019\/07\/shrink_sketch.png 819w, https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2019\/07\/shrink_sketch-320x180.png 320w, https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2019\/07\/shrink_sketch-768x431.png 768w\" sizes=\"auto, (max-width: 819px) 100vw, 819px\" \/><\/a><\/p>\n<h2>The image in the label<\/h2>\n<p>After we created a window and a frame<\/p>\n<pre class=\"lang:default decode:true\">class Resize:\r\n    def __init__(\r\n                self,image=\"\",\r\n                shrink_ratio=2):\r\n\r\n        self.image = image\r\n        self.root = tk.Tk()\r\n        self.root.title(\"Shrink\")\r\n        self.frame = tk.Frame(self.root)\r\n        self.frame.pack()<\/pre>\n<p>we do create a label with the image passed to the class Resize<\/p>\n<pre class=\"lang:default decode:true \">        self.img = tk.PhotoImage(file=self.image)\r\n        self.label = tk.Label(self.root, image=self.img)\r\n        self.label.pack()<\/pre>\n<p>I think it&#8217;s a good idea to put a label below the image in wich we will show the name of the image, the size and the with and height of it.<\/p>\n<pre class=\"lang:default decode:true \">        self.lab1 = tk.Label(self.root)\r\n        self.lab1['text'] = \"...\"\r\n        self.lab1.pack()<\/pre>\n<p>At the moment we do not write anything, until something is selected in the listbox below:<\/p>\n<pre class=\"lang:default decode:true \">        self.listbox = tk.Listbox(self.root)\r\n        self.listbox.pack(fill=tk.BOTH)<\/pre>\n<p>Before we make the listbox visible, we populate it with the files in the folder with the glob function<\/p>\n<pre class=\"lang:default decode:true \">        for file in glob.glob(\"*.png\"):\r\n            self.listbox.insert(0, file)\r\n        self.lab2 = tk.Label(self.root, text=\"Insert ratio to shrink image (2=50%)\")\r\n        self.lab2.pack()<\/pre>\n<p>Finally we add the entry widget that will tell how much we will resize the image. We must add a button to save the file resized.<\/p>\n<pre class=\"lang:default decode:true \">        self.entry = tk.Entry(self.root)\r\n        self.entry.pack()\r\n        self.root.mainloop()<\/pre>\n<p>&nbsp;<\/p>\n<h2>When we will see the entire code<\/h2>\n<p>This is just the first part, where we place the tkinter widgets in the window. In the second part we will see how to make the GUI interact with the user to do the job. It will probably be onlilne for the 18\/07\/2019.<\/p>\n<p><iframe loading=\"lazy\" title=\"Resizing Images App with Python, PIL and Tkinter (part.1)\" width=\"747\" height=\"420\" src=\"https:\/\/www.youtube.com\/embed\/Xk2AcR4AC6w?feature=oembed&amp;enablejsapi=1\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe><\/p>\n<h2>The code until now<\/h2>\n<pre class=\"lang:default decode:true \">from PIL import Image\r\nimport tkinter as tk\r\nimport glob\r\n\r\nclass Resize:\r\n    def __init__(\r\n                self,image=\"\",\r\n                shrink_ratio=2):\r\n\r\n        self.image = image\r\n        self.root = tk.Tk()\r\n        self.root.title(\"Shrink\")\r\n        self.frame = tk.Frame(self.root)\r\n        self.frame.pack()\r\n        self.img = tk.PhotoImage(file=self.image)\r\n        self.label = tk.Label(self.root, image=self.img)\r\n        self.label.pack()\r\n        self.lab1 = tk.Label(self.root)\r\n        self.lab1['text'] = \"...\"\r\n        self.lab1.pack()\r\n        self.listbox = tk.Listbox(self.root)\r\n        self.listbox.pack(fill=tk.BOTH)\r\n        for file in glob.glob(\"*.png\"):\r\n            self.listbox.insert(0, file)\r\n        self.lab2 = tk.Label(self.root, text=\"Insert ratio to shrink image (2=50%)\")\r\n        self.lab2.pack()\r\n        self.entry = tk.Entry(self.root)\r\n        self.entry.pack()\r\n        self.root.mainloop()\r\n\r\n\r\napp = GUI(image = \"h:\\\\jupyter\\\\covermaker\\\\imgs\\\\python_big.png\",\r\n            shrink_ratio = 2)<\/pre>\n<h2>The output window<\/h2>\n<p><a href=\"https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2019\/07\/shrikapp.png\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-2974 aligncenter\" src=\"https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2019\/07\/shrikapp.png\" alt=\"\" width=\"623\" height=\"452\" srcset=\"https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2019\/07\/shrikapp.png 746w, https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2019\/07\/shrikapp-320x232.png 320w\" sizes=\"auto, (max-width: 623px) 100vw, 623px\" \/><\/a><\/p>\n<h2>To be continued&#8230;<\/h2>\n<p>&nbsp;<\/p>\n<h2>The app is a spin off of this code: Make a cover image with Python<\/h2>\n<blockquote><p>A different project. While I am doing this post, I am using the following code to make covers. I just mentioned this in another post, but I want to show you a way to make a script that does not use a GUI. This has always the shrink function inside of it.<\/p>\n<p>If you do not want to use a GUI, I have this code that is pretty easy to modify, even if there is no GUI, and I think it is not too unconfortable to read.<\/p><\/blockquote>\n<pre class=\"lang:default decode:true\">from PIL import Image, ImageFont, ImageDraw\r\nimport os\r\n\r\nclass App:\r\n    size = 600, 400\r\n    background = (\"darkred\")\r\n    img = \"logo.png\"\r\n    shrink = 2 # use this in case you need to resize the image in the middle\r\n    fnt = \"arial\", 38\r\n    title = \"Images in Powerpoint\\n with Python\"\r\n    subtitle = \"The module python-pptx\"\r\n    filename = \"output\\\\\" + img[:-4] + \"_cover.png\" # do not need to change this\r\n\r\nfnt = ImageFont.truetype(App.fnt[0], App.fnt[1])\r\nfnt2 = ImageFont.truetype(\"arial\", 28)\r\nimg = Image.new(\"RGB\", (App.size), color=App.background)\r\n\r\ndef shrink(link, ratio=2):\r\n    img = Image.open(link)\r\n    w,h = img.size\r\n    w = w \/\/ ratio # 2 is 50%\r\n    h = h \/\/ ratio\r\n    img = img.resize((w,h), Image.ANTIALIAS)\r\n    return img\r\n\r\ndef middle(img, m=2):\r\n    return App.size[0] \/\/ m -img.size[0] \/\/ m, App.size[1] \/\/ 2 - img.size[1] \/\/ 4\r\n\r\n\r\nimg_middle = shrink(App.img, App.shrink)\r\ndraw = ImageDraw.Draw(img)\r\ntitle = App.title\r\nsubtitle = App.subtitle\r\ndraw.text((48,30), title, font=fnt)\r\ndraw.text((50,115), subtitle, font=fnt2)\r\nhalf4 = (middle(img_middle,2))\r\nimg.paste(img_middle, half4, img_middle)\r\nimg.save(App.filename)\r\nimg.show()<\/pre>\n<h3>The output<\/h3>\n<p>I used the output for a cover of <a href=\"https:\/\/youtu.be\/Xk2AcR4AC6w\">my youtube video<\/a> and a post on my blog pythonprogramming.altervista.org about powerpoint and python:<\/p>\n<p><a href=\"https:\/\/pythonprogramming.altervista.org\/tkinter-python-app-to-resize-images-part-1\/\"><img loading=\"lazy\" decoding=\"async\" class=\" wp-image-2309 aligncenter\" src=\"https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2019\/07\/Tkinter-.png\" alt=\"\" width=\"263\" height=\"175\" srcset=\"https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2019\/07\/Tkinter-.png 600w, https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2019\/07\/Tkinter--320x213.png 320w\" sizes=\"auto, (max-width: 263px) 100vw, 263px\" \/><\/a><\/p>\n<script>\r\nlet title = \"PIL - elaborate images\"\r\nlet links = [\r\n[\"https:\/\/pythonprogramming.altervista.org\/add-some-text-as-a-chunk-into-a-png-file-and-recover-it\/\",\"Input and recover text into a png with PIL\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/split-images-with-pil-aka-pillow-and-python-for-sprite-animation\/\",\"Crop Images\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/a-brief-guide-to-pil-python-image-library\/\",\"PIL GUIDE\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/a-matrix-wallpaper-with-python-and-pil-1\/\",\"Matrix wallpaper with PIL\"],\r\n\t[\"https:\/\/pythonprogramming.altervista.org\/cheat-sheet-for-pythons-pil-module\/\",\"Pil Cheat sheet\"],\r\n\t[\"https:\/\/pythonprogramming.altervista.org\/animated-cartoon-gif-with-pil-and-python-1\/\",\"Animated Gif\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/installing-pil-on-python-3-7-to-make-thumbnails\/\",\"Install PIL and make thumbnail\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/make-an-image-with-text-with-python\/\",\"Create an image with text\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/transform-a-png-in-a-thumbnail\/\",\"Make a thumbnail (2)\"],\r\n\t[\"https:\/\/pythonprogramming.altervista.org\/powerpoint-pil-png-animated-gif\/\",\"Gif with Powerpoint and PIL\"],\r\n\t[\"https:\/\/pythonprogramming.altervista.org\/resize-images-with-pil\/\",\"Resize Images\"],\r\n\t\r\n\t];\r\n<\/script>\r\n<script>\r\n\t\r\nif (typeof next2 != \"undefined\"){let next2 = 0;}\r\n\t\r\nnext2 = 0;\r\n\thtml = \"\";\/\/<b style='color:coral;font-size:1.2em'>Other posts about \" + title + \"<\/b><br>\";\r\nfor (address of links) \r\n{\r\n\r\n\tif (next2 == 1){\r\n\t\thtml += \"<div style='background:coral'>\";\r\n\t\thtml += \"Next link => <a href='\" + address[0] + \"'>\" + address[1] + \"<\/a>\";\r\n\t\thtml += \"<\/div><br>\";\r\n\t\tnext2 = 0;\r\n\t}\r\n\tif (address[0] == document.URL) {\r\n\t\tnext2 = 1;\r\n\t}\r\n}\r\n\r\nif (typeof next != \"undefined\") {let next = 0;}\r\nif (typeof addressStart != \"undefined\") {let addressStart = \"\";}\r\nnext = 0;\r\naddressStart = \"<a href='\";\r\nfor (address of links) {\r\n\tif (next == 1){\r\n\t\thtml += \">>>\" + addressStart + address[0] + \"'>\" + address[1] + \"<\/a><br>\";\r\n\t\tnext = 0;\r\n\t}\r\n\telse if (addressStart + address[0] != document.URL)\r\n\t{\r\n\t\thtml += addressStart + address[0] + \"'>\" + address[1] + \"<\/a><br>\";\r\n\t}\r\n\telse\r\n\t{\r\n\t\tnext = 1;\r\n\t\tnext_address = address[0]\r\n\t\tnext_title = address[1]\r\n\t\thtml += \"<span style='color:gray'>\" + address[1] + \"<\/span><br>\";\r\n\t}\r\n\r\n}\r\n\r\n\thtml += `<span style=\"font-size:8px\">Powered by <a href=\"https:\/\/pythonprogramming.altervista.org\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-2673\" src=\"https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2019\/06\/altervista2.png\" alt=\"\" width=\"70\" height=\"25\" srcset=\"https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2019\/06\/altervista2.png 156w, https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2019\/06\/altervista2-150x56.png 150w\" sizes=\"auto, (max-width: 70px) 100vw, 70px\" \/>pythonprogramming.altervista.org<\/a><\/span>`\r\n\thtml = \"<div style='background:yellow'>\" + html + \"<\/div>\";\r\n\tdocument.write(html)\r\n<\/script>\n","protected":false},"excerpt":{"rendered":"How to resize an image with an app using tkinter, pil and python.\n<a class=\"moretag\" href=\"https:\/\/pythonprogramming.altervista.org\/tkinter-python-app-to-resize-images-part-1\/\"> [...]<\/a>","protected":false},"author":1,"featured_media":2309,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_crdt_document":"","footnotes":""},"categories":[49],"tags":[161,162,4,446,51],"class_list":["post-2308","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tkinter","tag-pil","tag-pillow","tag-python","tag-resize","tag-tkinter"],"avopt_banners_inside_post":true,"avopt_banners_on_page":true,"av_copy_from":"","av_sharing_message":"","av_sharing_allowed":false,"av_sharing_on":{"fb":[],"tw":[]},"av_allow_affiliate_banner":false,"av_allow_affiliate_multi_banner":false,"av_show_affiliation_buy_button":false,"av_post_rating":true,"av_have_post_rating_value":false,"av_is_artificial_intelligence_content":false,"_links":{"self":[{"href":"https:\/\/pythonprogramming.altervista.org\/wp-json\/wp\/v2\/posts\/2308","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/pythonprogramming.altervista.org\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/pythonprogramming.altervista.org\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/pythonprogramming.altervista.org\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/pythonprogramming.altervista.org\/wp-json\/wp\/v2\/comments?post=2308"}],"version-history":[{"count":9,"href":"https:\/\/pythonprogramming.altervista.org\/wp-json\/wp\/v2\/posts\/2308\/revisions"}],"predecessor-version":[{"id":2979,"href":"https:\/\/pythonprogramming.altervista.org\/wp-json\/wp\/v2\/posts\/2308\/revisions\/2979"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/pythonprogramming.altervista.org\/wp-json\/wp\/v2\/media\/2309"}],"wp:attachment":[{"href":"https:\/\/pythonprogramming.altervista.org\/wp-json\/wp\/v2\/media?parent=2308"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/pythonprogramming.altervista.org\/wp-json\/wp\/v2\/categories?post=2308"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/pythonprogramming.altervista.org\/wp-json\/wp\/v2\/tags?post=2308"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}