{"id":3801,"date":"2019-09-26T15:04:42","date_gmt":"2019-09-26T13:04:42","guid":{"rendered":"https:\/\/pythonprogramming.altervista.org\/?p=3801"},"modified":"2019-09-26T15:11:52","modified_gmt":"2019-09-26T13:11:52","slug":"pygame-draw-app-with-animation","status":"publish","type":"post","link":"https:\/\/pythonprogramming.altervista.org\/pygame-draw-app-with-animation\/","title":{"rendered":"Pygame: Draw app with Animation"},"content":{"rendered":"<p>In this simple drawing app made with pygame you will be able to draw on a black board, with just one color of one size using the mouse and the right mouse button. This is an improvement of a script I already posted this summer (2019).<\/p>\n<p>You can:<\/p>\n<ul>\n<li><strong>clear<\/strong> the screen (key <strong>c<\/strong>)<\/li>\n<li><strong>save<\/strong> the screen in a &#8220;screenshot.png&#8221; file (key<strong> s<\/strong>)<\/li>\n<li><strong>erase<\/strong> with right mouse button<\/li>\n<li>create an <strong>animated gif<\/strong> of the saved screenshot (key<strong> g<\/strong>)<\/li>\n<\/ul>\n<p>This is a screeshot taken with the app:<\/p>\n<p><a href=\"https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2019\/09\/screenshot.jpeg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3802\" src=\"https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2019\/09\/screenshot.jpeg\" alt=\"\" width=\"600\" height=\"400\" srcset=\"https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2019\/09\/screenshot.jpeg 600w, https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2019\/09\/screenshot-320x213.jpeg 320w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/a><\/p>\n<h2>Video and source code<\/h2>\n<p><iframe loading=\"lazy\" title=\"Pygame app to draw and make gif\" width=\"747\" height=\"420\" src=\"https:\/\/www.youtube.com\/embed\/nKl0DXgMFJ0?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<pre class=\"lang:default decode:true\">from PIL import Image\r\nimport pygame\r\nimport glob\r\nimport os\r\n\r\npygame.init()\r\nscreen = pygame.display.set_mode((600,400))\r\npygame.display.set_caption(\"Trace\")\r\nclock = pygame.time.Clock()\r\n\r\nloop = True\r\npress = False\r\ncolor = \"white\"\r\ncnt = 0\r\n[os.remove(png) for png in glob.glob(\"*png\")]\r\nwhile loop:\r\n    try:\r\n        #pygame.mouse.set_visible(False)\r\n        for event in pygame.event.get():\r\n            if event.type == pygame.QUIT:\r\n                loop = False\r\n            if event.type == pygame.KEYDOWN:\r\n                if event.key == pygame.K_c:\r\n                    screen.fill(pygame.Color(0, 0, 0))\r\n                if event.key == pygame.K_s:\r\n                    if cnt &lt; 10:\r\n                        pygame.image.save(screen, f\"screenshot0{cnt}.png\")\r\n                    else:\r\n                        pygame.image.save(screen, f\"screenshot{cnt}.png\")\r\n                    cnt += 1\r\n                if event.key == pygame.K_g:\r\n                        frames = []\r\n                        imgs = glob.glob(\"*.png\")\r\n                        for i in imgs:\r\n                            new_frame = Image.open(i)\r\n                            frames.append(new_frame)\r\n\r\n                        # Save into a GIF file that loops forever\r\n                        frames[0].save('animated.gif', format='GIF',\r\n                                       append_images=frames[1:],\r\n                                       save_all=True,\r\n                                       duration=300, loop=0)\r\n                        os.startfile(\"animated.gif\")\r\n\r\n    \r\n        px, py = pygame.mouse.get_pos()\r\n        if pygame.mouse.get_pressed() == (1,0,0):\r\n            pygame.draw.rect(screen, (255,255,255), (px,py,10,10))\r\n        if pygame.mouse.get_pressed() == (0,0,1):\r\n            pygame.draw.rect(screen, (0,0,0), (px,py,10,10))\r\n\r\n        if event.type == pygame.MOUSEBUTTONUP:\r\n            press == False\r\n        pygame.display.update()\r\n        clock.tick(1000)\r\n    except Exception as e:\r\n        print(e)\r\n        pygame.quit()\r\n        \r\npygame.quit()\r\n<\/pre>\n<p>You can save files that will be numbered with progressive numbers. So, if you want you can save many screens to make an animated gif from png&#8230; go to this link to read how to <a href=\"https:\/\/pythonprogramming.altervista.org\/png-to-gif\/\">create a gif from png files<\/a>. Press &#8220;<strong>s<\/strong>&#8221; many times as you draw to create the animation and then press &#8220;<strong>g<\/strong>&#8221; as you see in the video.<\/p>\n<p>Another post about making animated gif is <a href=\"https:\/\/pythonprogramming.altervista.org\/animated-cartoon-gif-with-pil-and-python-1\/\">here at this link<\/a>.\u00a0 There are other also, look for them in the search bar, writing gif. The following is an example of gif made with the app<\/p>\n<p><a href=\"https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2019\/09\/animated.gif\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3808\" src=\"https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2019\/09\/animated.gif\" alt=\"\" width=\"600\" height=\"400\" \/><\/a><\/p>\n<h3>Pygame's Platform Game<\/h3>\r\n\r\n<a href=\"https:\/\/pythonprogramming.altervista.org\/pygame-platform-game-5-sounds-and-mixer\/\"><img decoding=\"async\" src=\"https:\/\/i1.wp.com\/pythonprogramming.altervista.org\/wp-content\/uploads\/2020\/01\/climbercover.png?w=557&ssl=1\"\/ width=\"50%\"><\/a>\r\n<script>\r\nvar title = \"Platform Pygame\";\r\n\t\tvar links = [\r\n[\"https:\/\/pythonprogramming.altervista.org\/pygame-animation-of-a-sprite-v-1-3\/\",\"Animation 1.3\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/pygame-sprite-animation-v-2-better-coding-test-it-checking-fps-on-the-screen\/\",\"Animation 1.2\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/pygame-how-to-display-the-frame-rate-fps-on-the-screen\/\",\"Display Frame rate\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/pygame-sprite-animation-update\/\",\"Animation 1.1\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/pygame-platformer-1\/\",\"Pygame Platform Game 1\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/python-platform-game-2\/\",\"Pygame Platform 2\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/pygame-platform-game-3-recap-cheatsheet\/\",\"Pygame PLatform 3 - recap and some Cheat Sheet\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/pygame-platform-game-4-background-and-stuffs\/\",\"Pygame Platform 4 - Background & organizing code\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/pygame-platform-game-5-sounds-and-mixer\/\",\"Pygame Platform 5 - Sounds\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/platform-game-in-detail-part-1\/\",\"Game in detail part 1\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/map-maker-1-2\/\", \"Map maker 1.2\"]\r\n\t\t];\r\n\t\t<\/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>\r\n\r\n<h3>Other Pygame's posts<\/h3>\r\n\r\n<script>\r\nvar title = \"Pygame's Posts\"\r\nvar links = [\r\n[\"https:\/\/pythonprogramming.altervista.org\/pygame-platformer-1\/\",\"Platform game 1\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/make-a-platform-game-with-pygame-dafluffypotato\/\",\"DaFluffyPotato Platform Tutorials\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/python-and-classic-arcade-games-pong\/\",\"Pong Game Full\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/python-draws-in-colors-app-to-draw-with-pygame\/\",\"PyGameGIF 2\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/pygame-draw-app-with-animation\/\",\"PyGameGIF 1\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/pydraw-2-0-app-to-draw-gif\/\",\"PyDraw 2.0\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/pygame-drawing-2\/\",\"Draw with Pygame\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/animation-with-pygame\",\"Sprite animation 1\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/animation-on-pygame-2-free-characters-and-more-actions\/\",\"Sprite animation 2\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/starting-with-pygame\/\",\"Starting movements with Pygame\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/pygame-3-move-sprite\/\", \"Move a Sprite\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/pygame-4-fonts\/\",\"Text and Fonts\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/pygame-animate-a-sprite\/\", \"Animate a sprite\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/pygame-and-mouse-events\/\",\"Mouse events\"],\r\n[\"https:\/\/pythonprogramming.altervista.org\/pgp-aka-pygamepresentation-project\/\",\"Pygame presentation\"],\r\n\t[\"https:\/\/pythonprogramming.altervista.org\/moving-the-player-in-pygame-with-key-get_pressed\/\",\"How to use key.get_pressed()\"]\r\n]\r\n<\/script>\r\n\r\n\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 draw with pygame app\n<a class=\"moretag\" href=\"https:\/\/pythonprogramming.altervista.org\/pygame-draw-app-with-animation\/\"> [...]<\/a>","protected":false},"author":1,"featured_media":3809,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_crdt_document":"","footnotes":""},"categories":[1,191],"tags":[574,229,194],"class_list":["post-3801","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-examples","category-pygame","tag-draw","tag-mouse","tag-pygame"],"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\/3801","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=3801"}],"version-history":[{"count":6,"href":"https:\/\/pythonprogramming.altervista.org\/wp-json\/wp\/v2\/posts\/3801\/revisions"}],"predecessor-version":[{"id":4042,"href":"https:\/\/pythonprogramming.altervista.org\/wp-json\/wp\/v2\/posts\/3801\/revisions\/4042"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/pythonprogramming.altervista.org\/wp-json\/wp\/v2\/media\/3809"}],"wp:attachment":[{"href":"https:\/\/pythonprogramming.altervista.org\/wp-json\/wp\/v2\/media?parent=3801"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/pythonprogramming.altervista.org\/wp-json\/wp\/v2\/categories?post=3801"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/pythonprogramming.altervista.org\/wp-json\/wp\/v2\/tags?post=3801"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}