Kysymys:
Onko mitään työkalua, joka tarjoaa html: n (ja css) suunnittelun Androidin suhteellisen asettelulogiikan avulla?
George Pligor
2015-04-17 01:56:15 UTC
view on stackexchange narkive permalink

Olen tottunut suunnittelemaan asettelun Android -käyttöjärjestelmässä käyttämällä enimmäkseen Suhteellista asettelua , joka tarjoaa kaikenlaisia ​​ intuitiivisia tapoja suunnitella. Esimerkiksi:

  • Aseta elementin leveys dynaamisesti yksinkertaisesti ilmoittamalla, että haluat sen tämän elementin vasemmalle puolelle ja jonkin muun elementin oikealle puolelle
  • Kohdistusasetukset sijoittaa kohde mihin tahansa haluamaasi ruutuun toisen objektin alapuolella, yläpuolella, vasemmalla tai oikealla puolella
  • Asetteluvaihtoehdot on erotettu tiukasti vaihtoehdoista, joilla voit muuttaa näkymää sisäpuolella ja kaunistaa sitä haluamallasi tavalla

... ja monia muita

Tämä tapa suunnitella asettelu koodin mukaan näyttää paljon luonnollisemmalta .

Tiedän, että DOM toimii hyvin eri tavalla ja sinun on käärittävä kaikki, eikä esineistä, jotka ottavat haltuunsa joitain kiinteistöjä ruudulla, ei ole mitään järkeä. Mikä tahansa div voi pudota minkä tahansa muun divin päälle kunnioittamatta naapureitaan.

Onko siellä työkaluja, jotka todennäköisesti luovat jonkin javascript-taikuuden avulla, jotka voisivat asettaa / luoda HTML-asettelu yksinkertaisemmalla ja järkevämmällä merkinnällä?

WYSIWYG-työkalut eivät ole hyviä työhön, koska minulla olisi silti oltava tämä "kieli" , joka kuvaa HTML-asettelua tallennettavan sivun ajon aikana. Tämä johtuu siitä, että haluat pyytää animaatiota, sanokaamme käännös x = 50: stä x = 70: een, ja haluat ylläpitää dynaamisesti tämän suhteellisen asettelun sääntöjä, jotta muut sivulla olevat objektit reagoivat vastaavasti .

Tietysti joku voi väittää, että tällainen työkalu olisi tehokkuudeltaan raskas prosessi, mutta älä ota sitä huomioon nyt

nöyrän mielestäni lopullinen tavoite on noudattaa suuntakäsittelyn periaatteita vuorovaikutussuunnittelussa, jollainen kuka tahansa haluaisi olla vuorovaikutuksessa koneen kanssa luodakseen (ainakin ) 2D-grafiikka. Vaikka HTML / css: n koodaus käsin vuonna 2015 kaikilla selaimen yhteensopimattomuuksilla, joita kenenkään on edelleen opittava, näyttää kaukana ihanteellisesta

Tiedän, että suosittu html / css-kehys toimii yleensä kankaalla, mikä on jotain näiden kahden lähestymistavan välissä.
@VicAche mitkä kehykset toimivat näin?
Esimerkiksi Susy
Voisitko lähettää linkin tähän Susy-kehykseen? Voin löytää vain Susy css -kehyksen, joka ei tunnu liittyvän html5-kankaaseen, kuten mainitsit. Kiitos! :)
Todennäköisesti sama susy, josta puhumme.
http://susydocs.oddbird.net/en/latest/toolkit/#span-mixin
Joten miten asettelu toimii HTML5: ssä? Odotan sen olevan kielellä. Sen ei pitäisi olla työkalu. Jos jätät työkalun osan pois, tämä on hieno SO-kysymys.
üks vastaus:
Gaurav Ramanan
2016-03-24 16:52:31 UTC
view on stackexchange narkive permalink

Etsit GSS - Ruudukon tyylitaulukoita

Se käyttää rajoitteen ratkaisijaa elementtien asetteluun asettamiesi sääntöjen mukaisesti (ilmoitettu nimellä rajoitukset kuten Androidin RelativeLayoutissa)

Asiakirjoista:

GSS on CSS-esiprosessori & JS: n ajonaika, joka valjastaa Cassowary.js: n, JS: n. saman rajoitteen ratkaisualgoritmin portti, jota Apple käyttää Cocoa Autolayout for iOS & OS X -käyttöjärjestelmässä. GSS & Cassowary perustuu "rajoitusohjelmointiin" - paradigmaan, jossa kehittäjät keskittyvät ilmoittamaan "mitä" ja luottamaan matemaattiseen ratkaisijaan selvittääkseen "Miten". Perinteisemmällä olio-ohjelmoinnilla kehittäjät keskittyvät enemmän "miten" -ohjelmaan. Tämä tekee Rajoitus-ohjelmoinnista luonnollisen sopivan deklaratiivisille kielille, kuten CSS: lle.

GSS täyttää asettelukielet vaihtoehtoisesta CSS-tulevaisuudesta; mukaan lukien Greg Badrosin Constraint CSS (CCSS) ja Applen Visual Format Language (VFL). GSS tasaa CSS: n suhteellisella paikannuksella &-mitoituksella ja todellisella lähdeluettelon riippumattomuudella - mikä tarkoittaa, että kehittäjät voivat keskittää minkä tahansa elementin mihin tahansa toiseen yksilinjalla: #any [center] == #anyother [center]; Puomi!



Tämä Q & A käännettiin automaattisesti englanniksi.Alkuperäinen sisältö on saatavilla stackexchange-palvelussa, jota kiitämme cc by-sa 3.0-lisenssistä, jolla sitä jaetaan.
Loading...