{
    "componentChunkName": "component---src-templates-course-content-template-js",
    "path": "/osa-13/4-fler-pygame-tekniker",
    "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":"Kommer du att veta hur man titlar pygame-fönstret"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"li","properties":{},"children":[{"type":"text","value":"Kommer du att kunna rita former med pygame"}]},{"type":"text","value":"\n"},{"type":"element","tagName":"li","properties":{},"children":[{"type":"text","value":"Kommer du att veta hur du visar text i ditt fönster"}]},{"type":"text","value":"\n"}]}]},{"type":"element","tagName":"h2","properties":{"id":"fonstrets-titel","style":"position:relative;"},"children":[{"type":"text","value":"Fönstrets titel"},{"type":"element","tagName":"a","properties":{"href":"#fonstrets-titel","ariaLabel":"fonstrets titel 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":"Dina program kommer att se mer professionella ut om fönstertiteln istället för \"pygame window\" innehåller det faktiska namnet på programmet. Titeln ställs in med funktionen "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"pygame.display.set_caption"}]},{"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":"display"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"set_caption"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","string"]},"children":[{"type":"text","value":"\"Det stora äventyret\""}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]}]}]}]},{"type":"element","tagName":"h2","properties":{"id":"att-rita-former","style":"position:relative;"},"children":[{"type":"text","value":"Att rita former"},{"type":"element","tagName":"a","properties":{"href":"#att-rita-former","ariaLabel":"att rita former 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":"Följande program ritar en rektangel, en cirkel och en linje på skärmen:"}]},{"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":"\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":"\n\npygame"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"draw"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"rect"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"text","value":"fonster"},{"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":"255"}]},{"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":" "},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"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":"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":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"250"}]},{"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":"draw"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"circle"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"text","value":"fonster"},{"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":"255"}]},{"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":" "},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"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":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"150"}]},{"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":" "},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"40"}]},{"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":"draw"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"line"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"text","value":"fonster"},{"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":"text","value":" "},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"255"}]},{"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":" "},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"80"}]},{"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":"120"}]},{"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":" "},{"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":"160"}]},{"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":" "},{"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":"\n\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":"Körning av koden ovan borde se ut enligt följande:"}]},{"type":"element","tagName":"img","properties":{"src":"/9a7380e2e818c94a080d41344f073d5a/pygame_kuviot.gif"},"children":[]},{"type":"element","tagName":"h2","properties":{"id":"att-rita-text","style":"position:relative;"},"children":[{"type":"text","value":"Att rita text"},{"type":"element","tagName":"a","properties":{"href":"#att-rita-text","ariaLabel":"att rita text 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":"Text i pygame ritas i två steg: först skapar vi en bild som innehåller den önskade texten, och sedan ritas denna bild på skärmen. Det fungerar på följande sätt:"}]},{"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":"\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":"\n\nfont "},{"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":"font"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"SysFont"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","string"]},"children":[{"type":"text","value":"\"Arial\""}]},{"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":"24"}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":")"}]},{"type":"text","value":"\ntext "},{"type":"element","tagName":"span","properties":{"className":["token","operator"]},"children":[{"type":"text","value":"="}]},{"type":"text","value":" font"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"."}]},{"type":"text","value":"render"},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","string"]},"children":[{"type":"text","value":"\"<Moikka!>\""}]},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":","}]},{"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":" "},{"type":"element","tagName":"span","properties":{"className":["token","punctuation"]},"children":[{"type":"text","value":"("}]},{"type":"element","tagName":"span","properties":{"className":["token","number"]},"children":[{"type":"text","value":"255"}]},{"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":"text"},{"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":"Körning av koden ovan borde se ut enligt följande:"}]},{"type":"element","tagName":"img","properties":{"src":"/ff536f08ddabdda8d522cc90c967ca8e/pygame_teksti.gif"},"children":[]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Här skapar metoden "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"pygame.font.SysFont"}]},{"type":"text","value":" ett typsnittsobjekt, som använder systemtypsnittet Arial i storlek 24. Metoden "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"render"}]},{"type":"text","value":" skapar sedan en bild av den angivna texten i den angivna färgen. Denna bild ritas på fönstret med metoden "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"blit"}]},{"type":"text","value":", precis som tidigare."}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"OBS: olika system kommer att ha olika teckensnitt tillgängliga. Om det system som det här programmet körs på inte har teckensnittet Arial, trots att Arial är ett mycket vanligt teckensnitt som finns på de flesta system, används istället systemets standardteckensnitt. Om du behöver ha ett specifikt teckensnitt tillgängligt för ditt spel kan du inkludera teckensnittsfilen i spelkatalogen och ange dess plats för metoden "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"pygame.font.Font"}]},{"type":"text","value":"."}]},{"type":"element","tagName":"h2","properties":{"id":"ovningar","style":"position:relative;"},"children":[{"type":"text","value":"Övningar"},{"type":"element","tagName":"a","properties":{"href":"#ovningar","ariaLabel":"ovningar 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 några mer avancerade övningar för att öva på det du har lärt dig i denna del av kursmaterialet."}]},{"type":"element","tagName":"programming-exercise","properties":{"name":"Kello","tmcname":"osa13-16_kello"},"children":[{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Skriv ett program som visar en urtavla som visar systemtiden. Slutresultatet ska se ut så här:"}]},{"type":"element","tagName":"img","properties":{"src":"/0e95a9664e02d0dd939be3ebfd4725d5/pygame_kello.gif"},"children":[]}]},{"type":"element","tagName":"programming-exercise","properties":{"name":"Asteroider","tmcname":"osa13-17_asteroider"},"children":[{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Skapa ett spel där asteroider faller från himlen. Spelaren flyttar en robot till höger och vänster och försöker samla upp de fallande stenarna. Spelaren får ett poäng för varje asteroid som samlas in och den totala poängen visas högst upp i fönstret. Spelet tar slut när spelaren missar en asteroid. Slutresultatet bör se ut så här:"}]},{"type":"element","tagName":"img","properties":{"src":"/589bb5f7fafc7f948dfab758f0bd6273/pygame_asteroidit.gif"},"children":[]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"I uppgiftsbotten finns bilden "},{"type":"element","tagName":"code","properties":{"className":["language-text"]},"children":[{"type":"text","value":"sten.png"}]},{"type":"text","value":" för asteroiden."}]}]},{"type":"element","tagName":"p","properties":{},"children":[{"type":"text","value":"Svara vänligen på en snabb enkät om denna del av kursen:"}]},{"type":"element","tagName":"div","properties":{},"children":[{"type":"element","tagName":"quiz","properties":{"id":"86a0a276-69a0-58ea-956f-a118957fd07b"},"children":[]}]}]},"html":"<div><text-box variant='learningObjectives' name='Inlärningsmål'><p>Efter den här delen</p><ul>\n<li>Kommer du att veta hur man titlar pygame-fönstret</li>\n<li>Kommer du att kunna rita former med pygame</li>\n<li>Kommer du att veta hur du visar text i ditt fönster</li>\n</ul></text-box><h2 id=\"fonstrets-titel\" style=\"position:relative;\">Fönstrets titel<a href=\"#fonstrets-titel\" aria-label=\"fonstrets titel permalink\" class=\"anchor after\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"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\"></path></svg></a></h2><p>Dina program kommer att se mer professionella ut om fönstertiteln istället för \"pygame window\" innehåller det faktiska namnet på programmet. Titeln ställs in med funktionen <code class=\"language-text\">pygame.display.set_caption</code>:</p><div class=\"gatsby-highlight\" data-language=\"python\"><pre class=\"language-python\"><code class=\"language-python\">pygame<span class=\"token punctuation\">.</span>display<span class=\"token punctuation\">.</span>set_caption<span class=\"token punctuation\">(</span><span class=\"token string\">\"Det stora äventyret\"</span><span class=\"token punctuation\">)</span></code></pre></div><h2 id=\"att-rita-former\" style=\"position:relative;\">Att rita former<a href=\"#att-rita-former\" aria-label=\"att rita former permalink\" class=\"anchor after\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"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\"></path></svg></a></h2><p>Följande program ritar en rektangel, en cirkel och en linje på skärmen:</p><div class=\"gatsby-highlight\" data-language=\"python\"><pre class=\"language-python\"><code class=\"language-python\"><span class=\"token keyword\">import</span> pygame\n\npygame<span class=\"token punctuation\">.</span>init<span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span>\nfonster <span class=\"token operator\">=</span> pygame<span class=\"token punctuation\">.</span>display<span class=\"token punctuation\">.</span>set_mode<span class=\"token punctuation\">(</span><span class=\"token punctuation\">(</span><span class=\"token number\">640</span><span class=\"token punctuation\">,</span> <span class=\"token number\">480</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">)</span>\nfonster<span class=\"token punctuation\">.</span>fill<span class=\"token punctuation\">(</span><span class=\"token punctuation\">(</span><span class=\"token number\">0</span><span class=\"token punctuation\">,</span> <span class=\"token number\">0</span><span class=\"token punctuation\">,</span> <span class=\"token number\">0</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">)</span>\n\npygame<span class=\"token punctuation\">.</span>draw<span class=\"token punctuation\">.</span>rect<span class=\"token punctuation\">(</span>fonster<span class=\"token punctuation\">,</span> <span class=\"token punctuation\">(</span><span class=\"token number\">0</span><span class=\"token punctuation\">,</span> <span class=\"token number\">255</span><span class=\"token punctuation\">,</span> <span class=\"token number\">0</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">,</span> <span class=\"token punctuation\">(</span><span class=\"token number\">50</span><span class=\"token punctuation\">,</span> <span class=\"token number\">100</span><span class=\"token punctuation\">,</span> <span class=\"token number\">200</span><span class=\"token punctuation\">,</span> <span class=\"token number\">250</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">)</span>\npygame<span class=\"token punctuation\">.</span>draw<span class=\"token punctuation\">.</span>circle<span class=\"token punctuation\">(</span>fonster<span class=\"token punctuation\">,</span> <span class=\"token punctuation\">(</span><span class=\"token number\">255</span><span class=\"token punctuation\">,</span> <span class=\"token number\">0</span><span class=\"token punctuation\">,</span> <span class=\"token number\">0</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">,</span> <span class=\"token punctuation\">(</span><span class=\"token number\">200</span><span class=\"token punctuation\">,</span> <span class=\"token number\">150</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">,</span> <span class=\"token number\">40</span><span class=\"token punctuation\">)</span>\npygame<span class=\"token punctuation\">.</span>draw<span class=\"token punctuation\">.</span>line<span class=\"token punctuation\">(</span>fonster<span class=\"token punctuation\">,</span> <span class=\"token punctuation\">(</span><span class=\"token number\">0</span><span class=\"token punctuation\">,</span> <span class=\"token number\">0</span><span class=\"token punctuation\">,</span> <span class=\"token number\">255</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">,</span> <span class=\"token punctuation\">(</span><span class=\"token number\">80</span><span class=\"token punctuation\">,</span> <span class=\"token number\">120</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">,</span> <span class=\"token punctuation\">(</span><span class=\"token number\">300</span><span class=\"token punctuation\">,</span> <span class=\"token number\">160</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">,</span> <span class=\"token number\">2</span><span class=\"token punctuation\">)</span>\n\npygame<span class=\"token punctuation\">.</span>display<span class=\"token punctuation\">.</span>flip<span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span>\n\n<span class=\"token keyword\">while</span> <span class=\"token boolean\">True</span><span class=\"token punctuation\">:</span>\n    <span class=\"token keyword\">for</span> handelse <span class=\"token keyword\">in</span> pygame<span class=\"token punctuation\">.</span>event<span class=\"token punctuation\">.</span>get<span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">:</span>\n        <span class=\"token keyword\">if</span> handelse<span class=\"token punctuation\">.</span><span class=\"token builtin\">type</span> <span class=\"token operator\">==</span> pygame<span class=\"token punctuation\">.</span>QUIT<span class=\"token punctuation\">:</span>\n            exit<span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span></code></pre></div><p>Körning av koden ovan borde se ut enligt följande:</p><img src=\"/9a7380e2e818c94a080d41344f073d5a/pygame_kuviot.gif\"><h2 id=\"att-rita-text\" style=\"position:relative;\">Att rita text<a href=\"#att-rita-text\" aria-label=\"att rita text permalink\" class=\"anchor after\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"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\"></path></svg></a></h2><p>Text i pygame ritas i två steg: först skapar vi en bild som innehåller den önskade texten, och sedan ritas denna bild på skärmen. Det fungerar på följande sätt:</p><div class=\"gatsby-highlight\" data-language=\"python\"><pre class=\"language-python\"><code class=\"language-python\"><span class=\"token keyword\">import</span> pygame\n\npygame<span class=\"token punctuation\">.</span>init<span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span>\nfonster <span class=\"token operator\">=</span> pygame<span class=\"token punctuation\">.</span>display<span class=\"token punctuation\">.</span>set_mode<span class=\"token punctuation\">(</span><span class=\"token punctuation\">(</span><span class=\"token number\">640</span><span class=\"token punctuation\">,</span> <span class=\"token number\">480</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">)</span>\nfonster<span class=\"token punctuation\">.</span>fill<span class=\"token punctuation\">(</span><span class=\"token punctuation\">(</span><span class=\"token number\">0</span><span class=\"token punctuation\">,</span> <span class=\"token number\">0</span><span class=\"token punctuation\">,</span> <span class=\"token number\">0</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">)</span>\n\nfont <span class=\"token operator\">=</span> pygame<span class=\"token punctuation\">.</span>font<span class=\"token punctuation\">.</span>SysFont<span class=\"token punctuation\">(</span><span class=\"token string\">\"Arial\"</span><span class=\"token punctuation\">,</span> <span class=\"token number\">24</span><span class=\"token punctuation\">)</span>\ntext <span class=\"token operator\">=</span> font<span class=\"token punctuation\">.</span>render<span class=\"token punctuation\">(</span><span class=\"token string\">\"&lt;Moikka!>\"</span><span class=\"token punctuation\">,</span> <span class=\"token boolean\">True</span><span class=\"token punctuation\">,</span> <span class=\"token punctuation\">(</span><span class=\"token number\">255</span><span class=\"token punctuation\">,</span> <span class=\"token number\">0</span><span class=\"token punctuation\">,</span> <span class=\"token number\">0</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">)</span>\nfonster<span class=\"token punctuation\">.</span>blit<span class=\"token punctuation\">(</span>text<span class=\"token punctuation\">,</span> <span class=\"token punctuation\">(</span><span class=\"token number\">100</span><span class=\"token punctuation\">,</span> <span class=\"token number\">50</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">)</span>\npygame<span class=\"token punctuation\">.</span>display<span class=\"token punctuation\">.</span>flip<span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span>\n\n<span class=\"token keyword\">while</span> <span class=\"token boolean\">True</span><span class=\"token punctuation\">:</span>\n    <span class=\"token keyword\">for</span> handelse <span class=\"token keyword\">in</span> pygame<span class=\"token punctuation\">.</span>event<span class=\"token punctuation\">.</span>get<span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">:</span>\n        <span class=\"token keyword\">if</span> handelse<span class=\"token punctuation\">.</span><span class=\"token builtin\">type</span> <span class=\"token operator\">==</span> pygame<span class=\"token punctuation\">.</span>QUIT<span class=\"token punctuation\">:</span>\n            exit<span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span></code></pre></div><p>Körning av koden ovan borde se ut enligt följande:</p><img src=\"/ff536f08ddabdda8d522cc90c967ca8e/pygame_teksti.gif\"><p>Här skapar metoden <code class=\"language-text\">pygame.font.SysFont</code> ett typsnittsobjekt, som använder systemtypsnittet Arial i storlek 24. Metoden <code class=\"language-text\">render</code> skapar sedan en bild av den angivna texten i den angivna färgen. Denna bild ritas på fönstret med metoden <code class=\"language-text\">blit</code>, precis som tidigare.</p><p>OBS: olika system kommer att ha olika teckensnitt tillgängliga. Om det system som det här programmet körs på inte har teckensnittet Arial, trots att Arial är ett mycket vanligt teckensnitt som finns på de flesta system, används istället systemets standardteckensnitt. Om du behöver ha ett specifikt teckensnitt tillgängligt för ditt spel kan du inkludera teckensnittsfilen i spelkatalogen och ange dess plats för metoden <code class=\"language-text\">pygame.font.Font</code>.</p><h2 id=\"ovningar\" style=\"position:relative;\">Övningar<a href=\"#ovningar\" aria-label=\"ovningar permalink\" class=\"anchor after\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"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\"></path></svg></a></h2><p>Här är några mer avancerade övningar för att öva på det du har lärt dig i denna del av kursmaterialet.</p><programming-exercise name='Kello' tmcname='osa13-16_kello'><p>Skriv ett program som visar en urtavla som visar systemtiden. Slutresultatet ska se ut så här:</p><img src=\"/0e95a9664e02d0dd939be3ebfd4725d5/pygame_kello.gif\"></programming-exercise><programming-exercise name='Asteroider' tmcname='osa13-17_asteroider'><p>Skapa ett spel där asteroider faller från himlen. Spelaren flyttar en robot till höger och vänster och försöker samla upp de fallande stenarna. Spelaren får ett poäng för varje asteroid som samlas in och den totala poängen visas högst upp i fönstret. Spelet tar slut när spelaren missar en asteroid. Slutresultatet bör se ut så här:</p><img src=\"/589bb5f7fafc7f948dfab758f0bd6273/pygame_asteroidit.gif\"><p>I uppgiftsbotten finns bilden <code class=\"language-text\">sten.png</code> för asteroiden.</p></programming-exercise><p>Svara vänligen på en snabb enkät om denna del av kursen:</p><div><quiz id=\"86a0a276-69a0-58ea-956f-a118957fd07b\"></quiz></div></div>","frontmatter":{"path":"/osa-13/4-fler-pygame-tekniker","title":"Fler pygame-tekniker"},"fileAbsolutePath":"/home/runner/work/ohjelmointi-26-sv/ohjelmointi-26-sv/data/osa-13/4-fler-pygame-tekniker.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"]}