Skip to content

Visual Studio Code

oivron edited this page Jan 12, 2024 · 59 revisions

Visual Studio Code med Python

Visual Studio Code har de siste årene vært verdens mest populære kildekodeeditor. Men i skolen er programmet relativt lite brukt. Programmet har mange muligheter og mye funksjonalitet som elever med blindhet, svaksynthet og hjernerelaterte synsvansker kan dra nytte av:

  • Tilpasning av farger og kontrast
  • Tilpasning av programvinduets utseende
  • Forstørring
  • Støtte for skjermlesere
  • Mange hurtigtaster

Til sammen kan dette gjøre at enkelte elever med nedsatt syn kan klare seg uten ressurskrevende skjermforstørringsprogram. Det finnes imidlertid ikke tilpasningsmuligheter for pekere (mus, markør). Dette kan man i stedet oppnå direkte i Windows (Win+U).

Programmet har god støtte for skjermleserne NVDA, JAWS og VoiceOver.

Microsofts egen informasjon om tilgjengelighet i Visual Studio Code.

Installasjon og klargjøring (Windows)

Denne beskrivelsen forklarer hvordan du installerer Visual Studio Code for programmering i Python. Husk at du må installere Python før du installerer Visual Studio Code.

Klikk for å utvide.

Python

Installasjon

Installasjonsveiviseren for Python

  1. Last ned nyeste versjon av Python fra python.org/downloads.

  2. Kjør installasjonen.

  3. Kryss av for Add python.exe to PATH.

  4. Velg Install Now.

  5. Velg Close når installasjonen er ferdig.

Visual Studio Code

Skjermbilde av Visual Studio Code med Get started-dokumentet åpent

Installasjon

  1. Last ned Visual Studio Code fra code.visualstudio.com.

  2. Kjør installasjonen.

  3. Velg I accept the agreement og behold standardvalgene gjennom hele veiviseren.

  4. Åpne programmet.

Åpne-dialogen som kommer fram når man oppretter en ny mappe i Visual Studio Code.

Legg til mappe

Du må velge eller legge til en ny mappe før du kan gå i gang med å programmere. Mappen vil inneholde alle filene du bruker til programmeringen.

  1. Velg Open Folder fra File > Open Folder eller bruk Ctrl+K etterfulgt av Ctrl+O.

  2. Du får fram en dialogboks. Velg en mappe, eller opprett en ny og gi den et beskrivende navn. Gå inn i mappen og velg deretter knappen Velg mappe.

Do you trust the authors of the files in this folder?

  1. Velg knappen Yes, I trust the authors for å bekrefte at du stoler på alle filene som vil bli lagret i denne mappen.

Mappen du valgte vil nå bli brukt av Visual Studio Code. Den samme mappen vil bli brukt hver gang du åpner Visual Studio Code, helt til du velger en annen.

Extensions

Visual Studio Code: Søk etter Python-extensions

Extension: Python

Visual Studio Code støtter i utgangspunktet bare programmeringsspråkene JavaScript, TypeScript, HTML og CSS. Men programmet støtter likevel nesten alle de viktigste språkene, men det vil kreve såkalte Extensions. For å programmere i Python, må du derfor installere en Python-extension.

  1. Åpne Extensions-feltet (Ctrl+Shift+X).

  2. Søk etter python fra søkefeltet øverst i Extensions-feltet. Installer utvidelsen Python (utgiver Microsoft) ved å velge den blå Install-knappen. Dette vil samtidig gi deg støtte for Jupyter Notebook.

  3. Start Visual Studio Code på nytt.

  4. Du er nå klar til å programmere i Python!

Visual Studio Code: Søk etter Screen Reader Mode-extension

Extension: Screen Reader Mode (valgfri)

For at Visual Studio Code skal fungerer best mulig for elever som bruker punktskrift, anbefaler vi en extension som kalles Screen Reader Mode. Den vil endre en del av innstillingene i Visual Studio Code.

  1. Åpne Extensions-feltet (Ctrl+Shift+X).

  2. Søk etter screen reader mode fra søkefeltet øverst i Extensions-feltet. Installer utvidelsen Screen Reader Mode (utgiver Statped) ved å velge den blå Install-knappen.

  3. Åpne Command Palette (F1) og søk etter recommended. Velg Recommended User Settings (Screen Reader) fra lista for å aktivere de anbefalte innstillingene.

Visual Studio Code: Søk etter Pylint-extension

  1. Hvis du får spørsmål om å installere Pylint, velg Install Pylint extension.

  2. Start Visual Studio Code på nytt.

  3. De anbefalte innstillingene er nå aktive!

Bruk av programmet for elever med nedsatt syn

Visual Studio Code har gode tilpasningsmuligheter. Det har en nyttig zoom-funksjon, ulike fargeoppsett, og mulighet til å forenkle programvinduet. Dessuten er det tilordnet hurtigtaster til de fleste funksjonene i programmet.

Klikk for å utvide.

Zoom (Ctrl+Pluss/Ctrl+Minus)

Du kan øke zoom-nivået med Ctrl+Pluss. Da vil alt forstørres, ikke bare teksten. Tilsvarende kan du zoome ut med Ctrl+Minus.

Color Themes (Ctrl+K, Ctrl+T)

Visual Studio Code Color Theme Du kan velge blant mange fargetema, både lyse og mørke. Det finnes dessuten tema som gir deg høykontrastfarger. Bruk Pil opp eller Pil ned for å velge ønsket tema fra lista. Temaet endres automatisk når du piler, slik at du umiddelbart får et inntrykk av hvordan de fungerer for deg. Det er mulig å installere flere tema eller tilpasse oppsett etter dine egne behov.

Zen Mode (Ctrl+K, Z)

Visual Studio Code Zen Mode Zen Mode er en innstilling som i utgangspunktet bare viser selve editor-delen av programmet. Den vil med andre ord bare vise fila du redigerer. Terminal, Explorer-feltet og andre elementer vil ikke vises. Dette er en form for forenkling som kan egne seg godt for enkelte elever. Det går riktignok an å vise andre ting i tillegg, men da må du aktivere dette manuelt. Du kan for eksempel vise Terminal i Zen-mode hvis du aktiver den med Ctrl+Ø.

File Icon Themes

Det er mulig å velge hvordan ikoner i programvinduet skal vises (Ctrl+Shift+P, skriv theme, og velg File Icon Theme). Du kan velge mellom Seti (standard), Minimal og None. Det kan være hensiktsmessig å endre eller fjerne ikonene helt. Oppsettet Minimal viser et forenklet tema der alle filer vises med samme forenklede symbol med samme farge. Temaet None fjerner ikonene helt, noe som kan være en god forenkling for enkelte elever. Det er også mulig å installere flere tema.

Bruk av programmet for elever som er blinde

Visual Studio Code har god støtte for skjermlesere som JAWS, NVDA og VoiceOver. Det store utvalget av hurtigtaster gjør det enkelt å navigere rundt i programmet. Den integrerte terminalen kan være utfordrende å bruke. Men programmet har støtte for ekstern terminal, som vil være et godt alternativ.

Klikk for å utvide.

Tips til innstillinger i skjermleser

JAWS

  • Deaktiver avkryssingsboksen Slå på tekstomslutting. (JAWS programvindu > Verktøy > Settings Senter: Velg Punkt og deretter Generelt.)
  • Aktiver avkryssingsboksen Les Innrykkede Tegn. (Ins+6 > Behandling av tekst > Generelt > Les Innrykkede Tegn.)

NVDA

  • Deaktiver avkryssingsboksen Forhindre ordsplitting når mulig.

Editor

Du får skriveekko i både punkt og med tale. Leselistfokus følger skrivermerket når du skriver, men også i menyer og dialoger. Når du bruker piltaster vil du også få ekko i punkt og med tale. Tastene på leselist vil fungere når du leser. Bruk av markørhentere fungerer også riktig.

Quick Suggestions fungerer fint. Quick Suggestions er en liste med forslag som dukker opp automatisk når du skriver kode. Når lista kommer fram, vil du ikke se koden i dokumentet ditt. Du vil i stedet se innholdet i lista helt til du velger noe fra lista eller trykker Esc for å avbryte Quick Suggestions.

Det går an å deaktivere Quick Suggestions. Det kan gjøres ved å installere en extension som kalles Screen Reader Mode. Se beskrivelse av denne for nærmere forklaring.

Feil og advarsler i programkoden

Audio Cues

Visual Studio Code bruker lydsignaler for å gi deg et hint i ulike situasjoner. Du vil for eksempel høre et signal når du kommer til en linje i programkoden som inneholder feil. Dette kan hjelpe deg å oppdage feil i programkoden raskt.

Du kan få en oversikt over de ulike situasjonene som dekkes med tilhørende lydsignaler. Trykk Ctrl+Shift+P og søk etter kommandoen Help: List Audio Cues. Bruk piltastene for å bla i lista og høre de ulike lydsignalene.

Problems (Ctrl+Shift+M)

I panelet Problems vil du se en liste over feil og advarsler. Vær klar over at lista viser feil og advarsler for alle åpne filer, så det kan lønne seg å kun ha én fil åpen av gangen. Lista viser både linjenummer og posisjon på linja der en feil befinner seg. Trykker du Enter, vil du komme tilbake til fila på den linja der feilen befinner seg.

Errors and Warnings F8

Visual Studio Code Next Problem Denne funksjonen brukes til å gå direkte gjennom en fil for å finne feil og advarsler. Feil og advarsler vises direkte under den aktuelle linja i fila. Hver gang du trykker F8, kommer du til neste feil.

Talen i skjermleseren leser dette automatisk, men advarselen eller feilmeldingen vises bare delvis på leselist. Dette gjør det litt vanskelig å få med seg meldingen. Det er derfor bedre å finne feil og advarsler i programkoden ved hjelpe av panelet Problems (Ctrl+Shift+M) som ble beskrevet tidligere.

Terminal

Terminalen er det stedet der du kjører eller utfører programmene dine. Den integrerte terminalen kan være utfordrende å bruke når du bruker skjermleser. Alternativt kan du bruke en ekstern terminal som allerede er installert på datamaskinen din.

Integrert terminal (Ctrl+Ø)

Visual Studio Code Focus Accessible View Skjermlesere vil i utgangspunktet ikke lese innholdet i det integrerte terminalvinduet. Men det går an å gå inn i noe som kalles Focus Accessible Terminal View for å lese terminalinnholdet. Informasjon om dette finner du ved å gå til Terminal (Ctrl+Ø) og så velge Show Accessibility Help (Alt+F1).

Gå inn i Focus Accessible View med Alt+F2 og gå ut med Esc. I bufferet kan du lese innholdet med Pil opp og Pil ned. Men du kan ikke skrive i terminalen når du er i Focus Accessible View.

Når du skal kjøre et program som ber deg oppgi en verdi, kan du ikke være i Focus Accessible View. Kjør programmet uten Focus Accessible View og gå deretter inn i Focus Accessible View for å lese innholdet i terminalen etterpå. Selv om skjermlesere ikke leser innholdet i bufferet, vil talen likevel gi deg beskjed dersom programmet du kjører ber deg oppgi verdier eller svare på spørsmål. Dette fungerer bare delvis på leselist (med JAWS, ikke NVDA.)

Ekstern terminal (Ctrl+Shift+C)

Visual Studio Code External Terminal Det vil nok være enklere på mange måter å bruke en alternativ terminal der du slipper å forholde deg til Focus Accessible Buffer. Du bruker da en ekstern terminal (det vil si utenfor Visual Studio Code) for å kjøre programmene dine:

  • Åpne fila du ønsker å kjøre i Visual Studio Code.
  • Åpne ekstern terminal med Ctrl+Shift+C.
  • Du kommer da inn i ekstern terminal i riktig mappe.
  • Innholdet i vinduet leses enklest med leselist.
  • Gå tilbake til Visual Studio Code med Alt+Tab (du trenger ikke lukke den eksterne terminalen).

Explorer (Ctrl+Shift+E)

Når du velger Explorer, kommer du inn i en liste med mapper og filer som tilhører valgt mappe eller workspace. Her brukes en vanlig trestruktur der du kan vise/skjule innholdet i mapper. Det enkleste er kanskje å bruke piltastene for å navigere. Leselist viser innholdet når du navigerer.

Explorer har mange tastekommandoer som du kjenner fra andre sammenhenger: Pil høyre viser innholdet i en mappe, Pil venstre skjuler innholdet, Enter åpner en fil, Delete sletter en fil, mens Shift+F10 åpner hurtigmenyen for en fil eller mappe.

Command Palette (Ctrl+Shift+P)

Visual Studio Code Command Palette Command Palette er en slags søkefunksjon som gir deg en liste over alle kommandoer i Visual Studio Code. Du kommer direkte inn i et søkefelt du kan bruke for å finne det du leter etter. Bruk Pil opp og Pil ned for å navigere i lista. Nylig brukte kommandoer vil alltid ligger øverst i lista. Command Palette kan også brukes til å finne en hurtigtast. Tale og leselist følger når du navigerer i lista.

Hurtigtaster

Her følger et utvalg av noen viktige hurtigtaster i Visual Studio Code. En fullstendig oversikt over alle hurtigtaster finner du på: https://code.visualstudio.com/shortcuts/keyboard-shortcuts-windows.pdf. Det er også mulig å legge til eller endre hurtigtaster.

Klikk for å utvide.

Utvalgte hurtigtaster

Kommando Hurtigtast
Ny fil Ctrl+N
Lagre fil Ctrl+S
Åpne fil Ctrl+O
Problems (feil og advarsler) Ctrl+Shift+M
Gå til terminal Ctrl+Ø
Gå til editor (fil) Ctrl+1
Gå til fil Ctrl+P
Explorer (filutforsker) Ctrl+Shift+E
Color Theme (fargeoppsett) Ctrl+K, Ctrl+T
File Icon Theme (visning av ikoner) Ctrl+Shift+P, søk etter “file icon theme”
Zoom Ctrl++/Ctrl+-
Zen mode (enkelt oppsett) Ctrl+K, Z
Side Bar vis/skjul Ctrl+B
Panel vis/skjul Ctrl+J

Definer hurtigtaster (Ctrl+K Ctrl+S)

Tastetrykket Ctrl+K Ctrl+S åpner lista over alle funksjoner i Visual Studio Code med sine tilordnede hurtigtaster. Her kan du også legge til egne hurtigtaster eller endre hurtigtaster dersom det er konflikter med andre program. Vær klar over at ikke alle funksjoner i programmet har tilordnet hurtigtaster som standard.