Mai i te kete UI ki te punaha hoahoa

He wheako kiriata ipurangi a Ivy

I te timatanga o te tau 2017 i whakaaro tuatahi matou ki te hanga i a maatau ake punaha tuku hoahoa-ki-waehere, he maha nga korero kua korero mo tera, ko etahi kei te mahi. Heoi, tae noa ki tenei ra, he iti noa te mohio mo te wheako o te hanga i nga punaha hoahoa-whakawhitiwhiti, a, kaore ano kia kitea nga tohutao maamaa me te whakamatau e whakaatu ana i nga hangarau me nga tikanga mo te whakarereketanga o te tukanga o te whakatinanatanga hoahoa ki tetahi hua kua mahi. A ma nga "waahanga i roto i te waehere" he maha nga tikanga rereke.

I tenei wa, ka ruarua te kamupene i ana kaimahi i ia tau - he mea tika ki te whakarahi i te tari hoahoa me te arotau i nga tukanga o te hanga me te whakawhiti i nga whakatakotoranga mo te whanaketanga. Ka whakanuia e matou enei mea katoa ma te "zoo" o nga papaahi e tika ana kia tautokohia, ka whiwhi tatou i te ahua o te pandemonium Babylonia, kaore e taea te "mahi noa" me te whakaputa moni. Ko te whakawhanaketanga o nga papaaho he maha nga wa i haere whakarara, a ka taea te tuku i taua mahinga ki runga i nga papaaho rereke me te roa o etahi marama.


He huinga tahora motuhake mo ia turanga

I nga wa o mua, i timata matou ki nga raruraru ka awhina te punaha hoahoa ki te whakaoti me te whakatakoto i nga whakaritenga mo tana hoahoa. I tua atu i te hanga reo ataata whakakotahi, te whakanui ake i te tere o te whakatakotoranga me te whanaketanga, me te whakapai ake i te kounga o te hua katoa, he mea nui ki te whakakotahi i te hoahoa i te mea ka taea. He mea tika tenei kia taea ai te whakawhanaketanga o nga mahi i runga i o maatau papaaho katoa i te wa kotahi: Tukutuku, iOS, Android, Smart TV, tvOS, Android TV, Windows 10, xBox One, PS4, Roku - me te kore e mahi takitahi. Na i mahia e matou!

Hoahoa → raraunga

I te taenga mai o nga whakaaetanga taketake i waenga i nga hua me nga tari whanaketanga, ka noho matou ki te kowhiri i tetahi puranga hangarau me te mahi i nga korero mo te katoa o nga mahi - mai i te whakatakotoranga ki te tuku. Hei whakaaunoa i te tukanga o te whakawhiti i te hoahoa ki te whanaketanga, i tirotirohia e matou te kowhiringa ki te tarai i nga tawhā waahanga tika mai i nga konae Sketch me nga whakatakotoranga. I puta mai ko te kimi i nga waahanga waehere e hiahiatia ana me te tango i nga tawhā e hiahiatia ana he mahi uaua me te kino. Tuatahi, me tino tupato nga kaihoahoa ki te whakaingoa i nga paparanga katoa o te waehere puna, tuarua, ka mahi noa tenei mo nga waahanga ngawari noa iho, tuatoru, ko te whakawhirinaki ki te hangarau a tetahi atu me te hanganga waehere o te tahora Sketch taketake ka raru te heke mai o te katoa. kaupapa. I whakatau matou ki te whakarere i te aunoatanga i tenei waahi. Koinei te ahua o te tangata tuatahi i puta mai i roto i te roopu punaha hoahoa, ko tana whakaurunga ko nga whakatakotoranga hoahoa, ko te putanga ko nga raraunga e whakaatu ana i nga tawhā katoa o nga waahanga me te raupapa raupapa i runga i te tikanga hoahoa ngota.

Ko te mea anake e toe ana ko te waahi me te pehea te penapena i nga raraunga, me pehea te whakawhiti ki te whanaketanga me te whakamaori i te whanaketanga i runga i nga papaaho katoa e tautokohia ana e matou. Ka mutu te pouri o te ahiahi... Ko te hua o nga hui auau o te roopu mahi ko nga kaihoahoa me nga kaiarahi o nga roopu mai i ia papaaho ko te whakaaetanga mo enei e whai ake nei.

Ka wetewetehia e matou te tirohanga ki nga huānga ngota: momotuhi, tae, maramara, nuku, whakaawhiwhi, tohu, pikitia me te roanga mo nga pakiwaituhi. Na ka kohia e matou mai i enei paatene, whakaurunga, pouakataki, widget kaari peeke, me etahi atu. Ka tohua e matou nga ingoa kore-semantic ki nga momo o tetahi o nga taumata, engari mo nga tohu, hei tauira, nga ingoa o nga taone, nga ingoa o nga nymphs, Pokemoni, motuka. brands... Kotahi noa te tikanga - kaua e pau te rarangi i mua i te , me pehea te mutunga o nga momo - me haere te whakaaturanga! Kaore koe e kaha ki te kawe i nga tohu, kia kore ai koe e taapiri i te paatene waenga i waenga i te "iti" me te "waenganui," hei tauira.

Te reo matakite

I waihotia nga Kaihanga ki te whakaaro me pehea te penapena me te whakawhiti raraunga i runga i te huarahi e pai ana ki nga papaaho katoa, me te hoahoa ki te hoahoa i nga huānga atanga ka pai te ahua me te mahi pai puta noa i nga waka katoa o nga taputapu tautoko.

I mua, kua kaha taatau ki te "whakamatautau" i te nuinga o nga waahanga hoahoa i roto i te tono mo te Windows 10, i tera wa he waahi hou mo matou, ara, me whakaputa me te whakawhanaketanga "mai i te wahanga." Na roto i te tuhi, i taea e matou te whakarite me te whakamatautau i te nuinga o nga waahanga me te mohio ko wai o ratou e tika ana kia whakauruhia ki roto i te punaha hoahoa Eevee a meake nei. Ki te kore he pouaka kirikiri penei, ka taea anake te whiwhi i taua wheako ma te maha o nga whitiwhitinga i runga i nga papaahi kua mahi, a ka neke atu i te kotahi tau.

Ma te whakamahi ano i nga waahanga kotahi i runga i nga papaaho rereke ka whakaitihia te maha o nga whakatakotoranga me te huinga o nga raraunga o te punaha hoahoa, na te hoahoa me whakaoti tetahi atu raruraru, kaore i whakaahuahia i mua i roto i nga mahi o te hoahoa hua me te whanaketanga - me pehea, hei tauira, ka taea te whakamahi ano te paatene mo nga waea me nga papa ki runga pouaka whakaata? A me aha tatou ki te rahi o nga momotuhi me nga huānga kei runga i nga papaaho rereke?

E tika ana, i tika kia hoahoa i tetahi matiti whakawhiti-whakawhitinga hei whakarite i nga tuhinga me nga rahi huānga e hiahiatia ana e matou mo ia turanga motuhake. Hei timatanga mo te matiti, i whiriwhiria e matou te rahi me te maha o nga panui kiriata e hiahia ana matou ki te kite i runga i tetahi mata, a, i runga i tenei, i hangaia e matou he ture mo te hanga i nga pou matiti, mena he rite te whanui o te pou kotahi. ki te whanui o te panui.

Inaianei me kawe mai nga mata nui katoa kia rite te rahi o te tahora ka uru ki roto i te matiti noa. Ko te Apple TV me te Roku i hangaia i roto i te rahi o te 1920x1080, Android TV - 960x540, Smart TV, i runga i te kaihoko, he rite tonu, engari i etahi wa 1280x720. Ina tukuna te taupānga me te whakaatu ki runga i nga mata HD Katoa, ka whakareatia te 960 ki te 2, ka whakareatia te 1280 ki te 1,33, ko te 1920 te putanga penei.

Ko te peke i nga korero hoha, ka tae mai ki te whakatau ko nga mata katoa, tae atu ki nga pouaka whakaata, i runga i nga waahanga me o raatau rahi, ka hipokina e te whakatakotoranga hoahoa kotahi, a ko nga pouaka whakaata katoa he keehi motuhake o te raarangi whakawhiti-whakawhitinga whanui, e rima, e ono ranei nga pou, penei i te papa, papamahi ranei. Ko wai e hiahia ana ki nga korero, haere ki nga korero.

UI kotahi mo nga papaaho katoa

Inaianei, ki te tuhi i tetahi ahuatanga hou, kaore matou e hiahia ki te tuhi tahora mo ia turanga, me nga whiringa urutau mo ia waahanga. He nui ki te whakaatu i tetahi tahora me tona urutau mo nga papaaho katoa me nga taputapu o tetahi whanui: waea - 320-599, nga mea katoa - 600-1280.

Raraunga → whanaketanga

Ae ra, i te mea e pirangi ana matou ki te whakatutuki i tetahi hoahoa whakakotahi katoa, kei ia papaarangi ona ake ahuatanga motuhake. Ahakoa kei te whakamahi te paetukutuku me te Smart TV i te ReactJS + TypeScript stack, ka haere te taupānga Smart TV i runga i nga kiritaki WebKit me Presto tuku iho, na reira kaore e taea te tiri momo ki te paetukutuku. A ko nga panui imeera ka tino kaha ki te mahi me te whakatakotoranga ripanga. I te wa ano, kaore tetahi o nga papaapapa-kore-html e whakamahi ana, e whakamahere ana ranei ki te whakamahi i te React Native, i etahi o ana taarite ranei, e mataku ana ki te paheketanga o te mahi, i te mea he maha rawa o taatau whakatakotoranga ritenga, kohinga me te arorau whakahou uaua, whakaahua me nga ataata. No reira, ko te kaupapa noa o te tuku i nga momo CSS kua oti te hanga, i nga waahanga React ranei, kaore e pai ki a maatau. Na reira, i whakatau matou ki te tuku raraunga i roto i te whakatakotoranga JSON, e whakaahua ana i nga uara i roto i te puka whakapuakanga waitara.

Na rawa rounding: 8 Ka huri te taupānga Windows 10 ki CornerRadius="8", tukutuku - border-radius: 8px, Android - android:radius="8dp", iOS - self.layer.cornerRadius = 8.0.
Taonga offsetTop: 12 ka taea e te kiritaki tukutuku kotahi i roto i nga keehi rereke te whakamaori hei top, margin-top, padding-top ranei transform

Ko te whakapuakanga o te whakaahuatanga e kii ana mena kaore e taea e te papaaho te whakamahi i tetahi rawa, i tona uara ranei, ka kore e warewarehia. Mo nga kupu, i hanga e matou he momo reo Esperanto: etahi i tangohia mai i te Android, etahi i SVG, etahi mai CSS.

Mena i runga i tetahi papaahi ka hiahia koe ki te whakaatu i nga huānga rereke, kua whakatinanahia e matou te kaha ki te whakawhiti i te whakaputanga raraunga e rite ana ki te ahua o te konae JSON motuhake. Hei tauira, ko te ahua "i roto i te arotahi" mo Smart TV e tohu ana i te whakarereketanga o te tuunga o te tuhinga i raro i te panui, ko te tikanga mo tenei turanga ko tenei waahanga o te uara o te taonga "indent" ka mau nga tohu nuku e 8 e hiahiatia ana. Ahakoa he mea whakararu tenei i te hanganga o te punaha hoahoa, ka whakawhiwhia e ia he tohu herekore, ka waiho ma tatou te whai waahi ki te whakahaere i te "rereketanga" tirohanga o nga papaahi, kaua hoki e mauheretia ki te hoahoanga i hangaia e matou.

Pikitogram

Ko te whakaahua i roto i te hua matihiko he puhoi tonu, ehara i te kaupapa iti ngawari, he maha nga wa e hiahia ana tetahi kaihoahoa motuhake. He maha tonu nga glyphs, he maha nga rahi me nga tae o ia waahanga, me te nuinga o te waa e hiahia ana nga papaaho ki nga ahuatanga rereke. I te nuinga o te waa, kaore he take kia kaua e whakauru i enei mea katoa ki te punaha hoahoa.

Ka utaina nga Glyphs ki te whakatakotoranga vector SVG, ka whakakapi aunoa nga uara tae ki nga taurangi. Ka taea e nga tono a nga kaihoko te whiwhi kia rite ki te whakamahi - ahakoa te ahua me te tae.

Arokite

I runga ake i nga raraunga JSON, i tuhia e matou he taputapu mo te arokite i nga waahanga - he tono JS e tuku ana i nga raraunga JSON i runga i te rere i roto i ona tohu tohu me nga kaihanga ahua, me te whakaatu i nga rereketanga o ia waahanga i roto i te tirotiro. Ko te tikanga, he rite tonu te arokite ki te kiritaki me nga tono papaaho me te mahi me nga raraunga rite.

Ko te huarahi ngawari ki te mohio me pehea te mahi o tetahi waahanga ko te taunekeneke ki a ia. Na reira, kaore matou i whakamahi i nga taputapu penei i te Puka Korero, engari i hanga he arokite tauwhitiwhiti - ka taea e koe te pa atu, te tohu, te paato... Ina taapirihia he waahanga hou ki te punaha hoahoa, ka puta mai i te arokite, kia whai waahi ai nga papaaho ki te arotahi. i te wa e whakatinana ana.

Tuhinga

I runga i nga raraunga i tukuna ki nga papaahi i te ahua o JSON, ka hangaia aunoa nga tuhinga mo nga waahanga. He rarangi o nga taonga me nga momo uara pea kei roto i ia waahanga ka whakaahuahia. Whai muri i te hanga-aunoa, ka taea te whakamaarama a-ringa i nga korero ka taea te taapiri i tetahi whakaahuatanga tuhinga. Ko te arokite me nga tuhinga e whakawhitihia ana ki a ratau i te taumata o ia waahanga, a, ko nga korero katoa kei roto i nga tuhinga e wātea ana ki nga kaihanga i te ahua o etahi atu kōnae JSON.

Kaipatu

Ko tetahi atu hiahia ko te kaha ki te whakakapi me te whakahou i nga waahanga o naianei i roto i te waa. Kua ako te punaha hoahoa ki te korero ki nga kaiwhakawhanake he aha nga rawa, tae noa ki nga waahanga katoa kaore e taea te whakamahi me te tango i aua mea ka kore e whakamahia i runga i nga papaaho katoa. He maha tonu nga mahi "a-ringa" i roto i tenei mahi, engari kaore matou e tu tonu.

Te whanaketanga o te kiritaki

Kaore e kore, ko te waahanga tino uaua ko te whakamaarama i nga raraunga punaha hoahoa i roto i te waehere o nga papaaho katoa e tautokohia ana e matou. Mena, hei tauira, ehara i te mea hou nga matiti hurihuri i runga ipurangi, katahi ka whakapau kaha nga kaiwhakawhanake o nga tono pūkoro taketake mo te iOS me te Android i mua i to ratau whakaaro me pehea te noho ki a raatau.

Ki te whakatakoto i nga mata tono iOS, ka whakamahia e matou nga tikanga taketake e rua e whakaratohia ana e iviUIKit: te whakatakotoranga kore utu o nga huānga me te whakatakotoranga o nga kohinga huānga. Ka whakamahia e matou te VIPER, a ko nga taunekeneke katoa me te iviUIKit kei roto i te Tirohanga, a ko te nuinga o nga taunekeneke me Apple UIKit kei roto i te iviUIKit. Ko nga rahi me te whakatakotoranga o nga huānga kua tohua i runga i nga tikanga o nga pou me nga hanganga syntactic e mahi ana i runga ake i nga herenga iOS SDK taketake, kia pai ake ai. Na tenei i ngawari ake to maatau oranga i te wa e mahi ana me UICollectionView. Kua tuhia e matou etahi takai ritenga mo nga whakatakotoranga, tae atu ki nga mea tino uaua. He iti noa te waehere a te kiritaki, a ka waiho hei whakapuakanga.

Hei whakaputa momo i roto i te kaupapa Android, ka whakamahia e matou a Gradle, ka huri i nga raraunga punaha hoahoa ki nga momo momo whakatakotoranga XML. I te wa ano, he maha nga kaihanga o nga taumata rereke:

• Taketake. Ko nga raraunga o nga mea tuatahi mo nga kaihanga taumata teitei ka tohua.
• Rauemi. Tikiake pikitia, ata, me etahi atu whakairoiro.
• Waehanga. Kua tuhia mo ia waahanga, e whakaatu ana he aha nga ahuatanga me pehea te whakamaori ki nga momo.

Tukunga tono

I muri i te tuhi a nga kaihoahoa i tetahi waahanga hou, i te hoahoa ano ranei i tetahi waahanga, ka tukuna enei huringa ki te punaha hoahoa. Ko nga kaiwhakawhanake o ia papaaho kei te whakatika pai i a raatau whakatipuranga waehere hei tautoko i nga huringa. I muri i tenei, ka taea te whakamahi i roto i te whakatinanatanga o nga mahi hou e hiahiatia ana tenei waahanga. Na, ko te taunekeneke me te punaha hoahoa kaore e puta i te waa tuuturu, engari i te wa o te whakaemi i nga putanga hou. Ka taea hoki e tenei huarahi te whakahaere pai ake i te tukanga whakawhiti raraunga me te whakarite i te mahi waehere i roto i nga kaupapa whanaketanga kiritaki.

Ngā putanga

Kua kotahi tau mai i te wa i uru ai te punaha hoahoa ki roto i nga hanganga e tautoko ana i te whanaketanga o te whare pikitia a Ivy, a kua taea e taatau te whakatau:

• He kaupapa nui me te uaua tenei e hiahia ana i nga rauemi whakatapua tonu.
• Na tenei i taea ai e matou te hanga i a matou ake reo ataata-whakawhitinga ahurei e tutuki ana i nga whaainga o te ratonga ataata ipurangi.
• Kua kore a maatau papaa whakakitenga me te mahi.

Arokite mo nga waahanga punaha hoahoa Ivy - hoahoa.ivi.ru

Source: will.com