Pielāgotas lapas noformēšana modeļa vadītai programmai

Raksts
03/14/2023

Šajā rakstā sniegti padomi par pielāgotas lapas noformēšanu lietošanai modeļa vadītā programmā.

Svarīgi

Pielāgotas lapas ir jauns līdzeklis ar nozīmīgām produktu izmaiņām, un pašlaik pielāgotās lapas zināmajām problēmām ir norādīti vairāki ierobežojumi.

Atbalstītās vadīklas pielāgotā lapā

Pielāgota lapu autorēšana pašlaik atbalsta pamatnes programmas vadīklu apakškopu. Nākamajā tabulā tiek uzskaitītas patlaban atbalstītās vadīklas.

Ctrl	Vadīklas tips	Piezīmes
Etiķete¹	Parādīt
Tekstlodziņš¹	Ievadīt
Datuma atlasītājs¹	Ievadīt
Poga¹	Ievadīt
Combo Box¹	Ievadīt
Izvēles rūtiņa¹	Ievadīt
Pārslēgs¹	Ievadīt
Radio grupa¹	Ievadīt
Slīdnis¹	Ievadīt
Novērtējums¹	Ievadīt
Vertikālais konteiners	Izkārtojums	Jauns interaktīvs horizontāla izkārtojuma konteiners
Horizontālais konteiners	Izkārtojums	Jauns interaktīvs horizontāla izkārtojuma konteiners
Bagātinātā teksta redaktors	Ievadīt
Galerija	Saraksts
Icon	Plašsaziņas līdzekļi
Image	Plašsaziņas līdzekļi
Rediģēšanas veidlapa	Ievadīt
Parādāmā veidlapa	Ievadīt
Koda komponenti	Pielāgošana	Koda komponentu pievienošana pielāgotai lapai
Pamatnes komponenti (priekšskatījums)	Pielāgošana	Pamatnes komponentu pievienošana pielāgotai lapai

¹ Vadīkla ir jauna moderna vadīkla. Šī vadīkla tika ieviesta pamatnes programmām pakalpojumā Teams. Vadīkla tiek pamatota uz Plūstošu lietotāja interfeisa bibliotēku, kas , kas ir kopā ar Power Apps Component Framework.

Pielāgotu komponentu atbalsts pielāgotai lapai

Varat videi pievienot gan zema koda (pamatnes komponentus), gan koda (koda komponentus) pielāgotos UX komponentus un padarīt tos pieejamus visiem veidotājiem. Pielāgotu lapu specifiskiem UX paplašināmības rakstiem skatiet rakstu pamatnes komponentu pievienošana pielāgotai jūsu modeļa vadītās programmas lapai un koda komponentu pievienošana pielāgotai lapai jūsu modeļa vadītajai programmai.

Parasti paplašināmības pieeja ar zemo kodu ir vienkāršāk būvēt, testēt un tai ir mazākas uzturēšanas izmaksas. Vispirms ir ieteicams novērtēt pamatnes komponentus un koda komponentus izmantot tikai tad, ja ir nepieciešama sarežģītāka un progresīvāka pielāgošana.

Papildinformācija:

Iespējot interatīvu izkārtojumu, izmantojot konteinera vadīklu

Interarhiski pielāgoti lapu izkārtojumi tiek definēti, veidojot Horizontālo izkārtojuma konteineru un Vertikāla izkārtojuma konteineru vadīklu hierarhiju. Šīs vadīklas ir atrodamas pamatnes programmu noformētājā, kas atrodas cilnes Ievietošana sadaļā Izkārtojums.

Iestatiet minimālo ekrāna augstumu un platumu Programmas objektam, lai novērstu lapas līmeņa ritināšanas joslas un izmantotu vertikālu pamatteksta ritināšanas joslu.

MinScreenHeight=200
MinScreenWidth=200

Ja vēlaties, pielāgoto lapas noformējuma lielumu var pielāgot sadaļā Iestatījumi > Attēlojums ar Lielumu, kas iestatīts kā Pielāgots. Pēc tam iestatiet Platumu un Augstumu, lai pielāgotu galddatora lapas lielumu, piemēram, platumu 1080 un augstumu 768. Mainot šo iestatījumu pēc vadīklu pievienošanas ekrānam, var tikt atiestatīti daži izkārtojuma rekvizīti.

Iestatiet augšējo konteineri, lai aizpildītu visu vietu un mainītu lielumu, ņemot vērā pieejamo vietu.

X=0
Y=0
Width=Parent.Width
Height=Parent.Height

Elastīga augstuma konteinera horizontāla aplaušana

Lai atbalstītu lapas, kas no galddatora pielāgojas līdz šauram platumam, iespējojiet šīs īpašības horizontālam konteineram ar elastīgu augstumu. Bez šiem iestatījumiem lapa nogriezīs vadīklas, kad lapa būs sašaurināta.

Direction=Horizontal
FlexibleHeight=true
Justify=Stretch
Align=Stretch
VerticalOverflow=Scroll
Wrap=True

Pakārtotajiem konteineriem vai vadīklām tieši zem šī konteinera jābūt iestatītam minimālajam platumam, kas ļauj lapu piemērot 300 pikseļu platumam. Ņemiet vērā konteinera vai vadīklas papildinājumu, kā arī primārajos konteineros.

Elastīga platuma konteinera vertikāla aplaušana

Lai atbalstītu lapas, kas no galddatora pielāgojas līdz šauram platumam, iespējojiet šīs īpašības vertikālam konteineram ar elastīgu platumu. Bez šiem iestatījumiem lapa nogriezīs vadīklas, kad lapa būs sašaurināta.

Direction=Vertical
FlexibleWidth=true
Justify=Stretch
Align=Stretch
HorizontalOverflow=Scroll
Wrap=True

Pakārtotajiem konteineriem vai vadīklām tieši zem šī konteineriem jābūt iestatītam minimālajam augstumam, kas ļauj piemērot lapu 300 pikseļu platumam. Ņemiet vērā konteinera vai vadīklas papildinājumu, kā arī primārajos konteineros.

Papildinformācija: Interatīva izkārtojuma izveide.

Vertikāls konteiners ar fiksētu galveni, elastīgs pamatteksts, fiksēta kājene

Vertikālajā konteinerā iestatiet Līdzināt (horizontāli) uz Izstiept
Ievietot trīs Horizontālu konteineru vadīklas primārajā Vertikālajā konteinerā
Pirmajā un trešajā pakārtotā horizontālajā konteinerā atspējojiet Izstiepšanas augstumu un samaziniet augstumu līdz nepieciešamajai vietai, piemēram, Height=80.

Horizontālais konteiners ar diviem vienlīdzīgi pakārtotiem atvasinātajiem konteineriem

Primārajā vertikālajā konteinerā iestatiet Līdzināt (vertikāli) uz Izstiept.
Ievietot trīs Vertikālu konteineru vadīklas primārajā Horizontālajā konteinerā.

Pielāgotu lapas vadīklu stils, lai pielāgotos modeļa vadīto programmu vadīklām

Izveidojot pielāgotu lapu no modernā programmu noformētāja, šie līdzekļi izmanto noklusējuma vērtības.

Pielāgotās lapas dizains. Pielāgotā lapā lietoto vadīklu dizaina vērtības tiek automātiski iestatītas atbilstoši pielāgotās lapas noklusējuma zilajam vienotā interfeisa dizainam. Šis noklusējuma dizains tiek lietots gan studio, gan lietojumprogrammas izpildlaikā. Izteikta dizaina atlase tiek noņemta no pielāgotas lapu autorēšanas pieredzes.
Vadīklām ir jāizmanto atšķirīgs fonta lielums, kas ir balstīts uz to pozīciju lapu hierarhijā.

Piezīme

Pielāgots lapas teksts ir pārstātināts uz 1,33, tādēļ, lai iegūtu nepieciešamo lielumu, jums mērķa FontSize ir jāsamazina par 1,33.

Etiķetes tips Mērķa fontSize Izmantojamais FontSize

Lapas virsraksts 17 12.75

Parastas etiķetes 14 10.52

Nelielas etiķetes 12 9.02

Etiķetes tips	Mērķa fontSize	Izmantojamais FontSize
Lapas virsraksts	17	12.75
Parastas etiķetes	14	10.52
Nelielas etiķetes	12	9.02

Primārajām un sekundārajām pogu vadīklām ir nepieciešamas šādas stila izmaiņas:

Primārās pogas

Color=RGBA(255, 255, 255, 1)
Fill=RGBA(41,114,182,1)
Height=35
FontWeight=Normal

Sekundārās pogas

Color=RGBA(41,114,182,1)
Fill=RGBA(255, 255, 255, 1)
BorderColor=RGBA(41,114,182,1)
Height=35
FontWeight=Normal

Pielāgotas lapas seko tam pašam ciļņu navigācijas dizainam, ko izmanto viesošanas modeļa vadītā programma. Vizuāli izlīdzināta semantiskā HTML struktūra palīdz lietotājiem netraucēti pārvietoties pa pielāgotajām lapām, izmantojot tastatūru vai ekrāna lasītāju. Ņemiet vērā, ka atšķirībā no savrupām pamatnes programmām, pielāgotām lapu vadīklām un citiem UX elementiem nav nepieciešama izteikta ciļņu numuru piešķiršana. Modernām vadīklām nav TabIndex rekvizīta, un tās navigācijai izmanto semantisku HTML struktūru.

Dažādus elementus, piemēram, vadīklas, pamatnes un koda komponentus, konteineri un tā tālāk, var tabulēšanas taustiņus atkarībā no to pozīcijas pielāgotajā lapas izkārtojumā. Ciļņu navigācija seko secības navigācijai pēc numuru secības. Atsevišķas tabulēšanas stopiņas lielās grupēšanas elementos, piemēram, komponentos, vispirms tiek naviģēti konteineri, pirms šī cilne tiek pārvietota uz nākamo elementu dokumentu objektu modeļa (DOM) kokā.

Šeit ir piemērs navigācijai ar lapu, kurā ir vadīklas, kods, pamatnes komponenti un konteineri.

Piezīme

Pielāgotas lapas vadīklām un elementiem, kas pārklājas, nebūs sapludināti to DOM, tāpēc ciļņu pieturu sinhronizācija no vizuālā izkārtojuma var nebūt sinhronizēta. Tā arī notiek dinamisko elementu novietošanai, izmantojot formulas.