Delen via


Moderne thema's gebruiken in canvas-apps (preview)

[Dit artikel maakt deel uit van de voorlopige documentatie en kan nog veranderen.]

Moderne thema's, die vooraf vastgestelde stijlensets zijn, kunnen het uiterlijk van uw app veranderen. Deze thema's, gebaseerd op de Fluent-ontwerptaal van Microsoft, wijzigen verschillende stijlaspecten, zoals kleur, typografie, randen en schaduwen, waardoor een visueel aantrekkelijke en consistente interface wordt gegarandeerd. Moderne thema's stroomlijnen het aanpassingsproces, waardoor makers moeiteloos een app kunnen ontwerpen met een uniforme en consistente visuele aantrekkingskracht.

Belangrijk

  • Dit is een preview-functie.
  • Preview-functies zijn niet bedoeld voor productiegebruik en bieden mogelijk beperkte functionaliteit. Deze functies zijn beschikbaar vóór een officiële release zodat klanten vroeg toegang kunnen krijgen en feedback kunnen geven.

Vereisten

Om moderne thema's te gebruiken, moet u deze inschakelen. Zie voor meer informatie Moderne bedieningselementen en thema's inschakelen voor uw app.

Notitie

Wanneer moderne bedieningselementen en thema's zijn ingeschakeld, kunt u geen klassieke thema's selecteren via de opdrachtbalk. Als u buiten gebruik gestelde klassieke thema's wilt gebruiken, moet u de buiten gebruikgestelde app-instelling Klassieke thema's aanhouden inschakelen.

Een thema maken

Er zijn verschillende kant-en-klare thema's beschikbaar om uw app te stylen. U kunt ook uw eigen thema ontwerpen voor een persoonlijkere visuele esthetiek.

  1. Selecteer > Thema's-pictogram Thema's in het app-creatiemenu.
  2. Selecteer in het deelvenster Thema's Een thema toevoegen.
  3. Voer in het dialoogvenster Een thema maken de volgende informatie in:
    • Themanaam: de themanaam moet uniek zijn.
    • Lettertype: kies het standaardlettertype dat de besturingselementen in de app gebruiken wanneer het thema wordt toegepast.
    • Beginkleur: selecteer de kleur waarop u uw thema wilt baseren, of voer handmatig de hexadecimale of RGB-weergave van de kleur in. Het systeem genereert een palet met 16 vakken dat is geoptimaliseerd voor toegankelijkheid.
    • Tint/levendigheid: Pas het generatiepalet aan, vooral de lichtere kleuren, met Hue en Levendigheid schuifregelaars. De Hue is van invloed op de kleurtint, en levendigheid is van invloed op de stilte of helderheid van het palet.
  4. Bekijk optioneel het statische voorbeeld van uw nieuwe thema. U kunt met de voorbeeldbesturingselementen werken om te zien hoe uw thema wordt toegepast op de ruststatus en verschillende interactiestatussen.
  5. Selecteer Maken.

Uw nieuwe thema wordt gemaakt en toegepast op uw app.

Moderne thema's toepassen

  1. Selecteer > Thema's-pictogram Thema's in het app-creatiemenu.
  2. Selecteer in het deelvenster Thema's een van de standaardthema's.

Wanneer een modern thema wordt geselecteerd, wordt de stijl van het thema automatisch toegepast op de bedieningselementen in uw app. Deze actie stelt de eigenschap App.Theme in.

Notitie

Moderne thema's hebben nu invloed op klassieke besturingselementen door eigenschappen in te stellen voor de klassieke besturingselementen met Power Fx-formules die verwijzen naar variabelen uit het moderne thema.

Een thema bewerken

U kunt het thema bewerken en een of meer parameters van het aangepaste thema wijzigen.

  1. Selecteer > Thema's-pictogram Thema's in het app-creatiemenu.
  2. Zoek in het deelvenster Thema's de tegel die overeenkomt met het thema dat u wilt bewerken en selecteer Opties > Bewerken.
  3. Pas in het deelvenster Thema bewerken het thema indien nodig aan.

Notitie

U kunt kant-en-klare thema's niet bewerken.

Een thema verwijderen

Als u besluit dat u een aangepast thema in uw app niet langer nodig heeft, kunt u het verwijderen.

  1. Selecteer > Thema's-pictogram Thema's in het app-creatiemenu.
  2. Zoek in het deelvenster Thema's het thema dat u wilt bewerken en selecteer vervolgens (...) Opties > Verwijderen.
  3. Selecteer Thema verwijderen in het bevestigingsvenster.

Als u Power Fx-formules in uw app heeft die naar dit thema verwijzen, moet u de formules handmatig bijwerken.

Notitie

U kunt kant-en-klare thema's niet verwijderen.

Thema's gebruiken met Power Fx

Moderne thema-objecten zijn beschikbaar voor makers voor gebruik via Power Fx. Er kan naar het momenteel actieve thema-object worden verwezen door App.Theme, en naar elk thema dat in de app is geladen, kan worden verwezen naar de instantienaam, bijvoorbeeld RedTheme. We raden u aan naar het thema-object te verwijzen met App.Theme om ervoor te zorgen dat de kleurselecties zich aanpassen aan themawijzigingen.

Elk thema-object bevat de volgende informatie:

  • Name: de naam van het thema.
  • Colors: een verzameling van de 16 kleuren waaruit het merk voor het thema bestaat. Elke kleur in dit verloop is afzonderlijk toegankelijk op naam.

De afbeelding toont de vakvariabelen in de collectie Kleuren en, als voorbeeld, de overeenkomstige kleuren voor het thema Staal.

Moderne besturingselementen inschakelen

Met behulp van het verloop van het themamerk kunt u een klassiek besturingselement handmatig stylen op basis van het huidige moderne thema, zoals Button.Fill = App.Theme.Colors.Primary.

Notitie

Zie voor het geven van feedback: Uw feedback geven aan Microsoft.

Zie ook

Blogpost moderne bedieningselementen