{ "componentChunkName": "component---src-templates-course-content-template-js", "path": "/osa-13/1-pygame", "result": {"data":{"page":{"htmlAst":{"type":"element","tagName":"div","properties":{},"children":[{"type":"element","tagName":"text-box","properties":{"variant":"learningObjectives","name":"Inlärningsmål"},"children":[{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Efter den här delen"}]},{"type":"element","tagName":"ul","properties":{},"children":[{"type":"text","value":"\n"},{"type":"element","tagName":"li","properties":{},"children":[{"type":"text","value":"Har du installerat pygame-biblioteket på din dator"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"li","properties":{},"children":[{"type":"text","value":"Vet du hur man skapar ett pygame-fönster och hur man avslutar ett program"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"li","properties":{},"children":[{"type":"text","value":"Kommer du att kunna använda en bild som lagras i en fil i ett pygame-fönster"}]},{"type":"text","value":"\n"}]}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"I de här två sista delarna av kursmaterialet kommer vi att bekanta oss med pygame-biblioteket. Det är ett Python-bibliotek för programmering av spel. Det hjälper dig att skapa grafiska element, hantera händelser från tangentbordet och musen samt implementera andra funktioner som är nödvändiga i spel."}]},{"type":"element","tagName":"h2","properties":{"id":"att-installera-pygame","style":"position:relative;"},"children":[{"type":"text","value":"Att installera pygame"},{"type":"element","tagName":"a","properties":{"href":"#att-installera-pygame","ariaLabel":"att installera pygame permalink","className":["anchor","after"]},"children":[{"type":"element","tagName":"svg","properties":{"ariaHidden":"true","focusable":"false","height":"16","version":"1.1","viewBox":"0 0 16 16","width":"16"},"children":[{"type":"element","tagName":"path","properties":{"fillRule":"evenodd","d":"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"},"children":[]}]}]}]},{"type":"element","tagName":"h3","properties":{"id":"linux","style":"position:relative;"},"children":[{"type":"text","value":"Linux"},{"type":"element","tagName":"a","properties":{"href":"#linux","ariaLabel":"linux permalink","className":["anchor","after"]},"children":[{"type":"element","tagName":"svg","properties":{"ariaHidden":"true","focusable":"false","height":"16","version":"1.1","viewBox":"0 0 16 16","width":"16"},"children":[{"type":"element","tagName":"path","properties":{"fillRule":"evenodd","d":"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"},"children":[]}]}]}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Öppna en instruktionsrad, skriv in "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"pip3 install pygame"}]},{"type":"text","value":" och tryck på "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"enter"}]},{"type":"text","value":"."}]},{"type":"element","tagName":"span","properties":{"className":["gatsby-resp-image-wrapper"],"style":"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 399px; margin-bottom: 1rem;"},"children":[{"type":"text","value":"\n "},{"type":"element","tagName":"a","properties":{"className":["gatsby-resp-image-link"],"href":"/static/a92634cb53af0aa1734e9ca12ca79562/a307d/pygame_linux.png","style":"display: block","target":"_blank","rel":["noopener"]},"children":[{"type":"text","value":"\n "},{"type":"element","tagName":"span","properties":{"className":["gatsby-resp-image-background-image"],"style":"padding-bottom: 60.434782608695656%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAMCAYAAABiDJ37AAAACXBIWXMAAA7EAAAOxAGVKw4bAAAAyElEQVQoz+2Oy26CYBSE/5XXxssTKAWqUQSixmorKhEEfgQv7/8un8FqorELFm5MXHyZyZnJ5IhEBgSeyy4Oz5rGIZG/JokC9lvJerVgn0gOaYwMPOLQ57jbMp994/w8IrzuL5G5YtNzWKoTpOkSGkuc1oh07HOcRrj6FLOmYje/sBr6n9a1fxFWVWNY62B/6FgVDbuqk93Mssqo3j1nme8X2hhF5cKtv0cYJYV+VigpD2T3azYof+ZC5C3mHc09+PQP34MvPHgC7r1OntPJWSAAAAAASUVORK5CYII='); background-size: cover; display: block;"},"children":[]},{"type":"text","value":"\n "},{"type":"element","tagName":"picture","properties":{},"children":[{"type":"text","value":"\n "},{"type":"element","tagName":"source","properties":{"srcSet":["/static/a92634cb53af0aa1734e9ca12ca79562/a0b58/pygame_linux.webp 230w","/static/a92634cb53af0aa1734e9ca12ca79562/66086/pygame_linux.webp 399w"],"sizes":"(max-width: 399px) 100vw, 399px","type":"image/webp"},"children":[]},{"type":"text","value":"\n "},{"type":"element","tagName":"source","properties":{"srcSet":["/static/a92634cb53af0aa1734e9ca12ca79562/81c8e/pygame_linux.png 230w","/static/a92634cb53af0aa1734e9ca12ca79562/a307d/pygame_linux.png 399w"],"sizes":"(max-width: 399px) 100vw, 399px","type":"image/png"},"children":[]},{"type":"text","value":"\n "},{"type":"element","tagName":"img","properties":{"className":["gatsby-resp-image-image"],"src":"/static/a92634cb53af0aa1734e9ca12ca79562/a307d/pygame_linux.png","alt":"pygame linux","title":"pygame linux","loading":"lazy","decoding":"async","style":"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;"},"children":[]},{"type":"text","value":"\n "}]},{"type":"text","value":"\n "}]},{"type":"text","value":"\n "}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Detta borde installera pygame-biblioteket på din dator."}]},{"type":"element","tagName":"h3","properties":{"id":"windows","style":"position:relative;"},"children":[{"type":"text","value":"Windows"},{"type":"element","tagName":"a","properties":{"href":"#windows","ariaLabel":"windows permalink","className":["anchor","after"]},"children":[{"type":"element","tagName":"svg","properties":{"ariaHidden":"true","focusable":"false","height":"16","version":"1.1","viewBox":"0 0 16 16","width":"16"},"children":[{"type":"element","tagName":"path","properties":{"fillRule":"evenodd","d":"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"},"children":[]}]}]}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Öppna Windows-terminalen genom att öppna menyn, skriva "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"cmd"}]},{"type":"text","value":" och trycka på "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"enter"}]},{"type":"text","value":":"}]},{"type":"element","tagName":"span","properties":{"className":["gatsby-resp-image-wrapper"],"style":"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 392px; margin-bottom: 1rem;"},"children":[{"type":"text","value":"\n "},{"type":"element","tagName":"a","properties":{"className":["gatsby-resp-image-link"],"href":"/static/76954afbb36ac5953d205b7cdab98ff6/0acb4/13_1_1.png","style":"display: block","target":"_blank","rel":["noopener"]},"children":[{"type":"text","value":"\n "},{"type":"element","tagName":"span","properties":{"className":["gatsby-resp-image-background-image"],"style":"padding-bottom: 173.47826086956525%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAjCAIAAAAblL1PAAAACXBIWXMAAA7DAAAOwwHHb6hkAAADp0lEQVRIx+2VT0gjVxzHp0g1kwlqNEmJqUTblB6EPewaEKGlINKlhW5Peyhb2GNPwkIPhUJvPRVakP6hQr0UlvoHm6yaSfaSVTdqEpdQt8ZsTGidxJ3JG2cmk0ky+fPevDKZVUrQrnruly+PuXze7/d+v/d7Q9hsNovFEgwGYUu1Wq3RaGiaJsuypmn4P0W43e6BgYHl5eVMJoMQKhQKsixDCBOJBITwPKxeryOEiJ6ens7OziBNY4xVVW02GkjTjJjay0QMDg66XK7FhYVcLndwcPB0d1dRFIPELxPhdDrtNtt3vz7YFfBGVt7IlsJpMZyWwmnxUVoKPxPXs0rk7+qZ1tOmKOqLb2fffW/i3tc/LCT4n0N/zDx8OvPwz9lw6qdA4n40v5yq+PZK/qTSZsJqtVos1Jff//bVjO/HQOJ+7PncE/AgVfUly/79si9Z9iWV3/dKZ1qHzaRpdiHAIfzsuL73vLLHVfdB7dQpUD/PLdhspldX/soe8IXCBUv1omBWq5UkyUBAb5VcKgHAHzJMVVUxxlBDSNNOrWm4zTpsMpGhUBBjLAgCy7KpVKpcLl8kBaNglvn5+XQ6I4kSAEBRlGKxCAAoFAo8zx8fH7Msq7ZyadtOhymKWlxcPDo6KhaLHMcBAGRZFgQBtCSKIsdxjUbj3Mhzc3PJ5L4sy7lcDgDAMAzLshzHGVvwPM+yLMMw+Xz+3xf+ReSlpSUAQLlcBgBIkiQIgrEqiiJJUrFYNHIRBAEh1F7t1dVVURQzmUw+n89mszzPX7RgJEnSNN1sNhVFqVQqqqrWarXmidomycAghPpUnfQ5YAwzwzDValU8kSAIZ8avVCr6PLf6bAqFQsZ++DL6H74s3NfXR5LkFWHj6b0i7Ha7nU4n3Xq3Lw17PB632x0IBK4C9/b2Xv3MY2NjXq/X7/efXvdLwA6Hg6KolZUVjHGtVoMQ1i8svVUGXK/XeZ4/PDxUVRUhpGGMEEIQYg1BCJGm6StCuPUBNQQRJCiK6ujomJ6ejsVi4XCYpulIJPJkJ76x9mh7OxqJxdY2t3biO4/XH29H41ubW+vrkXg8Hl3bjG1FCa/XOzk5SRD677Krq2t4+I3B113Eq+bR21P9Dvv4a92fjnsIgrj74biru+v66Jt3PnnnFYKw3r1mfqufGBoaGhkZMZlMDofDbDbb7HZ7v9Uy4Jn65pebH30wcX3is1t3eoff/vjzqWs3bozevHV76l5vn936vqd7yP4P6JyrnQ25/+oAAAAASUVORK5CYII='); background-size: cover; display: block;"},"children":[]},{"type":"text","value":"\n "},{"type":"element","tagName":"picture","properties":{},"children":[{"type":"text","value":"\n "},{"type":"element","tagName":"source","properties":{"srcSet":["/static/76954afbb36ac5953d205b7cdab98ff6/a0b58/13_1_1.webp 230w","/static/76954afbb36ac5953d205b7cdab98ff6/86099/13_1_1.webp 392w"],"sizes":"(max-width: 392px) 100vw, 392px","type":"image/webp"},"children":[]},{"type":"text","value":"\n "},{"type":"element","tagName":"source","properties":{"srcSet":["/static/76954afbb36ac5953d205b7cdab98ff6/81c8e/13_1_1.png 230w","/static/76954afbb36ac5953d205b7cdab98ff6/0acb4/13_1_1.png 392w"],"sizes":"(max-width: 392px) 100vw, 392px","type":"image/png"},"children":[]},{"type":"text","value":"\n "},{"type":"element","tagName":"img","properties":{"className":["gatsby-resp-image-image"],"src":"/static/76954afbb36ac5953d205b7cdab98ff6/0acb4/13_1_1.png","alt":"13 1 1","title":"13 1 1","loading":"lazy","decoding":"async","style":"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;"},"children":[]},{"type":"text","value":"\n "}]},{"type":"text","value":"\n "}]},{"type":"text","value":"\n "}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Fönstret för kommandoradstolken borde öppnas. Skriv in "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"pip3 install pygame"}]},{"type":"text","value":" och tryck på "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"enter"}]},{"type":"text","value":"."}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Detta borde installera pygame-biblioteket på din dator."}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Installationen kan kräva systemadministratörsbehörighet. Om ovanstående inte fungerar kan du prova på att köra terminalprogrammet som administratör: öppna Windows-menyn, leta reda på CMD-programmet, högerklicka på det och välj \"Kör som administratör\"."}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"För att installera och få åtkomst till pygame krävs att din Python-installation läggs till i sökvägen, enligt "},{"type":"element","tagName":"a","properties":{"href":"https://www.mooc.fi/fi/installation/vscode#python3","target":"_blank","rel":["noopener","noreferrer"]},"children":[{"type":"text","value":"instruktionerna"}]},{"type":"text","value":" här."}]},{"type":"element","tagName":"h3","properties":{"id":"mac","style":"position:relative;"},"children":[{"type":"text","value":"Mac"},{"type":"element","tagName":"a","properties":{"href":"#mac","ariaLabel":"mac permalink","className":["anchor","after"]},"children":[{"type":"element","tagName":"svg","properties":{"ariaHidden":"true","focusable":"false","height":"16","version":"1.1","viewBox":"0 0 16 16","width":"16"},"children":[{"type":"element","tagName":"path","properties":{"fillRule":"evenodd","d":"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"},"children":[]}]}]}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Öppna Terminalen, t.ex. genom förstoringsglas-symbolen i det övre högra hörnet:"}]},{"type":"element","tagName":"span","properties":{"className":["gatsby-resp-image-wrapper"],"style":"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 746px; margin-bottom: 1rem;"},"children":[{"type":"text","value":"\n "},{"type":"element","tagName":"a","properties":{"className":["gatsby-resp-image-link"],"href":"/static/77ceacb61dfaf80c7c442a4225b65e87/62de4/13-1-2.png","style":"display: block","target":"_blank","rel":["noopener"]},"children":[{"type":"text","value":"\n "},{"type":"element","tagName":"span","properties":{"className":["gatsby-resp-image-background-image"],"style":"padding-bottom: 24.347826086956523%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAFCAIAAADKYVtkAAAACXBIWXMAABYlAAAWJQFJUiTwAAABGUlEQVQY02OYs2Rje9/sSTOWzlmycdKsZVPmrJg6Z+WC5Zt7py7s6J/dO2nehDnLW6bOb+mftWD55oUrN/VPXVNRPW3SzEVzlqxn0Lf207Hw1rPyhTF89Kx99W38tM08VE3dZE2c7S18z7gX99gnqll7G9n6alt6q5u561l56lv7MLCIaLGIaLGKaLMIQ0kWYU1GIQ1GYU1JMf1QKbs6OY9OeW8DcVMGQTUWIQ1mYQ1WEU0mIQ1mQXUGPnkzEJIzhSBeOVMeWRNZOQtHRYdAZRdzBTt+OVMGaQMOWWOQrKwJCMlASGMGfgVzfjlTXhkjXlljXhlDHil9PmkDNRlTKRkTNlljVjkTPnkzIXlzPnlzXpDRUJvAbFMAjAFKS35RLdoAAAAASUVORK5CYII='); background-size: cover; display: block;"},"children":[]},{"type":"text","value":"\n "},{"type":"element","tagName":"picture","properties":{},"children":[{"type":"text","value":"\n "},{"type":"element","tagName":"source","properties":{"srcSet":["/static/77ceacb61dfaf80c7c442a4225b65e87/a0b58/13-1-2.webp 230w","/static/77ceacb61dfaf80c7c442a4225b65e87/bc10c/13-1-2.webp 460w","/static/77ceacb61dfaf80c7c442a4225b65e87/f7ebd/13-1-2.webp 746w"],"sizes":"(max-width: 746px) 100vw, 746px","type":"image/webp"},"children":[]},{"type":"text","value":"\n "},{"type":"element","tagName":"source","properties":{"srcSet":["/static/77ceacb61dfaf80c7c442a4225b65e87/81c8e/13-1-2.png 230w","/static/77ceacb61dfaf80c7c442a4225b65e87/08a84/13-1-2.png 460w","/static/77ceacb61dfaf80c7c442a4225b65e87/62de4/13-1-2.png 746w"],"sizes":"(max-width: 746px) 100vw, 746px","type":"image/png"},"children":[]},{"type":"text","value":"\n "},{"type":"element","tagName":"img","properties":{"className":["gatsby-resp-image-image"],"src":"/static/77ceacb61dfaf80c7c442a4225b65e87/62de4/13-1-2.png","alt":"13 1 2","title":"13 1 2","loading":"lazy","decoding":"async","style":"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;"},"children":[]},{"type":"text","value":"\n "}]},{"type":"text","value":"\n "}]},{"type":"text","value":"\n "}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Sökverktyget borde öppna. Skriv in "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"terminal"}]},{"type":"text","value":" och tryck "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"enter"}]},{"type":"text","value":":"}]},{"type":"element","tagName":"span","properties":{"className":["gatsby-resp-image-wrapper"],"style":"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 920px; margin-bottom: 1rem;"},"children":[{"type":"text","value":"\n "},{"type":"element","tagName":"a","properties":{"className":["gatsby-resp-image-link"],"href":"/static/a310ec5ccf9438989514ad8da107dcc3/47218/13-1-3.png","style":"display: block","target":"_blank","rel":["noopener"]},"children":[{"type":"text","value":"\n "},{"type":"element","tagName":"span","properties":{"className":["gatsby-resp-image-background-image"],"style":"padding-bottom: 66.95652173913044%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAANCAIAAAAmMtkJAAAACXBIWXMAABYlAAAWJQFJUiTwAAACa0lEQVQozy2STXLTQBCFdYFwgzh3IlmFDeQGkAQ2LKGo4hBAQhWp7FglQMohln8iO7Yly7JkzWime370M5LsACeg5KTq23W97ur3njX3poNup2t3Bv0+53z9+aL63ilGcx1zlRZK50pnSmdCapQKUQHKvCi/nZ0PnKFlDyZt22nbo+vu3cQnvhP4HvEXHEArnUn1qASUHAQHAahUmg+c0cwPrIOP3dcn+PbcvDw1h6fF8Vn55swcfjVOkJs8lypXOi9MvVr/Xf/5V5Q1CiVUWlYrqVLr99XNz+vBzdB3PDKeM2/BZyF4IeeodZoJmZqy/vTl5PmLg929vXfvPxSm0UuVAUirb/fa1+3e7W0UkygmhFCaJJRSFFKoFIQq6/XR8fHOTuvJ1tbT3T1TrQGl0hmgsJxhMBxPnYnrBVFMgaFuAM1AMZCUYW7ql6+Otre3W63W/v6zLDeMI0rNAK1Ob2L3h+2b3tW17frhkkAYs3DJ4gQJEyRBDspx7i4vf11c/Oh0eknCCWEJw0UYW+4s6N+OnOHE88NFRBdLuohoEBHKxcNxAIkgXW8+Hk8TyilhyyWlCUw93/LcmTube37QpJLmchOPUBnKdIMWQgMIShkhjDHgXHCOHCRNuEVRzfxgNJ66ng/YxCBUo0GhUahHUAmppUql1KIhlSprfg4TGS1JGMVhFLPGx2bQ3NyIYQMKHUZkPPFcz3+ojc7yxu04pjFJHiCUMY4gFEeVbKymDBgXwWLpDO96fcfu9jmI5i+ZMY6WTvMGnWmdZXluTFlWa1OtTFkXpipMWZgKmmKiaJaKsqrr1X29ui/L+j/LRoPjTcXpPgAAAABJRU5ErkJggg=='); background-size: cover; display: block;"},"children":[]},{"type":"text","value":"\n "},{"type":"element","tagName":"picture","properties":{},"children":[{"type":"text","value":"\n "},{"type":"element","tagName":"source","properties":{"srcSet":["/static/a310ec5ccf9438989514ad8da107dcc3/a0b58/13-1-3.webp 230w","/static/a310ec5ccf9438989514ad8da107dcc3/bc10c/13-1-3.webp 460w","/static/a310ec5ccf9438989514ad8da107dcc3/966d8/13-1-3.webp 920w","/static/a310ec5ccf9438989514ad8da107dcc3/3dddb/13-1-3.webp 1344w"],"sizes":"(max-width: 920px) 100vw, 920px","type":"image/webp"},"children":[]},{"type":"text","value":"\n "},{"type":"element","tagName":"source","properties":{"srcSet":["/static/a310ec5ccf9438989514ad8da107dcc3/81c8e/13-1-3.png 230w","/static/a310ec5ccf9438989514ad8da107dcc3/08a84/13-1-3.png 460w","/static/a310ec5ccf9438989514ad8da107dcc3/c0255/13-1-3.png 920w","/static/a310ec5ccf9438989514ad8da107dcc3/47218/13-1-3.png 1344w"],"sizes":"(max-width: 920px) 100vw, 920px","type":"image/png"},"children":[]},{"type":"text","value":"\n "},{"type":"element","tagName":"img","properties":{"className":["gatsby-resp-image-image"],"src":"/static/a310ec5ccf9438989514ad8da107dcc3/c0255/13-1-3.png","alt":"13 1 3","title":"13 1 3","loading":"lazy","decoding":"async","style":"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;"},"children":[]},{"type":"text","value":"\n "}]},{"type":"text","value":"\n "}]},{"type":"text","value":"\n "}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Skriv in följande och tryck "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"enter"}]},{"type":"text","value":":"}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"pip3 install pygame"}]}]},{"type":"element","tagName":"span","properties":{"className":["gatsby-resp-image-wrapper"],"style":"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 920px; margin-bottom: 1rem;"},"children":[{"type":"text","value":"\n "},{"type":"element","tagName":"a","properties":{"className":["gatsby-resp-image-link"],"href":"/static/cc8d7c319bc7baf0232b2d92350f9631/d56e1/13-1-4.png","style":"display: block","target":"_blank","rel":["noopener"]},"children":[{"type":"text","value":"\n "},{"type":"element","tagName":"span","properties":{"className":["gatsby-resp-image-background-image"],"style":"padding-bottom: 28.695652173913043%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAGCAIAAABM9SnKAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAiElEQVQY06XNwQoCIRSFYd//ZXoJ4dpUIpqEYRZii1y4cRai4xgMGEEboW954PAjcd6BYXd1OR0PhBDGGABgjAkhADBNe8651lpKKYSglHLOHx2yz9ftqp1z1lpjjFIqhDDPc4zRe19Kaa2tm9atHVpqXTa11pRSzrkNQ7/TJ/JdGz3/VR4/vwF1E1iIv4njxgAAAABJRU5ErkJggg=='); background-size: cover; display: block;"},"children":[]},{"type":"text","value":"\n "},{"type":"element","tagName":"picture","properties":{},"children":[{"type":"text","value":"\n "},{"type":"element","tagName":"source","properties":{"srcSet":["/static/cc8d7c319bc7baf0232b2d92350f9631/a0b58/13-1-4.webp 230w","/static/cc8d7c319bc7baf0232b2d92350f9631/bc10c/13-1-4.webp 460w","/static/cc8d7c319bc7baf0232b2d92350f9631/966d8/13-1-4.webp 920w","/static/cc8d7c319bc7baf0232b2d92350f9631/bbe5b/13-1-4.webp 1130w"],"sizes":"(max-width: 920px) 100vw, 920px","type":"image/webp"},"children":[]},{"type":"text","value":"\n "},{"type":"element","tagName":"source","properties":{"srcSet":["/static/cc8d7c319bc7baf0232b2d92350f9631/81c8e/13-1-4.png 230w","/static/cc8d7c319bc7baf0232b2d92350f9631/08a84/13-1-4.png 460w","/static/cc8d7c319bc7baf0232b2d92350f9631/c0255/13-1-4.png 920w","/static/cc8d7c319bc7baf0232b2d92350f9631/d56e1/13-1-4.png 1130w"],"sizes":"(max-width: 920px) 100vw, 920px","type":"image/png"},"children":[]},{"type":"text","value":"\n "},{"type":"element","tagName":"img","properties":{"className":["gatsby-resp-image-image"],"src":"/static/cc8d7c319bc7baf0232b2d92350f9631/c0255/13-1-4.png","alt":"13 1 4","title":"13 1 4","loading":"lazy","decoding":"async","style":"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;"},"children":[]},{"type":"text","value":"\n "}]},{"type":"text","value":"\n "}]},{"type":"text","value":"\n "}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Detta borde installera pygame-biblioteket på din dator."}]},{"type":"element","tagName":"h2","properties":{"id":"ditt-forsta-program","style":"position:relative;"},"children":[{"type":"text","value":"Ditt första program"},{"type":"element","tagName":"a","properties":{"href":"#ditt-forsta-program","ariaLabel":"ditt forsta program permalink","className":["anchor","after"]},"children":[{"type":"element","tagName":"svg","properties":{"ariaHidden":"true","focusable":"false","height":"16","version":"1.1","viewBox":"0 0 16 16","width":"16"},"children":[{"type":"element","tagName":"path","properties":{"fillRule":"evenodd","d":"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"},"children":[]}]}]}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Här är ett enkelt program för att kontrollera att din pygame-installation fungerar korrekt:"}]},{"type":"element","tagName":"div","properties":{"className":["gatsby-highlight"],"dataLanguage":"python"},"children":[{"type":"element","tagName":"pre","properties":{"className":["language-python"]},"children":[{"type":"element","tagName":"code","properties":{"className":["language-python"]},"children":[{"type":"element","tagName":"span","properties":{"className":["token","keyword"]},"children":[{"type":"text","value":"import"}]},{"type":"text","value":" pygame\n\npygame"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"init"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"text","value":"\nfonster "},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"="}]},{"type":"text","value":" pygame"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"display"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"set_mode"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"640"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":","}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"480"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"text","value":"\n\nfonster"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"fill"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"0"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":","}]},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"0"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":","}]},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"0"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"text","value":"\npygame"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"display"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"flip"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"text","value":"\n\n"},{"type":"element","tagName":"span","properties":{"className":["token","keyword"]},"children":[{"type":"text","value":"while"}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","boolean"]},"children":[{"type":"text","value":"True"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":":"}]},{"type":"text","value":"\n "},{"type":"element","tagName":"span","properties":{"className":["token","keyword"]},"children":[{"type":"text","value":"for"}]},{"type":"text","value":" handelse "},{"type":"element","tagName":"span","properties":{"className":["token","keyword"]},"children":[{"type":"text","value":"in"}]},{"type":"text","value":" pygame"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"event"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"get"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":":"}]},{"type":"text","value":"\n "},{"type":"element","tagName":"span","properties":{"className":["token","keyword"]},"children":[{"type":"text","value":"if"}]},{"type":"text","value":" handelse"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"element","tagName":"span","properties":{"className":["token","builtin"]},"children":[{"type":"text","value":"type"}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"=="}]},{"type":"text","value":" pygame"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"QUIT"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":":"}]},{"type":"text","value":"\n exit"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]}]}]}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"När detta program körs borde det visa ett fönster:"}]},{"type":"element","tagName":"img","properties":{"src":"/d11704399cba1d2075b1135cef373b65/pygame_eka.gif"},"children":[]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Programmet visar endast ett fönster, och det körs tills användaren stänger fönstret."}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Låt oss ta en närmare titt på de steg som krävs för att uppnå detta. Den första raden tar pygame-biblioteket i bruk: "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"import pygame"}]},{"type":"text","value":". Nästa instruktion, "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"pygame.init"}]},{"type":"text","value":", initierar pygame-modulerna, och nästa skapar ett fönster med funktionen "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"pygame.display.set_mode"}]},{"type":"text","value":"."}]},{"type":"element","tagName":"div","properties":{"className":["gatsby-highlight"],"dataLanguage":"python"},"children":[{"type":"element","tagName":"pre","properties":{"className":["language-python"]},"children":[{"type":"element","tagName":"code","properties":{"className":["language-python"]},"children":[{"type":"text","value":"pygame"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"init"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"text","value":"\nfonster "},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"="}]},{"type":"text","value":" pygame"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"display"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"set_mode"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"640"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":","}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"480"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]}]}]}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Funktionen "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"set_mode"}]},{"type":"text","value":" tar fönstrets dimensioner som ett argument. Tupeln "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"(640, 480)"}]},{"type":"text","value":" anger att fönstret är 640 pixlar brett och 480 pixlar högt. Variabelnamnet "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"fonster"}]},{"type":"text","value":" kan senare användas för att komma åt fönstret, t.ex. för att rita något i det."}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"De följande två instruktionerna gör just detta:"}]},{"type":"element","tagName":"div","properties":{"className":["gatsby-highlight"],"dataLanguage":"python"},"children":[{"type":"element","tagName":"pre","properties":{"className":["language-python"]},"children":[{"type":"element","tagName":"code","properties":{"className":["language-python"]},"children":[{"type":"text","value":"fonster"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"fill"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"0"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":","}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"0"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":","}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"0"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"text","value":"\npygame"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"display"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"flip"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]}]}]}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Metoden "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"fill"}]},{"type":"text","value":" fyller fönstret med den färg som anges som argument. I det här fallet är färgen svart, som skickas som ett RGB-värde i tupeln "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"(0, 0, 0)"}]},{"type":"text","value":". Metoden "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"pygame.display.flip"}]},{"type":"text","value":" uppdaterar innehållet i fönstret."}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Efter dessa initialiseringsinstruktioner börjar programmets huvudloop:"}]},{"type":"element","tagName":"div","properties":{"className":["gatsby-highlight"],"dataLanguage":"python"},"children":[{"type":"element","tagName":"pre","properties":{"className":["language-python"]},"children":[{"type":"element","tagName":"code","properties":{"className":["language-python"]},"children":[{"type":"element","tagName":"span","properties":{"className":["token","keyword"]},"children":[{"type":"text","value":"while"}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","boolean"]},"children":[{"type":"text","value":"True"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":":"}]},{"type":"text","value":"\n "},{"type":"element","tagName":"span","properties":{"className":["token","keyword"]},"children":[{"type":"text","value":"for"}]},{"type":"text","value":" handelse "},{"type":"element","tagName":"span","properties":{"className":["token","keyword"]},"children":[{"type":"text","value":"in"}]},{"type":"text","value":" pygame"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"event"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"get"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":":"}]},{"type":"text","value":"\n "},{"type":"element","tagName":"span","properties":{"className":["token","keyword"]},"children":[{"type":"text","value":"if"}]},{"type":"text","value":" handelse"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"element","tagName":"span","properties":{"className":["token","builtin"]},"children":[{"type":"text","value":"type"}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"=="}]},{"type":"text","value":" pygame"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"QUIT"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":":"}]},{"type":"text","value":"\n exit"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]}]}]}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Huvudloopen hanterar alla händelser som operativsystemet skickar till programmet. Vid varje iteration returnerar funktionen "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"pygame.event.get"}]},{"type":"text","value":" en lista över alla händelser som har samlats in sedan föregående iteration."}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"I exemplet ovan hanterar programmet endast händelser av typen "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"pygame.QUIT"}]},{"type":"text","value":". Denna händelse uppstår t.ex. genom att man klickar på exit-knappen i fönstrets hörn. Om händelsen "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"pygame.QUIT"}]},{"type":"text","value":" utlöses avslutas programmet genom funktionen exit."}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Du kan prova och se vad som händer om ditt program inte hanterar händelsen "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"pygame.QUIT"}]},{"type":"text","value":". Detta borde innebära att det inte händer någonting om man klickar på exit-knappen, vilket skulle vara förvirrande för användaren. Eftersom programmet körs från kommandoraden kan du fortfarande stoppa det från kommandoraden med Control+C."}]},{"type":"element","tagName":"h2","properties":{"id":"lagg-till-en-bild","style":"position:relative;"},"children":[{"type":"text","value":"Lägg till en bild"},{"type":"element","tagName":"a","properties":{"href":"#lagg-till-en-bild","ariaLabel":"lagg till en bild permalink","className":["anchor","after"]},"children":[{"type":"element","tagName":"svg","properties":{"ariaHidden":"true","focusable":"false","height":"16","version":"1.1","viewBox":"0 0 16 16","width":"16"},"children":[{"type":"element","tagName":"path","properties":{"fillRule":"evenodd","d":"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"},"children":[]}]}]}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Låt oss lägga till en bild i fönstret:"}]},{"type":"element","tagName":"div","properties":{"className":["gatsby-highlight"],"dataLanguage":"python"},"children":[{"type":"element","tagName":"pre","properties":{"className":["language-python"]},"children":[{"type":"element","tagName":"code","properties":{"className":["language-python"]},"children":[{"type":"element","tagName":"span","properties":{"className":["token","keyword"]},"children":[{"type":"text","value":"import"}]},{"type":"text","value":" pygame\n\npygame"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"init"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"text","value":"\nfonster "},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"="}]},{"type":"text","value":" pygame"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"display"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"set_mode"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"640"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":","}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"480"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"text","value":"\n\nrobot "},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"="}]},{"type":"text","value":" pygame"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"image"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"load"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","string"]},"children":[{"type":"text","value":"\"robot.png\""}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"text","value":"\n\nfonster"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"fill"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"0"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":","}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"0"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":","}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"0"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"text","value":"\nfonster"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"blit"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"text","value":"robot"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":","}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"100"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":","}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"50"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"text","value":"\npygame"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"display"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"flip"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"text","value":"\n\n"},{"type":"element","tagName":"span","properties":{"className":["token","keyword"]},"children":[{"type":"text","value":"while"}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","boolean"]},"children":[{"type":"text","value":"True"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":":"}]},{"type":"text","value":"\n "},{"type":"element","tagName":"span","properties":{"className":["token","keyword"]},"children":[{"type":"text","value":"for"}]},{"type":"text","value":" handelse "},{"type":"element","tagName":"span","properties":{"className":["token","keyword"]},"children":[{"type":"text","value":"in"}]},{"type":"text","value":" pygame"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"event"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"get"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":":"}]},{"type":"text","value":"\n "},{"type":"element","tagName":"span","properties":{"className":["token","keyword"]},"children":[{"type":"text","value":"if"}]},{"type":"text","value":" handelse"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"element","tagName":"span","properties":{"className":["token","builtin"]},"children":[{"type":"text","value":"type"}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"=="}]},{"type":"text","value":" pygame"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"QUIT"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":":"}]},{"type":"text","value":"\n exit"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]}]}]}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Programmet använder denna bild av en robot, som finns lagrad i filen "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"robot.png"}]},{"type":"text","value":":"}]},{"type":"element","tagName":"img","properties":{"src":"robot.png"},"children":[]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Filen "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"robot.png"}]},{"type":"text","value":" måste finnas i samma katalog som källkoden för ditt program, annars kan programmet inte hitta den. I övningsmallarna för denna del väntar bilderna i övningskatalogen."}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Fönstret borde nu se ut så här:"}]},{"type":"element","tagName":"img","properties":{"src":"/0f7db0536914ccd471841bcee4201632/pygame_kuva.gif"},"children":[]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Funktionen "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"pygame.image.load"}]},{"type":"text","value":" laddar in bilden i filen "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"robot.png"}]},{"type":"text","value":" och lagrar en referens till den i variabeln "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"robot"}]},{"type":"text","value":". Metoden "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"blit"}]},{"type":"text","value":" ritar bilden på platsen "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"(100, 50)"}]},{"type":"text","value":", och funktionen "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"pygame.display.flip"}]},{"type":"text","value":" uppdaterar fönstrets innehåll, som tidigare. Platsen "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"(100, 50)"}]},{"type":"text","value":" innebär att bildens övre vänstra hörn befinner sig på den platsen i fönstret."}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"I pygame ligger origo-punkten "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"(0, 0)"}]},{"type":"text","value":" i fönstrets övre vänstra hörn. X-koordinaterna ökar åt höger och y-koordinaterna ökar nedåt, så att det nedre högra hörnet har koordinaterna "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"(640, 480)"}]},{"type":"text","value":". Detta är tvärtemot hur koordinater brukar hanteras inom t.ex. matematiken, men det är ganska vanligt i programmeringssammanhang och värt att vänja sig vid."}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"När du har laddat en bild kan du använda den många gånger i samma fönster. I följande kod ritas bilden av roboten på tre olika platser:"}]},{"type":"element","tagName":"div","properties":{"className":["gatsby-highlight"],"dataLanguage":"python"},"children":[{"type":"element","tagName":"pre","properties":{"className":["language-python"]},"children":[{"type":"element","tagName":"code","properties":{"className":["language-python"]},"children":[{"type":"text","value":"fonster"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"blit"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"text","value":"robot"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":","}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"0"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":","}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"0"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"text","value":"\nfonster"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"blit"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"text","value":"robot"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":","}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"300"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":","}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"0"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"text","value":"\nfonster"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"blit"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"text","value":"robot"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":","}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"100"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":","}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"200"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]}]}]}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Resultatet borde vara att fönstret ser ut så här:"}]},{"type":"element","tagName":"img","properties":{"src":"/a7807afa43ad1cc7d9686968e6838712/pygame_kuva2.gif"},"children":[]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Här sätter vi lokationen av bilden så, att den ligger i mitten av fönstret:"}]},{"type":"element","tagName":"div","properties":{"className":["gatsby-highlight"],"dataLanguage":"python"},"children":[{"type":"element","tagName":"pre","properties":{"className":["language-python"]},"children":[{"type":"element","tagName":"code","properties":{"className":["language-python"]},"children":[{"type":"text","value":"bredd "},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"="}]},{"type":"text","value":" robot"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"get_width"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"text","value":"\nhojd "},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"="}]},{"type":"text","value":" robot"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"get_height"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"text","value":"\nfonster"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"blit"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"text","value":"robot"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":","}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"320"}]},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"-"}]},{"type":"text","value":"bredd"},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"/"}]},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"2"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":","}]},{"type":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"240"}]},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"-"}]},{"type":"text","value":"hojd"},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"/"}]},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"2"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]}]}]}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Fönstret borde nu se ut så här:"}]},{"type":"element","tagName":"img","properties":{"src":"/498f521486feca567f74dd51c44e371b/pygame_kuva3.gif"},"children":[]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Metoden "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"get_width"}]},{"type":"text","value":" ger bildens bredd och metoden "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"get_height"}]},{"type":"text","value":" ger dess höjd, båda i pixlar. Fönstrets mittpunkt ligger på halva bredden och höjden, alltså på "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"(320, 240)"}]},{"type":"text","value":", vilket vi kan använda för att beräkna en lämplig plats för bildens övre vänstra hörn, så att det ligger exakt i mitten."}]},{"type":"element","tagName":"text-box","properties":{"variant":"hint","name":"Pygame-övningar"},"children":[{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Övningarna i den här modulen av kursen har inga automatiserade tester, eftersom resultaten verifieras visuellt. Testerna ger poäng automatiskt när du skickar in din lösning till servern, oavsett hur du har implementerat den. Skicka bara in din lösning när du är redo och din lösning matchar övningsbeskrivningen. Övningarna kanske inte har automatiska tester, men kurspersonalen kommer ändå att se din lösning. Att skicka in en ofullständig lösning till TMC Paste ger också poäng automatiskt, så det bör inte användas när du ber om hjälp med övningarna i den här modulen. Du kan använda "},{"type":"element","tagName":"a","properties":{"href":"https://pastebin.com/","target":"_blank","rel":["noopener","noreferrer"]},"children":[{"type":"text","value":"Pastebin.com"}]},{"type":"text","value":" eller någon annan pastebin-tjänst på internet när du ber om hjälp i kursens stödkanaler."}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Om din lösning helt klart inte stämmer överens med övningsbeskrivningen kan du förlora de poäng som du har fått för övningarna i den här modulen."}]}]},{"type":"element","tagName":"programming-exercise","properties":{"name":"Fyra robotar","tmcname":"osa13-01_fyra_robotar"},"children":[{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Skriv ett program som ritar en robot i vart och ett av de fyra hörnen av fönstret. Slutresultatet ska se ut så här:"}]},{"type":"element","tagName":"img","properties":{"src":"/8ba6d635c4ceb93c2b86711f83589b3a/pygame_nelja.gif"},"children":[]}]},{"type":"element","tagName":"programming-exercise","properties":{"name":"Robotar i rad","tmcname":"osa13-02_robotar_i_rad"},"children":[{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Skriv ett program som ritar tio robotar i rad. Slutresultatet ska se ut så här:"}]},{"type":"element","tagName":"img","properties":{"src":"/8dc589e5970721e2bf8bfe2bd22fa6cf/pygame_rivi.gif"},"children":[]}]},{"type":"element","tagName":"programming-exercise","properties":{"name":"Hundra robotar","tmcname":"osa13-03_hundra_robotar"},"children":[{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Var snäll och skriv ett program som ritar hundra robotar: tio rader med tio robotar i varje rad. Slutresultatet ska se ut så här:"}]},{"type":"element","tagName":"img","properties":{"src":"/7012bfc1e6ade044e03c53f07f35e7a6/pygame_sata.gif"},"children":[]}]},{"type":"element","tagName":"programming-exercise","properties":{"name":"Slumpmässiga robotar","tmcname":"osa13-04_slumpmassiga_robotar"},"children":[{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Skriv ett program som ritar "},{"type":"element","tagName":"em","properties":{},"children":[{"type":"text","value":"tusen"}]},{"type":"text","value":" robotar på slumpmässiga platser. Slutresultatet ska se ut så här:"}]},{"type":"element","tagName":"img","properties":{"src":"/61a30808255873a3e24df2fc559d9367/pygame_tuhat.gif"},"children":[]}]}]},"html":"

Efter den här delen

I de här två sista delarna av kursmaterialet kommer vi att bekanta oss med pygame-biblioteket. Det är ett Python-bibliotek för programmering av spel. Det hjälper dig att skapa grafiska element, hantera händelser från tangentbordet och musen samt implementera andra funktioner som är nödvändiga i spel.

Att installera pygame

Linux

Öppna en instruktionsrad, skriv in pip3 install pygame och tryck på enter.

\n \n \n \n \n \n \"13\n \n \n

Skriv in följande och tryck enter:

pip3 install pygame

\n \n \n \n \n \n \"13\n \n \n

Detta borde installera pygame-biblioteket på din dator.

Ditt första program

Här är ett enkelt program för att kontrollera att din pygame-installation fungerar korrekt:

import pygame\n\npygame.init()\nfonster = pygame.display.set_mode((640, 480))\n\nfonster.fill((0,0,0))\npygame.display.flip()\n\nwhile True:\n    for handelse in pygame.event.get():\n        if handelse.type == pygame.QUIT:\n            exit()

När detta program körs borde det visa ett fönster:

Programmet visar endast ett fönster, och det körs tills användaren stänger fönstret.

Låt oss ta en närmare titt på de steg som krävs för att uppnå detta. Den första raden tar pygame-biblioteket i bruk: import pygame. Nästa instruktion, pygame.init, initierar pygame-modulerna, och nästa skapar ett fönster med funktionen pygame.display.set_mode.

pygame.init()\nfonster = pygame.display.set_mode((640, 480))

Funktionen set_mode tar fönstrets dimensioner som ett argument. Tupeln (640, 480) anger att fönstret är 640 pixlar brett och 480 pixlar högt. Variabelnamnet fonster kan senare användas för att komma åt fönstret, t.ex. för att rita något i det.

De följande två instruktionerna gör just detta:

fonster.fill((0, 0, 0))\npygame.display.flip()

Metoden fill fyller fönstret med den färg som anges som argument. I det här fallet är färgen svart, som skickas som ett RGB-värde i tupeln (0, 0, 0). Metoden pygame.display.flip uppdaterar innehållet i fönstret.

Efter dessa initialiseringsinstruktioner börjar programmets huvudloop:

while True:\n    for handelse in pygame.event.get():\n        if handelse.type == pygame.QUIT:\n            exit()

Huvudloopen hanterar alla händelser som operativsystemet skickar till programmet. Vid varje iteration returnerar funktionen pygame.event.get en lista över alla händelser som har samlats in sedan föregående iteration.

I exemplet ovan hanterar programmet endast händelser av typen pygame.QUIT. Denna händelse uppstår t.ex. genom att man klickar på exit-knappen i fönstrets hörn. Om händelsen pygame.QUIT utlöses avslutas programmet genom funktionen exit.

Du kan prova och se vad som händer om ditt program inte hanterar händelsen pygame.QUIT. Detta borde innebära att det inte händer någonting om man klickar på exit-knappen, vilket skulle vara förvirrande för användaren. Eftersom programmet körs från kommandoraden kan du fortfarande stoppa det från kommandoraden med Control+C.

Lägg till en bild

Låt oss lägga till en bild i fönstret:

import pygame\n\npygame.init()\nfonster = pygame.display.set_mode((640, 480))\n\nrobot = pygame.image.load(\"robot.png\")\n\nfonster.fill((0, 0, 0))\nfonster.blit(robot, (100, 50))\npygame.display.flip()\n\nwhile True:\n    for handelse in pygame.event.get():\n        if handelse.type == pygame.QUIT:\n            exit()

Programmet använder denna bild av en robot, som finns lagrad i filen robot.png:

Filen robot.png måste finnas i samma katalog som källkoden för ditt program, annars kan programmet inte hitta den. I övningsmallarna för denna del väntar bilderna i övningskatalogen.

Fönstret borde nu se ut så här:

Funktionen pygame.image.load laddar in bilden i filen robot.png och lagrar en referens till den i variabeln robot. Metoden blit ritar bilden på platsen (100, 50), och funktionen pygame.display.flip uppdaterar fönstrets innehåll, som tidigare. Platsen (100, 50) innebär att bildens övre vänstra hörn befinner sig på den platsen i fönstret.

I pygame ligger origo-punkten (0, 0) i fönstrets övre vänstra hörn. X-koordinaterna ökar åt höger och y-koordinaterna ökar nedåt, så att det nedre högra hörnet har koordinaterna (640, 480). Detta är tvärtemot hur koordinater brukar hanteras inom t.ex. matematiken, men det är ganska vanligt i programmeringssammanhang och värt att vänja sig vid.

När du har laddat en bild kan du använda den många gånger i samma fönster. I följande kod ritas bilden av roboten på tre olika platser:

fonster.blit(robot, (0, 0))\nfonster.blit(robot, (300, 0))\nfonster.blit(robot, (100, 200))

Resultatet borde vara att fönstret ser ut så här:

Här sätter vi lokationen av bilden så, att den ligger i mitten av fönstret:

bredd = robot.get_width()\nhojd = robot.get_height()\nfonster.blit(robot, (320-bredd/2, 240-hojd/2))

Fönstret borde nu se ut så här:

Metoden get_width ger bildens bredd och metoden get_height ger dess höjd, båda i pixlar. Fönstrets mittpunkt ligger på halva bredden och höjden, alltså på (320, 240), vilket vi kan använda för att beräkna en lämplig plats för bildens övre vänstra hörn, så att det ligger exakt i mitten.

Övningarna i den här modulen av kursen har inga automatiserade tester, eftersom resultaten verifieras visuellt. Testerna ger poäng automatiskt när du skickar in din lösning till servern, oavsett hur du har implementerat den. Skicka bara in din lösning när du är redo och din lösning matchar övningsbeskrivningen. Övningarna kanske inte har automatiska tester, men kurspersonalen kommer ändå att se din lösning. Att skicka in en ofullständig lösning till TMC Paste ger också poäng automatiskt, så det bör inte användas när du ber om hjälp med övningarna i den här modulen. Du kan använda Pastebin.com eller någon annan pastebin-tjänst på internet när du ber om hjälp i kursens stödkanaler.

Om din lösning helt klart inte stämmer överens med övningsbeskrivningen kan du förlora de poäng som du har fått för övningarna i den här modulen.

Skriv ett program som ritar en robot i vart och ett av de fyra hörnen av fönstret. Slutresultatet ska se ut så här:

Skriv ett program som ritar tio robotar i rad. Slutresultatet ska se ut så här:

Var snäll och skriv ett program som ritar hundra robotar: tio rader med tio robotar i varje rad. Slutresultatet ska se ut så här:

Skriv ett program som ritar tusen robotar på slumpmässiga platser. Slutresultatet ska se ut så här:

","frontmatter":{"path":"/osa-13/1-pygame","title":"Pygame"},"fileAbsolutePath":"/home/runner/work/ohjelmointi-26-sv/ohjelmointi-26-sv/data/osa-13/1-pygame.md"},"allPages":{"edges":[{"node":{"id":"3823106d-d5b4-54fc-ab67-c9717c628c00","frontmatter":{"path":"/","title":"Info om kursen"}}},{"node":{"id":"dd7e5652-0011-5cc2-8a7c-c07fca8a56ba","frontmatter":{"path":"/bedomningar-och-prov","title":"Bedömning och prov"}}},{"node":{"id":"7ee945da-eb70-5822-b337-58f9871c566a","frontmatter":{"path":"/alla-uppgifter","title":"Alla uppgifter"}}},{"node":{"id":"6e80e276-0b56-526e-93d9-5ab8823c6611","frontmatter":{"path":"/frontmatter-guide","title":"Frontmatter-guide"}}},{"node":{"id":"7dadae75-1bf2-549f-bb24-5e00c8421489","frontmatter":{"path":"/stod","title":"Handledning och stöd"}}},{"node":{"id":"b1f9be34-f77d-51c9-83c2-d2d3b1f88e7c","frontmatter":{"path":"/onlinetent","title":"Nättentamen 4.6."}}},{"node":{"id":"4e153253-62e1-5e29-b920-4512181e99a0","frontmatter":{"path":"/onlinetent-ohja","title":"ProgFK onlinetent 28.2.2026"}}},{"node":{"id":"5ba54609-9e23-5f8a-bbb1-3501116bd674","frontmatter":{"path":"/onlinetent-ohpe","title":"ProgGK onlinetent 17.1.2026"}}},{"node":{"id":"15a016f4-0a3d-5ec9-8236-533e57968b89","frontmatter":{"path":"/felanmalningar","title":"Vanliga felmeddelanden"}}},{"node":{"id":"416d07bf-b149-5ede-9d73-ea96ebbe00a2","frontmatter":{"path":"/sanasto","title":"Sanasto"}}},{"node":{"id":"70c6dbee-fa15-5924-a037-5b093295a075","frontmatter":{"path":"/osa-1/1-introduktion","title":"Introduktion"}}},{"node":{"id":"677341cb-d819-5a66-a348-fe483d9d22dd","frontmatter":{"path":"/ofta-stallda-fragar","title":"Ofta ställda frågor"}}},{"node":{"id":"10acce17-6b8d-5a7a-96ef-df73c32033da","frontmatter":{"path":"/osa-1/5-villkorssatser","title":"If-satser"}}},{"node":{"id":"adf0c95e-e532-52ac-acb7-41ecca35f001","frontmatter":{"path":"/osa-1","title":"Modul 1"}}},{"node":{"id":"337cbcae-fea0-535f-a4b7-07d0558220d7","frontmatter":{"path":"/osa-1/4-rakneoperationer","title":"Räkneoperationer"}}},{"node":{"id":"94008673-2d10-5ad1-af95-83b5478b3113","frontmatter":{"path":"/osa-10/1-klasshierarkier","title":"Klasshierarkier"}}},{"node":{"id":"3d48575e-5585-5b61-81ed-fe7585ea7593","frontmatter":{"path":"/osa-10/2-atkamstmodifierare","title":"Åtkomstmodifierare"}}},{"node":{"id":"fd6c2729-204f-5955-84d7-1ee8ed9b243b","frontmatter":{"path":"/osa-10/3-objektorienterade-programmeringstekniker","title":"Objektorienterade programmeringstekniker"}}},{"node":{"id":"648ed3ec-8a44-533a-9b88-7ef8fb7a1314","frontmatter":{"path":"/osa-10/4-storre-applikation","title":"Att utveckla en större applikation"}}},{"node":{"id":"abc32f5b-5700-5a16-b351-3bb0fd9e9b3f","frontmatter":{"path":"/osa-10","title":"Modul 10"}}},{"node":{"id":"b6612d3d-6ef9-5537-b0cf-62a01d4de20e","frontmatter":{"path":"/osa-1/3-mer-om-variabler","title":"Mer om variabler"}}},{"node":{"id":"b4146f07-9889-567c-bb26-315ca8375738","frontmatter":{"path":"/osa-11/1-list-comprehension","title":"Listbyggare"}}},{"node":{"id":"959073ca-1000-5d61-98e3-6a7151d95d71","frontmatter":{"path":"/osa-1/2-info-fran-anvandaren","title":"Information från användaren"}}},{"node":{"id":"a8daa43b-12ea-5482-9768-648407360e5d","frontmatter":{"path":"/osa-11/3-rekursion","title":"Rekursion"}}},{"node":{"id":"4dfa0d82-937f-597e-a323-1ffa57da8548","frontmatter":{"path":"/osa-11/2-mer-om-comprehensions","title":"Mer om listbyggare"}}},{"node":{"id":"848a81c4-fc8c-55cf-99ad-333703ef6d09","frontmatter":{"path":"/osa-11/4-lisaa-esimerkkeja","title":"Fler exempel på rekursion"}}},{"node":{"id":"bd0cfdba-8571-59be-bcfc-b681838806c6","frontmatter":{"path":"/osa-11","title":"Modul 11"}}},{"node":{"id":"d2e288a6-dc52-5b69-b9c9-7c967e3ecd14","frontmatter":{"path":"/osa-12/3-funktionell-programmering","title":"Funktionell programmering"}}},{"node":{"id":"e4a0179a-cac6-5b2f-b1d0-e0db6f5b4339","frontmatter":{"path":"/osa-12/4-reguljara-uttryck","title":"Reguljära uttryck"}}},{"node":{"id":"655d9900-5214-5ba4-88d7-a81fd819b0a0","frontmatter":{"path":"/osa-12","title":"Modul 12"}}},{"node":{"id":"10a6b4aa-f106-50e6-9d72-39e500891fd8","frontmatter":{"path":"/osa-12/2-generatorer","title":"Generatorer"}}},{"node":{"id":"af6df246-f5d2-583d-9f07-5aa9736ff64f","frontmatter":{"path":"/osa-13/1-pygame","title":"Pygame"}}},{"node":{"id":"d7395cb0-da7f-5acf-bf09-fd1035b36e81","frontmatter":{"path":"/osa-13/2-animation","title":"Animation"}}},{"node":{"id":"fef7b1d3-58ba-5d58-8637-0e14a8f584a6","frontmatter":{"path":"/osa-12/1-funktioner-som-argument","title":"Funktioner som argument"}}},{"node":{"id":"bd405169-a47c-5eba-986b-4506b39036ac","frontmatter":{"path":"/osa-13/4-fler-pygame-tekniker","title":"Fler pygame-tekniker"}}},{"node":{"id":"a9357b87-636c-5d96-b46b-bbb6a421f6d0","frontmatter":{"path":"/osa-13/3-handelser","title":"Händelser"}}},{"node":{"id":"78b8d6cc-7e14-5090-b43c-1513e8069e0c","frontmatter":{"path":"/osa-13","title":"Modul 13"}}},{"node":{"id":"5f9e405b-ae8f-5181-b1ae-ff2f4e6ad6da","frontmatter":{"path":"/osa-14/1-spelprojekt","title":"Spelprojekt"}}},{"node":{"id":"6e0e1b55-3ed4-56a8-9580-cd451bb7edde","frontmatter":{"path":"/osa-14/2-robot-och-ladar","title":"Robot och lådor"}}},{"node":{"id":"7f22ddd1-54e5-548f-b8d1-07863a79e2df","frontmatter":{"path":"/osa-14","title":"Modul 14"}}},{"node":{"id":"fea4657b-129f-5bb5-8645-17f84341e4b6","frontmatter":{"path":"/osa-2/1-terminologi","title":"Programmeringsterminologi"}}},{"node":{"id":"8c86392d-05ca-5e03-bf19-9e18db4c3578","frontmatter":{"path":"/osa-2/2-else-elif","title":"Mera om if-satser"}}},{"node":{"id":"4272a508-fa3f-5c99-b0d0-ca0a77dcbd88","frontmatter":{"path":"/osa-2/3-kombinera-villkor","title":"Kombinera villkor"}}},{"node":{"id":"2a9f88b8-4fe8-5fcb-9dfe-b4d98dde5d42","frontmatter":{"path":"/osa-14/3-fardigstallande-av-spelet","title":"Färdigställande av spelet"}}},{"node":{"id":"a620e53b-7d15-54ea-9a40-5d549bf3fddc","frontmatter":{"path":"/osa-14/4-ditt-eget-sepl","title":"Ditt eget spel"}}},{"node":{"id":"6a0f5405-e6cb-581d-92e3-c8af9ad4e7c2","frontmatter":{"path":"/osa-3/1-loopar-med-villkor","title":"Loopar med villkor"}}},{"node":{"id":"a131e4e2-8f05-5986-ab20-e06d9ed60dbe","frontmatter":{"path":"/osa-3/2-behandla-strangar","title":"Behandla strängar"}}},{"node":{"id":"29bc027e-c4f5-5d80-9e6a-bca75ee73682","frontmatter":{"path":"/osa-3/3-mer-om-loopar","title":"Mera om loopar"}}},{"node":{"id":"ed81d1ed-bbbb-573c-a017-e49e4ccd3d56","frontmatter":{"path":"/osa-3/4-definiera-funktioner","title":"Definiera funktioner"}}},{"node":{"id":"f9cdcf8a-269d-5ddb-9346-9ca23e48ef7e","frontmatter":{"path":"/osa-3","title":"Modul 3"}}},{"node":{"id":"8c15b7c7-809b-5ea5-a801-7d20819960ea","frontmatter":{"path":"/osa-4/1-vscode","title":"Editorn Visual Studio Code, Pythontolken och det inbyggda debuggningsverktyget"}}},{"node":{"id":"0f597439-5fd6-5ebf-a758-51fa680510d6","frontmatter":{"path":"/osa-4/2-mer-om-funktioner","title":"Mer om funktioner"}}},{"node":{"id":"d61169f7-0d24-5b3c-8b8c-6f3001453119","frontmatter":{"path":"/osa-4/3-listor","title":"Listor"}}},{"node":{"id":"0cc0967d-12d5-5877-966c-83262ee2d053","frontmatter":{"path":"/osa-4/4-iteration","title":"Iteration"}}},{"node":{"id":"b7f5aab0-16f5-57ea-be99-ef776e766449","frontmatter":{"path":"/osa-4/5-utskrift","title":"Formatera utskrift"}}},{"node":{"id":"7ce1ae54-08a7-55c5-8fdf-e66c163be7c5","frontmatter":{"path":"/osa-4","title":"Modul 4"}}},{"node":{"id":"7616bfc3-86a8-51ad-a63d-f62e70d684f7","frontmatter":{"path":"/osa-5/1-mer-om-listor","title":"Mer om listor"}}},{"node":{"id":"2754089d-7b6b-5a07-98f8-ed47c35f0f1e","frontmatter":{"path":"/osa-5/2-referenser","title":"Referenser"}}},{"node":{"id":"e44de044-469b-5a0c-b484-8b1c6d76b36e","frontmatter":{"path":"/osa-5/4-tuple","title":"Tuple"}}},{"node":{"id":"1777675c-c2e5-5912-9351-6bf786995e74","frontmatter":{"path":"/osa-4/6-strangar-listor","title":"Mera strängar och listor"}}},{"node":{"id":"f5608366-0cdb-5799-ad10-c1ae5bf31ff5","frontmatter":{"path":"/osa-2/4-loopar","title":"Enkla loopar"}}},{"node":{"id":"335a567d-d08f-56d6-8449-9d4bfb7dbbf5","frontmatter":{"path":"/osa-2","title":"Modul 2"}}},{"node":{"id":"05201f8b-92c3-5f20-aa64-572c040a44ef","frontmatter":{"path":"/osa-6/2-skriva-filer","title":"Skriva filer"}}},{"node":{"id":"bc19aa61-1a37-5b73-bd20-0c3994c3a7cf","frontmatter":{"path":"/osa-6/3-fel","title":"Förbered dig på fel"}}},{"node":{"id":"9c4ca0dd-1be2-5b8f-a357-61049541022a","frontmatter":{"path":"/osa-6/1-lasa-filer","title":"Läsa filer"}}},{"node":{"id":"05a28a78-3f81-5cb4-8f94-9a16288789c8","frontmatter":{"path":"/osa-6/4-lokala-globala-variabler","title":"Lokala och globala variabler"}}},{"node":{"id":"2f89b471-3e51-5519-9173-c8029a4a5bf7","frontmatter":{"path":"/osa-6","title":"Modul 6"}}},{"node":{"id":"cda20318-6650-5b01-96a7-c8a9436ea427","frontmatter":{"path":"/osa-7/1-moduler","title":"Moduler"}}},{"node":{"id":"c0858900-47db-5c88-8875-147a8e652fe4","frontmatter":{"path":"/osa-5/3-lexikon","title":"Lexikon"}}},{"node":{"id":"11da0cd6-66de-5139-aeea-f6536ce49cca","frontmatter":{"path":"/osa-7/2-slumpmassighet","title":"Slump"}}},{"node":{"id":"2190a210-ac82-5c3e-8671-037f9247c83f","frontmatter":{"path":"/osa-7/3-tid-datum","title":"Tid och datum"}}},{"node":{"id":"9970fc94-eb27-5148-b31b-e887b737b7b4","frontmatter":{"path":"/osa-7/4-behandla-data","title":"Behandla data"}}},{"node":{"id":"9de0b38c-9ab2-5dca-918f-53f58d473b4e","frontmatter":{"path":"/osa-7/5-egna-moduler","title":"Skapa dina egna moduler"}}},{"node":{"id":"6c06e867-814c-5c2c-b0d6-d6cfaaf92234","frontmatter":{"path":"/osa-5","title":"Modul 5"}}},{"node":{"id":"f7d5f344-d3b4-56c6-bf18-45edc2245759","frontmatter":{"path":"/osa-8/4-metoder-i-egna-klasser","title":"Metoder i egna klasser"}}},{"node":{"id":"303465de-b86a-519b-b1b5-9711b03072d9","frontmatter":{"path":"/osa-8/5-fler-exempel","title":"Fler exempel"}}},{"node":{"id":"a85852ab-8cf8-52b4-8872-4c73d5821319","frontmatter":{"path":"/osa-9/1-objekt-och-referenser","title":"Objekt och referenser"}}},{"node":{"id":"b6cd6b79-fcb4-535d-8d00-b4f849f4647f","frontmatter":{"path":"/osa-9/3-inkapsling","title":"Inkapsling"}}},{"node":{"id":"c6757168-dbea-5c4f-aa4e-c2c3bb0ca423","frontmatter":{"path":"/osa-9/4-metodernas-rackvidd","title":"Metodernas räckvidd"}}},{"node":{"id":"601766bc-2985-5820-a4a3-32bbb761c69b","frontmatter":{"path":"/osa-7/6-funktionaliteter-python","title":"Flera funktionaliteter i Python"}}},{"node":{"id":"08ceb5d1-6e8e-599a-995d-a1125f7a1f80","frontmatter":{"path":"/osa-9/5-klassattribut","title":"Klassattribut"}}},{"node":{"id":"b1f13f0c-169e-519f-9f42-f572bebd8535","frontmatter":{"path":"/osa-9","title":"Modul 9"}}},{"node":{"id":"4b4101dc-9e1f-5a4a-bb4e-dbb6a4ba5e0d","frontmatter":{"path":"/osa-8/3-egna-klasser","title":"Egna klasser"}}},{"node":{"id":"35f36261-94d8-509f-9fcb-59b3e08fc6a1","frontmatter":{"path":"/osa-8/2-klasser-och-objekt","title":"Klasser och objekt"}}},{"node":{"id":"53079b0b-f0d2-5c35-83a0-4f713e57ce72","frontmatter":{"path":"/osa-8/1-objekt-och-metoder","title":"Objekt och metoder"}}},{"node":{"id":"954e5006-2925-5035-a27c-10e05897cfa4","frontmatter":{"path":"/osa-9/6-fler-exempel-med-klasser","title":"Fler exempel med klasser"}}},{"node":{"id":"f1eeb001-f445-57c9-b2e7-380dabc25b86","frontmatter":{"path":"/osa-8","title":"Modul 8"}}},{"node":{"id":"ccc63fff-7834-5270-b69c-944db644a9ad","frontmatter":{"path":"/osa-7","title":"Modul 7"}}},{"node":{"id":"75ae0566-a8bf-5305-aee3-4c5bc0d2d5e9","frontmatter":{"path":"/osa-9/2-objekt-som-attribut","title":"Objekt som attribut "}}}]}},"pageContext":{}}, "staticQueryHashes": ["1357757885","994120085"]}