Kaamerate taga :)

Kohanduvad tekstielemendid visandis

Magus!

Värskendus: eile teatas Sketchi meeskond, et üks nende kõige nõutumaid funktsioone on saadaval rakenduse beetaversioonis.
Nad kutsuvad seda “nutikaks paigutuseks” ja see näeb välja A M A Z I N G.
See tähendab ka seda, et selle postituse meetod vananeb (lõpuks!).

Mõned näited veebist võimalike võimaluste kohta:
twitter.com/mds/status/1167145339457069062
twitter.com/svorklab/status/1167350673857482752
twitter.com/gaddafirusli/status/1167157688867835904

Minge ja vaadake seda> www.sketch.com/beta

See postitus arvati esmakordselt 19. augustil 2016, kuid ei näinud kunagi päevavalgust (laiskuse / edasilükkamise tõttu / te nimetate seda). Aja möödudes märkasin, et inimesed räägivad (ja kirjutavad isegi keskmisi postitusi) käitumisest, millest räägin. Nii otsustasin mustandi redigeerimise lõpule viia ja selle avaldada. Yay minu jaoks …

Kõik algas lihtsast küsimusest ...

Mõni aeg tagasi puutusin kokku väikese, kuid tüütu probleemiga, mis on mind sellest ajast peale vaevanud. Kujundasin ühe oma kliendi jaoks armatuurlaua liidese ja selles oli see üsna tavaline ui komponent; See näitas konkreetse kasutaja kohta teavet koos selliste elementidega nagu: avatari pilt, avaldamise päev ja ajatempel. See nägi välja umbes selline:

Kui ma segasin ui, muutes komponendi pikkust erinevatel aegadel, mõtlesin, kas on lihtsam moodus sisu, polstri ja kogu komponendi pikkuse muutmiseks, ilma et oleks vaja iga elementi ikka ja jälle muuta.

Suuruse muutmise funktsioon aitas natuke, kui mul oli vaja rea ​​pikkust muuta. Selle hämmastava funktsiooni kohta on palju õpetusi ja postitusi, nagu see või see, mida soovitan lugeda, kui te seda veel teinud pole.

See, mida ma tõesti tahtsin saavutada, oli dünaamiline tekstielement, mis surub üksteist, kui nende suurus muutub. Näiteks kui kasutan pistikprogrammi nagu Craft by InVision (või mõnda muud pistikprogrammi, mis automaatselt andmeid täidab), surub kasutajanime element kuupäevaelemendi enda kõrvale ja nii edasi, nagu päris töötava toote puhul.

Arutledes sarnase teema üle Eran Lahaviga (minu kolleeg, kes on ka vinge disainer ), otsustasin kui kunagi varem leida probleemile lahenduse. Meenus, et lugesin artiklit võimalusest luua dünaamilisi tabeleid uue suuruse muutmise funktsiooniga (tutvustatud versioonis 39). Reony Tonneyck tegi seda peidetud graafiliste elementide abil, mida kasutati laua sisu polsterdamiseks. See andis mulle idee panna peidetud graafiline element kahe tekstiobjekti vahele. Ja arva ära mis?

See kuradi töötas!
Nii et ma järgisin tegelikult Reyoni meetodit dünaamilise rea loomiseks, kuid kui ma faili Eranile saatsin, ütles ta mulle, et see töötab mis tahes suuruse muutmise võimalusega, mille valite elementide jaoks.

See üllatas mind, sest olin kindel, et selline käitumine on seotud suuruse muutmise funktsiooniga. Pärast kaevamist ametlikus visandidokumentatsioonis sain teada, et see on sümbolitega seotud käitumine, mis alistab funktsiooni:

Ja see on selle funktsiooni algne postitus:

Asi on selles, et nad kasutasid tekstiobjekti kõrval graafilist objekti, mitte kahte tekstiobjekti üksteise kõrval. Ja kui ma seda meetodit ainult tekstiobjektidega proovisin, ei töötanud see ...

Pärast hunnikut testi, mille Eran ja mina tegin, oleme üsna kindlad, et kui kasutada mitme tekstiobjektiga sümboleid üksteise kõrval koos nende vahel olevate graafiliste objektidega, on graafiline käitumine nagu “eestkostja”, mis hoiab tekstiobjekte igaühte puudutamast muu (vt värskendust allpool).

Värskendus:
Näib, et see funktsioon töötab endiselt versioonis 44. Ma sain ka aru, et kui kahe kõrvuti asuva tekstielemendi vaheline kaugus on 20 pikslit või väiksem, töötab automaatne suuruse muutmine. Kui vahemaa on üle 20 piksli, hakkavad asjad lagunema. Ei ole “eestkostjaid” :)

Erani katsed

Nüüd on ülekirjutuste probleemiks see, et päris sisu pistikprogrammid (nagu Craft) ei tööta alati. Välja arvatud üks (niipalju kui mina tean - tänud Eranile): Sketch Data Populator hinnalise disainistuudio poolt. Pistikprogrammi kasutamisel mõjutab see algset sümbolisisaldust alistumise sektsiooni ja lahendab suurepäraselt ülitähtsate andmete probleemi.

EDIT: Ilmselt toetab Craft-pistikprogramm teksti alistamist, nii et vabandan eksituse pärast (kui augustis seda postitust kirjutama hakkasin, ei toetanud Craft teksti alistusi, seega ka viga)

Järeldus

See funktsioon on vaieldamatult üks ebainimlikemaid, mida ma Sketchis kohanud olen, kuid hei, see on siiski parem kui Illustrator.
Kokkuvõtteks võib öelda, et üks oluline asi, mida peaksite enne selle meetodi kasutamist kaaluma, on see, et kui proovite muuta põhikomponendi laiust või kõrgust, läheb kogu põrgu lahti.
Ma tean, et Anima Appi ägedad poisid töötavad selle nimel, et nende pistikprogramm toimiks sarnaselt, ja see muudab komponendi täielikult reageerima (kuigi täna proovides nende pluginaga minu meetodit, kukkus Sketch 30. jaanuaril).

Ma loodan, et see postitus aitas, see on minu esimene postitus ja selle ettevalmistamiseks ja kirja panemiseks kulus natuke aega. Imeilusat päeva .