Share via

Funktionen SetFocus

  • Artikel

Gælder for: Lærredapps Modelbaserede apps

Flytter inputfokus til et bestemt kontrolelement.

Description

Funktionen SetFocus giver inputfokus til et kontrolelement. Brugerens tastanslag modtages derefter af det pågældende kontrolelement, så de kan skrives i et kontrolelement til tekstinput, eller bruge Enter-tasten til at vælge en knap. Brugeren kan også bruge tabulator-tasten, berøring, musen eller en anden bevægelse for at flytte selve inputfokus. Tab-tastens funktionsmåde styres af TabIndex-egenskaben.

Brug funktionen SetFocus til at indstille fokus til (hvert med et eksempel nedenfor):

  • et nyligt eksponeret eller aktiveret inputkontrolelement, der skal hjælpe brugeren i det, der kommer, og for at opnå hurtigere dataindtastning.
  • en formular valideres for at fokusere og vise det ugyldige inputkontrolelement til hurtig løsning.
  • der vises et skærmbillede for at fokusere på det første inputkontrol element med egenskaben OnVisible på skærmen.

Det kontrolelement, der har fokus, kan være visuelt anderledes baseret på egenskaberne FocusedBorderColor og FocusedBorderThickness.

Begrænsninger

SetFocus kan kun bruges med:

Du kan ikke indstille fokus til kontrolelementer, der findes i et Gallery-kontrolelement, Edit form-kontrolelement eller Component. SetFocus kan bruges sammen med et kontrolelement på en skærm med rullefelter.

Du kan ikke angive fokus til kontrolelementer, der findes i et kontrolelement af typen Container.

Du kan kun indstille fokus til kontrolelementer på samme skærmbillede som den formel, der indeholder kaldet SetFocus.

Forsøg på at indstille fokus til et kontrolelement, der har egenskaben DisplayMode indstillet til Deaktiveret, har ingen effekt. Fokus vil fortsat være det sted, hvor det tidligere var.

På Apple iOS vises skærmtastaturet kun automatisk, hvis SetFocus er startet med en direkte brugerhandling. Hvis du f.eks. starter fra en knaps OnSelect-egenskab, vises skærmtastaturet, mens det ikke vises, hvis du starter fra en skærms OnVisible.

Du kan kun bruge SetFocus i funktionsformler.

Syntaks

SetFocus( Control )

  • Control – påkrævet. Det objekt, der skal give inputfokus.

Eksempler

Fokuser på et nyligt afsløret eller aktiveret inputkontrolelement

Mange indkøbskurve gør det muligt for kunden at bruge leveringsadressen som faktureringsadresse, hvilket er med til at lette behovet for at angive de samme oplysninger to gange. Hvis du ønsker en anden faktureringsadresse, aktiveres tekstinputfelterne for faktureringsadressen, og det er en god ide at vejlede kunden om disse netop aktiverede kontrolelementer for at opnå hurtigere dataindtastning.

Animation, som viser, hvordan du vælger at bruge en brugerdefineret faktureringsadresse med fokus flyttet til inputkontrolelementet til faktureringsnavnet som følge af, at den automatiske synkronisering med forsendelsesadresserne er slået fra.

Der er mange formler i spil her, men den, der flytter fokus, er på egenskaben OnUncheck for Check box-kontrolelementet:

SetFocus( BillingName )

Tabulatortasten kan også bruges til hurtigt at flytte fokus fra et felt til et andet. Tabulatortasten blev dog ikke brugt i animation.

Sådan oprettes dette eksempel:

  1. Opret en ny app.
  2. Tilføj Label-kontrolelementer med teksten "Leveringsadresse", "Navn:", "Adresse:", "Faktureringsadresse", "Navn:" og "Adresse:", og placer dem som vist i animationen.
  3. Tilføj et Text Input-kontrolelement, og omdøb det til ShippingName.
  4. Tilføj et Text Input-kontrolelement, og omdøb det til ShippingAddress.
  5. Tilføj et Check box-kontrolelementet, og omdøb det SyncAddresses.
  6. Indstil egenskaben Text af dette kontrolelement til formlen "Use Shipping address as Billing address".
  7. Tilføj et Text Input-kontrolelement, og omdøb det til BillingName.
  8. Indstil egenskaben Default af dette kontrolelement til formlen ShippingName.
  9. Indstil egenskaben DisplayMode af dette kontrolelement til formlen If( SyncAddresses.Value, DisplayMode.View, DisplayMode.Edit ). Det aktiverer eller deaktiverer automatisk dette kontrolelement baseret på afkrydsningsfeltets tilstand.
  10. Tilføj et Text Input-kontrolelement, og omdøb det til BillingAddress.
  11. Indstil egenskaben Default af dette kontrolelement til formlen ShippingAddress.
  12. Indstil egenskaben DisplayMode af dette kontrolelement til formlen If( SyncAddresses.Value, DisplayMode.View, DisplayMode.Edit ). Det aktiverer eller deaktiverer automatisk dette kontrolelement baseret på afkrydsningsfeltets tilstand.
  13. Indstil egenskaben Default af afkrydsningsfeltet til formlen true. Faktureringsadressen vil som standard bruge den samme værdi som leveringsadressen.
  14. Indstil egenskaben OnCheck af afkrydsningsfeltet til formlen Reset( BillingName ); Reset( BillingAddress ). Hvis brugeren vælger at synkronisere forsendelses- og faktureringsadresser, ryddes alle brugerinput i felter med faktureringsadresser, der gør det muligt for egenskaberne Default for hver enkelt at trække værdierne fra de tilsvarende leveringsadressefelter.
  15. Indstil egenskaben OnUncheck af afkrydsningsfeltet til formlen SetFocus( BillingName ). Hvis brugeren vælger at have en anden faktureringsadresse, flytter dette fokus til det første kontrolelement i faktureringsadressen. Kontrolelementerne vil allerede være aktiveret pga. deres DisplayMode-egenskaber.

Fokus på valideringsproblemer

Bemærk

Selvom eksemplet tilsyneladende er et Edit form-kontrolelement, understøttes SetFocus desværre endnu ikke af det kontrolelement. I stedet bruger dette eksempel en skærm med rullefelter til inputobjekterne.

Når du validerer en formular, kan det være en god hjælp, ikke blot at få vist en meddelelse, hvis der er problemer, men til også at føre brugeren til det felt, der er fejlbehæftet. Det kan især være nyttigt, hvis det pågældende felt er rullet væk fra skærmen og ikke er synligt.

En animation, som viser, hvordan du validerer en dataindtastningsformular, og hvor der ikke kun vises en meddelelse, men også indstiller inputfokus på det ugyldige inputkontrolelement, selvom det er rullet væk fra skærmen.

I denne animation trykkes der på valideringsknappen flere gange, indtil alle felterne er udfyldt korrekt. Bemærk, at musemarkøren ikke flyttes ned fra toppen af skærmen. I stedet har funktionen SetFocus flyttet inputfokus til det kontrolelement, der kræver opmærksomhed med denne formel:

If( IsBlank( Name ),
        Notify( "Name requires a value", Error ); SetFocus( Name ),
    IsBlank( Street1 ),
        Notify( "Street Address 1 requires a value", Error ); SetFocus( Street1 ),
    IsBlank( Street2 ),
        Notify( "Street Address 2 requires a value", Error ); SetFocus( Street2 ),
    IsBlank( City ),
        Notify( "City requires a value", Error ); SetFocus( City ),
    IsBlank( County ),
        Notify( "County requires a value", Error ); SetFocus( County ),
    IsBlank( StateProvince ),
        Notify( "State or Province requires a value", Error ); SetFocus( StateProvince ),
    IsBlank( PostalCode ),
        Notify( "Postal Code requires a value", Error ); SetFocus( PostalCode ),
    IsBlank( Phone ),
        Notify( "Contact Phone requires a value", Error ); SetFocus( Phone ),
    Notify( "Form is Complete", Success )
)

Sådan oprettes dette eksempel:

  1. Opret en ny, tom telefonapp.
  2. Vælg Nyt skærmbillede på menuen Indsæt, og vælg derefter Skærm, man kan rulle på.
  3. Tilføj Text input-kontrolelementer i midten af skærmbilledet, og navngiv dem Name, Street1, Street2, City, County, StateProvince, PostalCode og Phone. Tilføj Label-kontrolelementer over hver enkelt for at identificere felterne. Du skal måske ændre størrelsen på sektionen, hvis den ikke er lang nok til at kunne rumme alle kontrolelementerne.
  4. Tilføj et Icon-fluebenskontrolelement øverst på skærmbilledet over den sektion, der kan rulles i.
  5. Indstil egenskaben OnSelect af ikonkontrolelementet til formlen If( IsBlank( ..., som er angivet ovenfor.

Fokus, når der vises et skærmbillede

Bemærk

Selvom eksemplet tilsyneladende er et Edit form-kontrolelement, understøttes SetFocus desværre endnu ikke af det kontrolelement. I stedet bruger dette eksempel en skærm med rullefelter til inputobjekterne.

På samme måde som når du eksponerer et inputkontrolelement, er det en god idé at fokusere på det første inputkontrolelement for at opnå hurtigere dataindtastning.

En animation, der viser en side om side-sammenligning i brug af SetFocus i stedet for at bruge den, når der vises en skærm til dataindtastning.

I denne animation bruger dataindtastningsskærmen til venstre ikke SetFocus. Ved visning har intet inputkontrolelement fokus, hvilket kræver, at brugeren bruger tabulator, berøring, mus eller en anden metode til at fokusere på feltet Navn, før der kan skrives en værdi i det.

Til højre har vi nøjagtigt den samme app med egenskaben OnVisible for dataindtastningsskærm indstillet til denne formel:

SetFocus( Name )

Det indstiller automatisk fokus på feltet Navn. Brugeren kan straks begynde at skrive og flytte mellem felter uden at skulle foretage sig noget.

Sådan oprettes dette eksempel:

  1. Opret appen "Fokus på valideringsproblemer" ovenfor.
  2. Indstil egenskaben OnVisible af formlen SetFocus( Name ) på dette skærmbillede.
  3. Tilføj endnu en skærm.
  4. Tilføj et Button-kontrolelement.
  5. Indstil OnSelect-egenskaben af dette kontrolelement til formlen Navigate( Screen1 ).
  6. Vis appen fra dette skærmbillede. Tryk på knappen. Formlen OnVisible evalueres, og der fokuseres automatisk på feltet Navn.