Notitie
Voor toegang tot deze pagina is autorisatie vereist. U kunt proberen u aan te melden of de directory te wijzigen.
Voor toegang tot deze pagina is autorisatie vereist. U kunt proberen de mappen te wijzigen.
Optimaliseer het ontwerp van uw Windows-app voor aanraakinvoer en krijg standaard ondersteuning voor de muis.
Muisinvoer is het meest geschikt voor gebruikersinteracties waarvoor precisie is vereist bij het aanwijzen en klikken. Deze inherente precisie wordt natuurlijk ondersteund door de gebruikersinterface van Windows, die is geoptimaliseerd voor de onnauwkeurigheid van aanraking.
Aanraakinvoer verschilt van muisinvoer doordat het nauwkeuriger in staat is om de directe manipulatie van UI-elementen na te bootsen via fysieke gebaren die rechtstreeks op deze objecten worden uitgevoerd, zoals vegen, schuiven, slepen, draaien, enzovoort. Voor manipulaties met een muis is doorgaans een ander interface-element vereist, zoals het gebruik van handgrepen om een object te draaien of het formaat ervan te wijzigen.
In dit onderwerp worden ontwerpoverwegingen voor muisinteracties beschreven.
De taal van de MUIS van de UWP-app
Een beknopte set muisinteracties wordt consistent gebruikt in het hele systeem.
| Termijn | Description |
|---|---|
Beweeg de muisaanwijzer om te leren |
Beweeg de muisaanwijzer over een element om meer gedetailleerde informatie weer te geven of visuele elementen (zoals knopinfo) weer te geven zonder een actie te ondernemen. |
Klikken met de linkermuisknop voor primaire actie |
Klik met de linkermuisknop op een element om de primaire actie aan te roepen (zoals het starten van een app of het uitvoeren van een opdracht). |
Schuiven om de weergave te wijzigen |
Schuifbalken weergeven om omhoog, omlaag, links en rechts in een inhoudsgebied te gaan. Gebruikers kunnen schuiven door op schuifbalken te klikken of het muiswiel te draaien. Schuifbalken kunnen de locatie van de huidige weergave in het inhoudsgebied aangeven (pannen met een aanraakscherm toont een vergelijkbare gebruikersinterface). |
Klik met de rechtermuisknop om te selecteren en de opdracht uit te voeren. |
Klik met de rechtermuisknop om de navigatiebalk (indien beschikbaar) en de app-balk met globale opdrachten weer te geven. Klik met de rechtermuisknop op een element om het te selecteren en de app-balk weer te geven met contextuele opdrachten voor het geselecteerde element.
Notitie Klik met de rechtermuisknop om een contextmenu weer te geven als de selectie- of app-balkopdrachten niet geschikt zijn voor het gedrag van de gebruikersinterface. Maar we raden u ten zeerste aan de app-balk te gebruiken voor alle opdrachtgedrag.
|
UI-opdrachten om in te zoomen |
Geef UI-opdrachten weer in de app-balk (zoals + en -) of druk op Ctrl en draai het muiswiel om knijpbewegingen en stretchbewegingen te emuleren voor zoomen. |
UI-opdrachten om te draaien |
Geef UI-opdrachten weer in de app-balk of druk op Ctrl+Shift en draai het muiswiel om de draaibeweging te simuleren. Draai het apparaat zelf zodat het hele scherm wordt gedraaid. |
Klik met de linkermuisknop en sleep om de volgorde te herschiknen |
Klik met de linkermuisknop en sleep een element om het te verplaatsen. |
Klik met de linkermuisknop en sleep om tekst te selecteren |
Klik met de linkermuisknop in de selecteerbare tekst en sleep om deze te selecteren. Dubbelklik om een woord te selecteren. |
Gebeurtenissen voor muisinvoer
De meeste muisinvoer kan worden verwerkt via de algemene gerouteerde invoergebeurtenissen die worden ondersteund door alle UIElement-objecten . Deze omvatten:
- BringIntoViewRequested
- CharacterReceived
- ContextGeannuleerd
- ContextRequested
- DoubleTapped
- DragEnter
- DragLeave
- DragOver
- DragStarting
- Verplaats
- DropCompleted
- GettingFocus
- GotFocus
- Holding
- KeyDown
- KeyUp
- LosingFocus
- LostFocus
- ManipulatieVoltooid
- ManipulatieDelta
- ManipulatieInertiaStarting
- ManipulationStarted
- ManipulatieStarten
- NoFocusCandidateFound
- AanwijzerGeannuleerd
- PointerCaptureLost
- PointerEntered
- PointerExited
- Aanwijzer verplaatst
- Aanwijzer ingedrukt
- PointerReleased
- PointerWheelChanged
- PreviewKeyDown
- PreviewKeyUp
- RightTapped
- Tikte
U kunt echter profiteren van de specifieke mogelijkheden van elk apparaat (zoals muiswielgebeurtenissen) met behulp van de aanwijzer, beweging en manipulatiegebeurtenissen in Windows.UI.Input.
Voorbeelden: Zie ons BasicInput-voorbeeld voor meer informatie.
Richtlijnen voor visuele feedback
- Wanneer een muis wordt gedetecteerd (door verplaatsings- of aanwijsgebeurtenissen), geeft u de muisspecifieke gebruikersinterface weer om de functionaliteit aan te geven die door het element wordt weergegeven. Als de muis gedurende een bepaalde tijd niet beweegt of als de gebruiker een aanraakinteractie start, laat u de gebruikersinterface van de muis geleidelijk vervagen. Hierdoor blijft de gebruikersinterface schoon en overzichtelijk.
- Gebruik geen cursor voor hoverfeedback; de feedback van het element is voldoende (zie cursors hieronder).
- Geen visuele feedback weergeven als een element geen ondersteuning biedt voor interactie (zoals statische tekst).
- Gebruik geen focusrechthoeken met muisinteracties. Houd deze gereserveerd voor interacties met het toetsenbord.
- Visuele feedback gelijktijdig weergeven voor alle elementen die hetzelfde invoerdoel vertegenwoordigen.
- Geef knoppen (zoals + en -) op voor het emuleren van aanraakbewerkingen zoals pannen, draaien, zoomen, enzovoort.
Zie Richtlijnen voor visuele feedback voor meer algemene richtlijnen voor visuele feedback.
Cursors
Er is een set standaardcursors beschikbaar voor een muis aanwijzer. Deze worden gebruikt om de primaire actie van een element aan te geven.
Aan elke standaardcursor is een bijbehorende standaardafbeelding gekoppeld. De gebruiker of een app kan de standaardafbeelding die is gekoppeld aan elke standaardcursor op elk gewenst moment vervangen. Geef een cursorafbeelding op via de functie PointerCursor .
Als u de muiscursor wilt aanpassen:
- Gebruik altijd de pijlcursor (
) voor klikbare elementen. gebruik de wijzende hand cursor (
) niet voor koppelingen of andere interactieve elementen. Gebruik in plaats daarvan hover-effecten (eerder beschreven). - Gebruik de tekstcursor (
) voor selecteerbare tekst. - Gebruik de verplaatscursor (
) wanneer verplaatsen de primaire actie is (zoals bij slepen of croppen). Gebruik de verplaatsingscursor niet voor elementen waarbij navigatie de primaire actie is (zoals Starttegels). - Gebruik de horizontale, verticale en diagonale cursorgrootte (
,
,
,
), wanneer een object kan worden aangepast. - Gebruik de grijpende handcursors (
,
) bij het verschuiven van inhoud binnen een vast canvas (zoals een kaart).
Verwante artikelen
- Invoer van handlepointer
- Invoerapparaten identificeren
- Overzicht van gebeurtenissen en gerouteerde gebeurtenissen
Samples
Windows developer