Smart Tiles Ievads
Smart Tiles panelis nav fiksēts režģis. Elementi plūst rindās kā vārdi rindiņās: katrs elements atbilstoši savam iestatījumam Lielums pieprasa daļu rindas, rinda tiek aizpildīta no kreisās puses uz labo, un tas, kas neietilpst, sāk nākamo rindu. Šīs plūsmas izpratne ir tas, kas atšķir paneli, kurš nejauši labi izskatās vienā ekrānā, no paneļa, kurš izskatās pārdomāts katrā ekrānā. Šajā rakstā paskaidroti elementu lielumi, ievilkumi un augstums, kā arī sniegtas dažas izkārtojuma receptes.
Seši lielumi
Elementa lielums ir tā platums, izteikts kā rindas daļa. Izvēlieties to elementa kontekstizvēlnē: noklikšķiniet uz pogas …, norādiet uz Lielums un izvēlieties vienu no sešiem ierakstiem; pašreizējais lielums ir atzīmēts ar ķeksīti.
| Lielums | Rindas pamatdaļa | Elementu skaits rindā (vienāds lielums) |
|---|---|---|
| Īpaši mazs | 15 % | 6 |
| Mazs | 30 % | 3 |
| Vidējs | 45 % | 2 |
| Liela | 65 % | 1, ar vietu elementam «Mazs» vai «Īpaši mazs» blakus |
| Īpaši liels | 80 % | 1, ar vietu elementam «Īpaši mazs» blakus |
| Pilns platums | 100 % | 1 |
Jauna elementa lielums ir Mazs.
Kā tiek aizpildītas rindas
Ainu papildina divi noteikumi:
- Elementi izstiepjas, lai aizpildītu rindu. Tabulā norādītā daļa ir minimums. Ja rindā paliek brīva vieta — teiksim, rindā ir tikai divi elementi «Mazs» —, elementi izaug, lai to aizpildītu, turklāt lielāki lielumi aug ātrāk nekā mazāki. Tāpēc rindas vienmēr ir pilnas, bez robainas labās malas.
- Elements, kas neietilpst, pāriet uz nākamo rindu. Trīs elementi «Mazs» aizpilda rindu; ceturtais sāk jaunu. Elements «Vidējs» pēc diviem elementiem «Mazs» neietilpst atlikušajos 40 % un sāk jaunu rindu, kurā tas izstiepjas visā platumā, ja aiz tā nekā nav.
Otrais noteikums ir tas, kas pārsteidz: viens elements «Mazs» paneļa beigās tiks izstiepts līdz elementam «Pilns platums». Saskaitiet daļas katrā rindā — tām kopā jābūt aptuveni 90–100 % — vai noslēdziet paneli ar elementiem, kas precīzi aizpilda savu rindu.
📝 Piezīme
Daļas ir relatīvas pret tīmekļa daļas platumu, nevis ekrāna platumu. Divu kolonnu sadaļā tīmekļa daļa ir uz pusi šaurāka, tāpēc trīs elementi «Mazs» joprojām veido vienu rindu — katrs no tiem uz pusi šaurāks nekā pilna platuma sadaļā. Tālrunī, kur lapa ir viena šaura kolonna, elementi paliek tajās pašās rindās un vienkārši kļūst šaurāki.
Augstums
Elementa augstums netiek iestatīts tieši. Tas ir satura summa — ikona tās iestatījumā Ikonas izmērs, virsraksts tā iestatījumā Fonta lielums un apraksts, ja tas tiek rādīts, — plus Iekšējais ievilkums virs un zem satura. Visi elementi rindā ir vienādā augstumā — augstākā elementa augstumā.
Lai padarītu elementus augstākus, nepalielinot ikonu vai tekstu, palieliniet Iekšējais ievilkums; lai tie būtu gandrīz kvadrātiski, apvienojiet lielu iekšējo ievilkumu ar elementiem «Mazs» vai «Īpaši mazs».
Trīs ievilkumi
Rekvizītu rūts grupā Izskats ir trīs atstarpju iestatījumi, katrs no 0 līdz 30 pikseļiem:
| Iestatījums | Ko tas atstata |
|---|---|
| Iekšējais ievilkums | Virs un zem elementa satura — «iekšējā atstarpe». Tas nosaka elementu augstumu. |
| Ikonas atkāpe | Starp ikonu un virsrakstu. |
| Ārējais ievilkums | Starp blakus esošajiem elementiem horizontāli un vertikāli — «sprauga». Pie vērtības 0 elementi saskaras, un panelis kļūst par vienlaidu mozaīku; pie 10–16 elementi tiek uztverti kā atsevišķas kartītes. |
Izkārtojuma receptes
Ātro saišu josla. Seši elementi «Īpaši mazs», ārējais ievilkums 4, iekšējais ievilkums 8, virsraksti rādīti, apraksti paslēpti. Viena rinda kompaktu pogu zem sākumlapas galvenā attēla.
Nodaļas panelis. Elements «Pilns platums» kā paneļa virsraksts — ar fotoattēla fonu un nodaļas nosaukumu —, kam seko rindas ar trim elementiem «Mazs» ar nodaļas pakalpojumiem. Ārējais ievilkums 8.
Izceltais plus saraksts. Viens elements «Liela» ar fona attēlu un aprakstu un viens elements «Mazs» tam blakus; zemāk divas rindas ar trim elementiem «Mazs». Lielais elements pievērš uzmanību svarīgākajai saitei.
Mozaīka. Jaukti elementi «Īpaši mazs» un «Mazs» ar ārējo ievilkumu 0, visi izcēluma krāsās, tikai ikonas (virsraksti paslēpti). Vislabāk izskatās pilna platuma sadaļā saziņas vietnē.
💡 Padoms
Veidojiet paneli pilna platuma sadaļā, ja tas ir lapas galvenā navigācija; skatiet rakstu KB10042. Kā pievienot un konfigurēt Smart Tiles tīmekļa daļu. Par tekstiem uz elementiem skatiet rakstu KB10249. Virsrakstu un aprakstu rādīšana uz elementiem.
❗ Svarīgi
Pirms publicēšanas pārbaudiet paneli šaurā loga platumā — sašauriniet pārlūkprogrammas logu vai izmantojiet lapas mobilo priekšskatījumu. Gari virsraksti, kas ietilpst elementā «Pilns platums», elementā «Mazs» tiek nogriezti ar daudzpunkti; apraksts, ja tas neietilpst, tiek nogriezts tāpat.
Uzziniet vairāk par produktu: https://vitextra.com/lv/products/smart-tiles