{"id":6128,"date":"2020-06-14T19:10:15","date_gmt":"2020-06-14T17:10:15","guid":{"rendered":"https:\/\/pythonprogramming.altervista.org\/?p=6128"},"modified":"2020-06-16T08:44:15","modified_gmt":"2020-06-16T06:44:15","slug":"draw-with-pygame-and-save-image-live-coding","status":"publish","type":"post","link":"https:\/\/pythonprogramming.altervista.org\/draw-with-pygame-and-save-image-live-coding\/","title":{"rendered":"Draw with Pygame and Save Image &#8211; Live coding"},"content":{"rendered":"<p>Some live coding to draw on the screen. I&#8217;ve already made this once, but I wanted to make it simple because I have intention to add this feature to my latest project called pygpoint, a mix among pygame and powerpoint to show slides that are images like in powerpoint. In the last version of this program I added a blackboard where you can draw, but in another window. Now I want to add the feature so that you can also draw on the slides and have the chance to save also the image with the drawings on.<br \/>\nSo this is the code to implement this. Next time I will add it to pygpoint.<\/p>\n<h2>The code<\/h2>\n<pre class=\"lang:default decode:true \">import pygame as pg\r\n\r\n# pip install pygame==2.0.0.dev10\r\n\r\n\"\"\"\r\nWith this program you can draw on the \r\nscreen with pygame\r\n\r\n\r\npythonprogramming.altervista.org\r\n\"\"\"\r\n\r\ndef init():\r\n    global screen\r\n\r\n    pg.init()\r\n    screen = pg.display.set_mode((400, 400))\r\n    mainloop()\r\n\r\n\r\ndrawing = False\r\nlast_pos = None\r\nw = 1\r\ncolor = (255, 0, 255)\r\n\r\n\r\ndef draw(event):\r\n    global drawing, last_pos, w\r\n\r\n    if event.type == pg.MOUSEMOTION:\r\n        if (drawing):\r\n            mouse_position = pg.mouse.get_pos()\r\n            if last_pos is not None:\r\n                pg.draw.line(screen, color, last_pos, mouse_position, w)\r\n            last_pos = mouse_position\r\n    elif event.type == pg.MOUSEBUTTONUP:\r\n        mouse_position = (0, 0)\r\n        drawing = False\r\n        last_pos = None\r\n    elif event.type == pg.MOUSEBUTTONDOWN:\r\n        drawing = True\r\n\r\n\r\ndef mainloop():\r\n    global screen\r\n\r\n    loop = 1\r\n    while loop:\r\n        # checks every user interaction in this list\r\n        for event in pg.event.get():\r\n            if event.type == pg.QUIT:\r\n                loop = 0\r\n            if event.type == pg.KEYDOWN:\r\n                if event.key == pg.K_s:\r\n                    pg.image.save(screen, \"image.png\")\r\n            draw(event)\r\n        pg.display.flip()\r\n    pg.quit()\r\n\r\n\r\ninit()\r\n<\/pre>\n<h2>The live coding video of drawing on the screen with pygame<\/h2>\n<p><iframe loading=\"lazy\" title=\"Draw with Python and Pygame on the screen\" width=\"747\" height=\"420\" src=\"https:\/\/www.youtube.com\/embed\/XzUDfayFFSA?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>This project on repl.it<\/h2>\n<p><iframe loading=\"lazy\" width=\"100%\" height=\"400px\" src=\"https:\/\/repl.it\/@EducationalChan\/ColorfulKindheartedGraphs?lite=true\" scrolling=\"no\" frameborder=\"no\" allowtransparency=\"true\" allowfullscreen=\"allowfullscreen\" sandbox=\"allow-forms allow-pointer-lock allow-popups allow-same-origin allow-scripts allow-modals\"><\/iframe><\/p>\n<h2>How to clear the screen<\/h2>\n<p>drawnsave2.py<br \/>\n=============<br \/>\nchanges:<br \/>\nc to clear the screen:<br \/>\nI simply paint the screen in black when hit c key<br \/>\nscreen.fill((0, 0, 0))<\/p>\n<p><a href=\"https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2020\/06\/paintscreen.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-6138\" src=\"https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2020\/06\/paintscreen.png\" alt=\"\" width=\"689\" height=\"390\" srcset=\"https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2020\/06\/paintscreen.png 689w, https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2020\/06\/paintscreen-320x181.png 320w\" sizes=\"auto, (max-width: 689px) 100vw, 689px\" \/><\/a><\/p>\n<p>The code in the while loop in the mainloop function<\/p>\n<pre class=\"lang:default decode:true\">            if event.type == pg.KEYDOWN:\r\n                if event.key == pg.K_s:\r\n                    pg.image.save(screen, \"image.png\")\r\n                if event.key == pg.K_c:\r\n                    screen.fill((0, 0, 0))<\/pre>\n<h2>Save multiple images<\/h2>\n<p>With the following changes you can save different images with different names, progressively ordinated.<\/p>\n<pre class=\"lang:default decode:true \">import pygame as pg\r\n\r\n# pip install pygame==2.0.0.dev10\r\n\r\n\"\"\"\r\nWith this program you can draw on the \r\nscreen with pygame\r\n\r\n\r\npythonprogramming.altervista.org\r\n\r\ndrawnsave2.py\r\n=============\r\n    changes:\r\n        c to clear the screen:\r\n        I simply paint the screen in black when hit c key\r\n            screen.fill((0, 0, 0))\r\n\r\n\"\"\"\r\n\r\ndef init():\r\n    global screen\r\n\r\n    pg.init()\r\n    screen = pg.display.set_mode((400, 400))\r\n    mainloop()\r\n\r\n\r\ndrawing = False\r\nlast_pos = None\r\nw = 1\r\ncolor = (255, 0, 255)\r\n\r\n\r\ndef draw(event):\r\n    global drawing, last_pos, w\r\n\r\n    if event.type == pg.MOUSEMOTION:\r\n        if (drawing):\r\n            mouse_position = pg.mouse.get_pos()\r\n            if last_pos is not None:\r\n                pg.draw.line(screen, color, last_pos, mouse_position, w)\r\n            last_pos = mouse_position\r\n    elif event.type == pg.MOUSEBUTTONUP:\r\n        mouse_position = (0, 0)\r\n        drawing = False\r\n        last_pos = None\r\n    elif event.type == pg.MOUSEBUTTONDOWN:\r\n        drawing = True\r\n\r\n\r\ndef mainloop():\r\n    global screen\r\n\r\n    loop = 1\r\n    imagecount = 0\r\n    while loop:\r\n        # checks every user interaction in this list\r\n        for event in pg.event.get():\r\n            if event.type == pg.QUIT:\r\n                loop = 0\r\n            if event.type == pg.KEYDOWN:\r\n                if event.key == pg.K_s:\r\n                    if imagecount &lt; 10:\r\n                        imagecount = \"0\" + str(imagecount)\r\n                    pg.image.save(screen, \"image{}.png\".format(imagecount))\r\n                    imagecount = int(imagecount)\r\n                    imagecount +=1\r\n                if event.key == pg.K_c:\r\n                    screen.fill((0, 0, 0))\r\n            draw(event)\r\n        pg.display.flip()\r\n    pg.quit()\r\n\r\n\r\ninit()<\/pre>\n<h2>Lets see the images with imageslider<\/h2>\n<p>With this code you can opend another python file (I made this some times ago) to watch the files you created).<\/p>\n<pre class=\"lang:default decode:true \">                if event.key == pg.K_i:\r\n                    os.startfile(\"imageslider.py\")<\/pre>\n<h2>imageslider.py<\/h2>\n<p>This is the code of the program to watch the images<\/p>\n<pre class=\"lang:default decode:true \">import tkinter as tk\r\nimport glob\r\nfrom PIL import Image, ImageTk\r\nimport os\r\n\r\ndef insertfiles():\r\n    \"loads the list of files in the directory\"\r\n    for filename in glob.glob(\"*.png\"):\r\n        lst.insert(tk.END, filename)\r\n\r\n\r\ndef delete_item(event):\r\n    \"Deletes a file in the list: called by lst.bind('&lt;Control-d&gt;', delete_item)\"\r\n    n = lst.curselection()\r\n    os.remove(lst.get(n))\r\n    lst.delete(n)\r\n\r\n\r\ndef get_window_size():\r\n    \"Returns the width and height of the screen to set images and canvas alike it: called by root.bind &lt;Configure&gt;\"\r\n    root_w = root.winfo_width()\r\n    if root.winfo_width() &gt; 200 and root.winfo_height() &gt;30:\r\n        w = root.winfo_width() - 200\r\n        h = root.winfo_height() - 30\r\n    else:\r\n        w = 200\r\n        h = 30\r\n    return w, h\r\n\r\n\r\ndef showimg(event):\r\n    \"takes the selected image to show it, called by root.bind &lt;Configure&gt; and lst.bind &lt;&lt;ListboxSelect&gt;&gt;\"\r\n    n = lst.curselection()\r\n    filename = lst.get(n)\r\n    im = Image.open(filename)\r\n    im = im.resize((get_window_size()), Image.ANTIALIAS)\r\n    img = ImageTk.PhotoImage(im)\r\n    w, h = img.width(), img.height()\r\n    canvas.image = img\r\n    canvas.config(width=w, height=h)\r\n    canvas.create_image(0, 0, image=img, anchor=tk.NW)\r\n    root.bind(\"&lt;Configure&gt;\", lambda x: showimg(x))\r\n\r\n\r\n\r\nroot = tk.Tk()\r\n\r\nroot.geometry(\"800x600+300+50\")\r\nlst = tk.Listbox(root, width=20)\r\nlst.pack(side=\"left\", fill=tk.BOTH, expand=0)\r\nlst.bind(\"&lt;&lt;ListboxSelect&gt;&gt;\", showimg)\r\nlst.bind(\"&lt;Control-d&gt;\", delete_item)\r\ninsertfiles()\r\ncanvas = tk.Canvas(root)\r\ncanvas.pack()\r\n\r\nroot.mainloop()<\/pre>\n<p>Now you will see something like this<\/p>\n<p><a href=\"https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2020\/06\/domrthinh.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-6141\" src=\"https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2020\/06\/domrthinh.png\" alt=\"\" width=\"804\" height=\"631\" srcset=\"https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2020\/06\/domrthinh.png 804w, https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2020\/06\/domrthinh-320x251.png 320w, https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2020\/06\/domrthinh-768x603.png 768w, https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2020\/06\/domrthinh-280x220.png 280w\" sizes=\"auto, (max-width: 804px) 100vw, 804px\" \/><\/a><\/p>\n<h2>Let&#8217;s use it as an animator and the imageslider inside the main file<\/h2>\n<p>Now we can create gif pressing g and we can see the images in the image slider without the external file, because we put that code into a class insider the main file. Here is the code:<\/p>\n<pre class=\"lang:default decode:true \">import pygame as pg\r\nimport os\r\nimport glob\r\nfrom PIL import Image\r\nimport tkinter as tk\r\nfrom PIL import Image, ImageTk\r\n\r\n\r\n# pip install pygame==2.0.0.dev10\r\n\r\n\"\"\"\r\nWith this program you can draw on the \r\nscreen with pygame\r\n\r\n\r\npythonprogramming.altervista.org\r\n\r\ndrawnsave2.py\r\n=============\r\n    changes:\r\n        c to clear the screen:\r\n        I simply paint the screen in black when hit c key\r\n            screen.fill((0, 0, 0))\r\n        You can save all images with different progressive names\r\n        You can see the images with imageslider pressing i\r\ndrawnsave4.py\r\n        added g to make gif from saved files\r\n        now i opens imageslider from inside the progam drawnsave.py without external programs\r\n\r\n\"\"\"\r\n\r\ndef init():\r\n    global screen\r\n\r\n    pg.init()\r\n    screen = pg.display.set_mode((400, 400))\r\n    mainloop()\r\n\r\n\r\ndrawing = False\r\nlast_pos = None\r\nw = 1\r\ncolor = (255, 0, 255)\r\n\r\n\r\ndef draw(event):\r\n    global drawing, last_pos, w\r\n\r\n    if event.type == pg.MOUSEMOTION:\r\n        if (drawing):\r\n            mouse_position = pg.mouse.get_pos()\r\n            if last_pos is not None:\r\n                pg.draw.line(screen, color, last_pos, mouse_position, w)\r\n            last_pos = mouse_position\r\n    elif event.type == pg.MOUSEBUTTONUP:\r\n        mouse_position = (0, 0)\r\n        drawing = False\r\n        last_pos = None\r\n    elif event.type == pg.MOUSEBUTTONDOWN:\r\n        drawing = True\r\n\r\n\r\ndef mainloop():\r\n    global screen\r\n\r\n    loop = 1\r\n    imagecount = 0\r\n    while loop:\r\n        # checks every user interaction in this list\r\n        for event in pg.event.get():\r\n            if event.type == pg.QUIT:\r\n                loop = 0\r\n            if event.type == pg.KEYDOWN:\r\n                if event.key == pg.K_s:\r\n                    if imagecount &lt; 10:\r\n                        imagecount = \"0\" + str(imagecount)\r\n                    pg.image.save(screen, \"image{}.png\".format(imagecount))\r\n                    imagecount = int(imagecount)\r\n                    imagecount +=1\r\n                if event.key == pg.K_c:\r\n                    screen.fill((0, 0, 0))\r\n                if event.key == pg.K_i:\r\n                    ImgSlide()\r\n                elif event.key == pg.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            draw(event)\r\n        pg.display.flip()\r\n    pg.quit()\r\n\r\n\r\nclass ImgSlide():\r\n\r\n    def __init__(self):\r\n        self.root = tk.Tk()\r\n\r\n        self.root.geometry(\"800x600+300+50\")\r\n        self.lst = tk.Listbox(self.root, width=20)\r\n        self.lst.pack(side=\"left\", fill=tk.BOTH, expand=0)\r\n        self.lst.bind(\"&lt;&lt;ListboxSelect&gt;&gt;\", self.showimg)\r\n        self.lst.bind(\"&lt;Control-d&gt;\", self.delete_item)\r\n        self.canvas = tk.Canvas(self.root)\r\n        self.canvas.pack()\r\n        self.insertfiles()\r\n\r\n        self.root.mainloop()\r\n\r\n\r\n    def insertfiles(self):\r\n        \"loads the list of files in the directory\"\r\n        for filename in glob.glob(\"*.png\"):\r\n            self.lst.insert(tk.END, filename)\r\n\r\n\r\n    def delete_item(self, event):\r\n        \"Deletes a file in the list: called by self.lst.bind('&lt;Control-d&gt;', delete_item)\"\r\n        n = self.lst.curselection()\r\n        os.remove(lst.get(n))\r\n        lst.delete(n)\r\n\r\n\r\n    def get_window_size(self):\r\n        \"Returns the width and height of the screen to set images and self.canvas alike it: called by self.root.bind &lt;Configure&gt;\"\r\n        self.root_w = self.root.winfo_width()\r\n        if self.root.winfo_width() &gt; 200 and self.root.winfo_height() &gt;30:\r\n            w = self.root.winfo_width() - 200\r\n            h = self.root.winfo_height() - 30\r\n        else:\r\n            w = 200\r\n            h = 30\r\n        return w, h\r\n\r\n\r\n    def showimg(self, event):\r\n        \"takes the selected image to show it, called by self.root.bind &lt;Configure&gt; and lst.bind &lt;&lt;ListboxSelect&gt;&gt;\"\r\n        n = self.lst.curselection()\r\n        filename = self.lst.get(n)\r\n        im = Image.open(filename)\r\n        im = im.resize((self.get_window_size()), Image.ANTIALIAS)\r\n        img = ImageTk.PhotoImage(im)\r\n        w, h = img.width(), img.height()\r\n        self.canvas.image = img\r\n        self.canvas.config(width=w, height=h)\r\n        self.canvas.create_image(0, 0, image=img, anchor=tk.NW)\r\n        self.root.bind(\"&lt;Configure&gt;\", lambda x: self.showimg(x))\r\n\r\n\r\n\r\ninit()<\/pre>\n<p>&nbsp;<\/p>\n<!-- se vuoi mettere un testo scorrevole\r\n[hoops name=\"typeWriterGen\"]\r\n\r\npoi metti un id diverso per ogni testo nella stessa pagina\r\n\r\n<div id=\"div01\">\r\n<script>\r\n\r\ntypeWriterGen(\"div01\",\"Esempio di testo scorrevole\");\r\n<\/script>\r\n\r\n-->\r\n<style>\r\n.avatar {\r\n  vertical-align: middle;\r\n  width: 100px;\r\n  height: 100px;\r\n  border-radius: 50%;\r\n}\r\n<\/style>\r\n\r\n<hr>\r\n\r\n<!-- NEWSLETTER LINK -->\r\n<a href=\"https:\/\/docs.google.com\/forms\/d\/e\/1FAIpQLSf7TniIPCWHDzCSGh2dYZaCwDvi9yLKS5ovFdKuK1sdfOvwEg\/viewform\">\r\n<img decoding=\"async\" src=\"https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2023\/08\/image-13.png\" class=\"avatar\">\r\nSubscribe to the <b>newsletter<\/b> for updates<\/a><br>\r\n\r\n<!-- TKINTER TEMPLATE LINK -->\r\n<a href=\"https:\/\/pythonprogramming.altervista.org\/tkinter-templates\/\">\r\n<img decoding=\"async\" src=\"https:\/\/i0.wp.com\/pythonprogramming.altervista.org\/wp-content\/uploads\/2023\/07\/image-26.png\" class=\"avatar\">\r\nTkinter templates<\/a><br>\r\n\r\n<!-- MY AVATAR PUT A LINK TO YOUTUBE CHANNEL-->\r\n<iframe loading=\"lazy\" frameborder=\"0\" src=\"https:\/\/itch.io\/embed\/711828\" width=\"552\" height=\"167\"><a href=\"https:\/\/pythonprogrammi.itch.io\/pysnake\">PySnake by PythonProgrammi<\/a><\/iframe>\r\n<br>\r\n<style>\r\n.avatar {\r\n  vertical-align: middle;\r\n  width: 100px;\r\n  height: 100px;\r\n  border-radius: 50%;\r\n}\r\n<\/style>\r\n\r\n\r\n<a href=\"https:\/\/www.youtube.com\/channel\/UCzbxq5e9gLiY-je2-br1rvg\">\r\n\t<img decoding=\"async\" src=\"https:\/\/pythonprogramming.altervista.org\/wp-content\/uploads\/2020\/10\/avatar64x64.png\" alt=\"Avatar\" class=\"avatar\">\r\n\t My youtube channel<\/a><br>\r\n\r\n<br>\r\n\r\nTwitter: <a href=\"https:\/\/twitter.com\/pythonprogrammi\">@pythonprogrammi - python_pygame<\/a>\r\n<h3>Claude's Games<\/h3>\r\n<p><a href=\"https:\/\/pythonprogramming.altervista.org\/random-daily-game-1-arkanoid\/\">Arkanoid<\/a><br>\r\n<a href=\"https:\/\/pythonprogramming.altervista.org\/platform-2d-with-pygame-made-with-claude\/\">Platform 2d<\/a><\/p> <!-- videogames made with claude -->\r\n<a href=\"https:\/\/pythonprogramming.altervista.org\/artifacts-games-day-1-memory-game\/\">1. Memory game<\/a>\r\n<h4>Videos<\/h4>\r\n<a href=\"https:\/\/youtu.be\/ciLjWWw5pLY\">Speech recognition game<\/a>\r\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":"Some live coding to draw on the screen. I&#8217;ve already made this once, but I wanted to make it simple because I have \n<a class=\"moretag\" href=\"https:\/\/pythonprogramming.altervista.org\/draw-with-pygame-and-save-image-live-coding\/\"> [...]<\/a>","protected":false},"author":1,"featured_media":6130,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_crdt_document":"","footnotes":""},"categories":[1],"tags":[],"class_list":["post-6128","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-examples"],"avopt_banners_inside_post":true,"avopt_banners_on_page":true,"av_copy_from":"","av_sharing_message":"","av_sharing_allowed":true,"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\/6128","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=6128"}],"version-history":[{"count":8,"href":"https:\/\/pythonprogramming.altervista.org\/wp-json\/wp\/v2\/posts\/6128\/revisions"}],"predecessor-version":[{"id":6143,"href":"https:\/\/pythonprogramming.altervista.org\/wp-json\/wp\/v2\/posts\/6128\/revisions\/6143"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/pythonprogramming.altervista.org\/wp-json\/wp\/v2\/media\/6130"}],"wp:attachment":[{"href":"https:\/\/pythonprogramming.altervista.org\/wp-json\/wp\/v2\/media?parent=6128"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/pythonprogramming.altervista.org\/wp-json\/wp\/v2\/categories?post=6128"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/pythonprogramming.altervista.org\/wp-json\/wp\/v2\/tags?post=6128"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}