UI-கிட் முதல் வடிவமைப்பு அமைப்பு வரை

ஐவி ஆன்லைன் சினிமா அனுபவம்

2017 ஆம் ஆண்டின் தொடக்கத்தில் எங்கள் சொந்த டிசைன்-டு-கோட் டெலிவரி முறையை உருவாக்குவது பற்றி நாங்கள் முதலில் யோசித்தபோது, ​​பலர் ஏற்கனவே அதைப் பற்றி பேசிக் கொண்டிருந்தனர், சிலர் அதைச் செய்து கொண்டிருந்தனர். இருப்பினும், கிராஸ்-பிளாட்ஃபார்ம் வடிவமைப்பு அமைப்புகளை உருவாக்கும் அனுபவத்தைப் பற்றி இன்றுவரை அதிகம் அறியப்படவில்லை, மேலும் வடிவமைப்பு செயல்படுத்தும் செயல்முறையை ஏற்கனவே வேலை செய்யும் தயாரிப்பாக மாற்றுவதற்கான தொழில்நுட்பங்கள் மற்றும் முறைகளை விவரிக்கும் தெளிவான மற்றும் நிரூபிக்கப்பட்ட சமையல் குறிப்புகள் எதுவும் இல்லை. மேலும் "குறியீட்டில் உள்ள கூறுகள்" மூலம் அவை பெரும்பாலும் வேறுபட்ட விஷயங்களைக் குறிக்கின்றன.

இதற்கிடையில், நிறுவனம் ஆண்டுதோறும் அதன் ஊழியர்களை இரட்டிப்பாக்கியது - வடிவமைப்புத் துறையை அளவிடுவது மற்றும் மேம்பாட்டிற்கான தளவமைப்புகளை உருவாக்குதல் மற்றும் மாற்றுவதற்கான செயல்முறைகளை மேம்படுத்துவது அவசியம். ஆதரிக்கப்பட வேண்டிய தளங்களின் "மிருகக்காட்சிசாலை" மூலம் இதையெல்லாம் பெருக்குகிறோம், மேலும் பாபிலோனிய கோளாறின் சாயலைப் பெறுகிறோம், இது "சாதாரணமாக" செய்து வருமானத்தை ஈட்ட முடியாது. இயங்குதளங்களின் மேம்பாடு பெரும்பாலும் இணையாக தொடர்ந்தது, அதே செயல்பாடு பல மாதங்கள் தாமதத்துடன் வெவ்வேறு தளங்களில் வெளியிடப்படலாம்.


ஒவ்வொரு தளத்திற்கும் தனித்தனி லேஅவுட் செட்

பாரம்பரியமாக, ஒரு வடிவமைப்பு அமைப்பு அதன் வடிவமைப்பிற்கான தேவைகளைத் தீர்க்கவும் வடிவமைக்கவும் உதவும் சிக்கல்களுடன் தொடங்கினோம். ஒரு ஒருங்கிணைந்த காட்சி மொழியை உருவாக்குதல், தளவமைப்பு மற்றும் மேம்பாட்டின் வேகத்தை அதிகரிப்பது மற்றும் ஒட்டுமொத்த தயாரிப்பின் தரத்தை மேம்படுத்துதல் ஆகியவற்றுடன், முடிந்தவரை வடிவமைப்பை ஒருங்கிணைக்க வேண்டியது அவசியம். வலை, iOS, Android, Smart TV, tvOS, Android TV, Windows 10, xBox One, PS4, Roku - இவை ஒவ்வொன்றிலும் தனித்தனியாக வேலை செய்யாமல், எங்கள் எல்லா தளங்களிலும் ஒரே நேரத்தில் செயல்பாட்டின் வளர்ச்சி சாத்தியமாகும் வகையில் இது அவசியம். நாங்கள் அதை செய்தோம்!

வடிவமைப்பு → தரவு

தயாரிப்பு மற்றும் மேம்பாட்டுத் துறைகளுக்கிடையேயான அடிப்படை உடன்பாடுகள் எட்டப்பட்டபோது, ​​தொழில்நுட்ப அடுக்கைத் தேர்ந்தெடுத்து, முழு செயல்முறையின் விவரங்களையும் - தளவமைப்பு முதல் வெளியீடு வரை வேலை செய்ய நாங்கள் அமர்ந்தோம். வடிவமைப்பை மேம்பாட்டிற்கு மாற்றும் செயல்முறையை முழுமையாக தானியக்கமாக்க, தளவமைப்புகளுடன் கூடிய ஸ்கெட்ச் கோப்புகளிலிருந்து நேரடியாக கூறு அளவுருக்களை பாகுபடுத்தும் விருப்பத்தை நாங்கள் ஆராய்ந்தோம். நமக்குத் தேவையான குறியீட்டுத் துண்டுகளைக் கண்டுபிடித்து, நமக்குத் தேவையான அளவுருக்களைப் பிரித்தெடுப்பது ஒரு சிக்கலான மற்றும் ஆபத்தான செயலாகும். முதலாவதாக, மூலக் குறியீட்டின் அனைத்து அடுக்குகளுக்கும் பெயரிடுவதில் வடிவமைப்பாளர்கள் மிகவும் கவனமாக இருக்க வேண்டும், இரண்டாவதாக, இது எளிமையான கூறுகளுக்கு மட்டுமே வேலை செய்யும், மூன்றாவதாக, வேறொருவரின் தொழில்நுட்பம் மற்றும் அசல் ஸ்கெட்ச் தளவமைப்பின் குறியீடு கட்டமைப்பைச் சார்ந்திருப்பது ஒட்டுமொத்த எதிர்காலத்தையும் பாதிக்கிறது. திட்டம். இந்த பகுதியில் ஆட்டோமேஷனை கைவிட முடிவு செய்தோம். வடிவமைப்பு அமைப்புக் குழுவில் முதல் நபர் தோன்றிய விதம் இதுதான், அதன் உள்ளீடு வடிவமைப்பு தளவமைப்புகள் மற்றும் வெளியீடு என்பது கூறுகளின் அனைத்து அளவுருக்களையும் விவரிக்கும் தரவு மற்றும் அணு வடிவமைப்பு முறையின் படி படிநிலையாக வரிசைப்படுத்தப்படுகிறது.

நாங்கள் ஆதரிக்கும் அனைத்து தளங்களிலும் தரவை எங்கு, எப்படி சேமிப்பது, அதை வளர்ச்சிக்கு மாற்றுவது மற்றும் வளர்ச்சியில் அதை எவ்வாறு விளக்குவது என்பது மட்டுமே செய்ய வேண்டிய ஒரே விஷயம். மாலை நேரம் மந்தமாக இல்லாமல் போனது... ஒவ்வொரு தளத்திலிருந்தும் வடிவமைப்பாளர்கள் மற்றும் குழு தலைவர்கள் அடங்கிய பணிக்குழுவின் வழக்கமான சந்திப்புகளின் விளைவாக பின்வருவனவற்றில் உடன்பாடு ஏற்பட்டது.

காட்சியை அணு உறுப்புகளாக கைமுறையாக அலசுவோம்: எழுத்துருக்கள், வண்ணங்கள், வெளிப்படைத்தன்மை, உள்தள்ளல்கள், ரவுண்டிங்ஸ், ஐகான்கள், படங்கள் மற்றும் அனிமேஷனுக்கான கால அளவுகள். இதிலிருந்து நாங்கள் பொத்தான்கள், உள்ளீடுகள், தேர்வுப்பெட்டிகள், வங்கி அட்டை விட்ஜெட்டுகள் போன்றவற்றைச் சேகரிக்கிறோம். ஐகான்களைத் தவிர, நகரங்களின் பெயர்கள், நிம்ஃப்களின் பெயர்கள், போகிமொன், கார் போன்ற எந்த நிலைகளின் பாணிகளுக்கும் சொற்பொருள் அல்லாத பெயர்களை ஒதுக்குகிறோம். பிராண்டுகள்... ஒரே ஒரு நிபந்தனை மட்டுமே உள்ளது - பட்டியல் முன்பே தீர்ந்துவிடக்கூடாது , எப்படி ஸ்டைல்கள் முடிவடையும் - நிகழ்ச்சி செல்ல வேண்டும்! "சிறிய" மற்றும் "நடுத்தர" இடையே ஒரு நடுத்தர பொத்தானைச் சேர்க்க வேண்டிய அவசியமில்லை.

காட்சி மொழி

டெவலப்பர்கள் எல்லா தளங்களுக்கும் பொருந்தக்கூடிய வகையில் தரவை எவ்வாறு சேமிப்பது மற்றும் மாற்றுவது என்பதைப் பற்றி சிந்திக்க விடப்பட்டது, மேலும் வடிவமைப்பு ஆதரவு சாதனங்களின் முழுக் கடற்படையிலும் அழகாகவும் திறம்பட செயல்படக்கூடிய இடைமுக கூறுகளை வடிவமைக்க வேண்டும்.

முன்னதாக, விண்டோஸ் 10 க்கான பயன்பாட்டில் உள்ள பெரும்பாலான வடிவமைப்பு கூறுகளை நாங்கள் ஏற்கனவே "சோதனை" செய்ய முடிந்தது, அந்த நேரத்தில் இது எங்களுக்கு ஒரு புதிய தளமாக இருந்தது, அதாவது, அதற்கு "புதிதாக" ரெண்டரிங் மற்றும் மேம்பாடு தேவைப்பட்டது. அதை வரைவதன் மூலம், பெரும்பாலான கூறுகளைத் தயாரித்துச் சோதித்து, எதிர்கால ஈவி வடிவமைப்பு அமைப்பில் அவற்றில் எது சேர்க்கப்பட வேண்டும் என்பதைப் புரிந்துகொள்ள முடிந்தது. அத்தகைய சாண்ட்பாக்ஸ் இல்லாமல், ஏற்கனவே வேலை செய்யும் தளங்களில் அதிக எண்ணிக்கையிலான மறு செய்கைகள் மூலம் மட்டுமே அத்தகைய அனுபவத்தைப் பெற முடியும், மேலும் இது ஒரு வருடத்திற்கும் மேலாக எடுக்கும்.

வெவ்வேறு தளங்களில் ஒரே கூறுகளை மீண்டும் பயன்படுத்துவது தளவமைப்புகளின் எண்ணிக்கையையும் வடிவமைப்பு அமைப்பின் தரவுகளின் வரிசையையும் கணிசமாகக் குறைக்கிறது, எனவே வடிவமைப்பு மேலும் ஒரு சிக்கலைத் தீர்க்க வேண்டும், முன்பு தயாரிப்பு வடிவமைப்பு மற்றும் மேம்பாட்டின் நடைமுறைகளில் விவரிக்கப்படவில்லை - எப்படி, எடுத்துக்காட்டாக, தொலைபேசிகள் மற்றும் டேப்லெட்டுகளுக்கான பட்டனை டிவிகளில் மீண்டும் பயன்படுத்த முடியுமா? மற்றும் வெவ்வேறு தளங்களில் உள்ள எழுத்துருக்கள் மற்றும் உறுப்புகளின் அளவுகளை நாம் என்ன செய்ய வேண்டும்?

வெளிப்படையாக, ஒவ்வொரு குறிப்பிட்ட தளத்திற்கும் தேவையான உரை மற்றும் உறுப்பு அளவுகளை அமைக்கும் குறுக்கு-தளம் மட்டு கட்டத்தை வடிவமைக்க வேண்டியது அவசியம். கட்டத்திற்கான தொடக்கப் புள்ளியாக, ஒரு குறிப்பிட்ட திரையில் நாம் பார்க்க விரும்பும் திரைப்படச் சுவரொட்டிகளின் அளவு மற்றும் எண்ணிக்கையைத் தேர்ந்தெடுத்தோம், அதன் அடிப்படையில், ஒரு நெடுவரிசையின் அகலம் சமமாக இருக்கும்பட்சத்தில், கட்ட நெடுவரிசைகளை உருவாக்குவதற்கான விதியை உருவாக்கினோம். சுவரொட்டியின் அகலத்திற்கு.

இப்போது நாம் அனைத்து பெரிய திரைகளையும் ஒரே தளவமைப்பு அளவிற்கு கொண்டு வந்து பொதுவான கட்டத்தில் பொருத்த வேண்டும். ஆப்பிள் டிவி மற்றும் ரோகு ஆகியவை 1920x1080 அளவுகளில் வடிவமைக்கப்பட்டுள்ளன, ஆண்ட்ராய்டு டிவி - 960x540, ஸ்மார்ட் டிவிகள், விற்பனையாளரைப் பொறுத்து, ஒரே மாதிரியானவை, ஆனால் சில நேரங்களில் 1280x720. ஆப்ஸ் ரெண்டர் செய்யப்பட்டு முழு HD திரைகளில் காட்டப்படும்போது, ​​960ஐ 2ஆல் பெருக்குகிறது, 1280ஐ 1,33ஆல் பெருக்குகிறது, 1920 என்பது அப்படியே அவுட்புட் ஆகும்.

சலிப்பூட்டும் விவரங்களைத் தவிர்த்து, பொதுவாக அனைத்துத் திரைகளும், தனிமங்கள் மற்றும் அவற்றின் அளவுகள் ஆகியவற்றின் அடிப்படையில், ஒரு வடிவமைப்பு அமைப்பால் மூடப்பட்டிருக்கும், மேலும் அனைத்து தொலைக்காட்சித் திரைகளும் பொதுவான குறுக்கு-தளம் கட்டத்தின் ஒரு சிறப்பு அம்சமாகும் என்ற முடிவுக்கு வந்தோம். சராசரி டேப்லெட் அல்லது டெஸ்க்டாப் போன்ற ஐந்து அல்லது ஆறு நெடுவரிசைகளைக் கொண்டிருக்கும். விவரங்களில் ஆர்வமுள்ளவர்கள், கருத்துகளில் செல்லவும்.

அனைத்து தளங்களுக்கும் ஒற்றை UI

இப்போது, ​​ஒரு புதிய அம்சத்தை வரைய, ஒவ்வொரு இயங்குதளத்திற்கும் நாங்கள் தளவமைப்புகளை வரைய வேண்டியதில்லை, மேலும் அவை ஒவ்வொன்றிற்கும் ஏற்றவாறு மாற்றியமைக்கும் விருப்பங்கள். ஒரு தளவமைப்பு மற்றும் எந்த அகலத்தின் அனைத்து தளங்கள் மற்றும் சாதனங்களுக்கும் அதன் தகவமைப்புத் தன்மையைக் காட்ட போதுமானது: தொலைபேசிகள் - 320-599, மற்ற அனைத்தும் - 600-1280.

தரவு → வளர்ச்சி

நிச்சயமாக, நாங்கள் முற்றிலும் ஒருங்கிணைந்த வடிவமைப்பை அடைய விரும்புகிறோம், ஒவ்வொரு தளத்திற்கும் அதன் தனித்துவமான அம்சங்கள் உள்ளன. இணையம் மற்றும் ஸ்மார்ட் டிவி இரண்டும் ReactJS + TypeScript ஸ்டாக்கைப் பயன்படுத்தினாலும், Smart TV பயன்பாடு பாரம்பரிய WebKit மற்றும் Presto கிளையன்ட்களில் இயங்குகிறது, எனவே வலையுடன் பாணிகளைப் பகிர முடியாது. மின்னஞ்சல் செய்திமடல்கள் அட்டவணை அமைப்புடன் வேலை செய்ய வேண்டிய கட்டாயத்தில் உள்ளன. அதே நேரத்தில், எங்களிடம் பல தனிப்பயன் தளவமைப்புகள், சிக்கலான புதுப்பிப்பு லாஜிக், படங்கள் மற்றும் வீடியோக்கள் இருப்பதால், செயல்திறன் குறைவடையும் என்ற அச்சத்தில், ரியாக்ட் நேட்டிவ் அல்லது அதன் ஒப்புமைகள் எதையும் html அல்லாத இயங்குதளங்கள் பயன்படுத்தவோ பயன்படுத்தவோ திட்டமிடவில்லை. எனவே, ஆயத்த CSS பாணிகள் அல்லது எதிர்வினை கூறுகளை வழங்கும் பொதுவான திட்டம் எங்களுக்குப் பொருந்தாது. எனவே, JSON வடிவத்தில் தரவை அனுப்ப முடிவு செய்தோம், மதிப்புகளை சுருக்கமான அறிவிப்பு வடிவத்தில் விவரிக்கிறோம்.

எனவே சொத்து rounding: 8 விண்டோஸ் 10 பயன்பாடு மாற்றுகிறது CornerRadius="8", வலை - border-radius: 8px, ஆண்ட்ராய்டு - android:radius="8dp", iOS - self.layer.cornerRadius = 8.0.
சொத்து offsetTop: 12 வெவ்வேறு சந்தர்ப்பங்களில் ஒரே இணைய கிளையன்ட் இவ்வாறு விளக்கலாம் top, margin-top, padding-top அல்லது transform

பிளாட்ஃபார்ம் தொழில்நுட்ப ரீதியாக ஒரு சொத்தையோ அதன் மதிப்பையோ பயன்படுத்த முடியாவிட்டால், அதை புறக்கணிக்க முடியும் என்பதையும் விளக்கத்தின் பிரகடனம் குறிக்கிறது. சொற்களின் அடிப்படையில், நாங்கள் ஒரு வகையான எஸ்பெராண்டோ மொழியை உருவாக்கினோம்: சில ஆண்ட்ராய்டில் இருந்து எடுக்கப்பட்டது, சில SVG இலிருந்து, சில CSS இலிருந்து.

ஒரு குறிப்பிட்ட இயங்குதளத்தில் நீங்கள் கூறுகளை வித்தியாசமாகக் காட்ட வேண்டும் என்றால், அதனுடன் தொடர்புடைய தரவு உருவாக்கத்தை தனி JSON கோப்பின் வடிவத்தில் மாற்றும் திறனை நாங்கள் செயல்படுத்தியுள்ளோம். எடுத்துக்காட்டாக, ஸ்மார்ட் டிவிக்கான “இன் ஃபோகஸ்” நிலை சுவரொட்டியின் கீழ் உள்ள உரையின் நிலையில் மாற்றத்தைக் கட்டளையிடுகிறது, அதாவது இந்த தளத்திற்கு “இன்டென்ட்” சொத்தின் மதிப்பில் உள்ள இந்த கூறு அதற்குத் தேவையான 8 உள்தள்ளல் புள்ளிகளைக் கொண்டிருக்கும். இது வடிவமைப்பு அமைப்பின் உள்கட்டமைப்பை சிக்கலாக்கினாலும், இது கூடுதல் அளவிலான சுதந்திரத்தை அளிக்கிறது, மேலும் தளங்களின் காட்சி "ஒற்றுமையின்மையை" நாமே நிர்வகிக்கும் வாய்ப்பை நமக்கு வழங்குகிறது, மேலும் நாங்கள் உருவாக்கிய கட்டிடக்கலைக்கு பணயக்கைதியாக இருக்கக்கூடாது.

சித்திரங்கள்

ஒரு டிஜிட்டல் தயாரிப்பில் ஐகானோகிராபி எப்போதும் ஒரு பெரிய மற்றும் எளிமையான துணைத் திட்டம் அல்ல, பெரும்பாலும் ஒரு தனி வடிவமைப்பாளர் தேவைப்படுகிறது. எப்போதும் நிறைய கிளிஃப்கள் உள்ளன, அவை ஒவ்வொன்றும் பல அளவுகள் மற்றும் வண்ணங்களைக் கொண்டுள்ளன, மேலும் தளங்களுக்கு பொதுவாக வெவ்வேறு வடிவங்களில் அவை தேவைப்படும். பொதுவாக, இதையெல்லாம் வடிவமைப்பு அமைப்பில் வைக்காததற்கு எந்த காரணமும் இல்லை.

கிளிஃப்கள் SVG திசையன் வடிவத்தில் ஏற்றப்படுகின்றன, மேலும் வண்ண மதிப்புகள் தானாகவே மாறிகளால் மாற்றப்படும். கிளையன்ட் பயன்பாடுகள் அவற்றைப் பயன்படுத்தத் தயாராகப் பெறலாம் - எந்த வடிவத்திலும் நிறத்திலும்.

ப்ரோஸ்மோட்டர்

JSON தரவின் மேல், கூறுகளை முன்னோட்டமிடுவதற்கான ஒரு கருவியை நாங்கள் எழுதினோம் - JS ஆப்ஸ், JSON தரவை அதன் மார்க்அப் மற்றும் ஸ்டைல் ​​ஜெனரேட்டர்கள் மூலம் அனுப்புகிறது, மேலும் உலாவியில் ஒவ்வொரு கூறுகளின் பல்வேறு மாறுபாடுகளையும் காண்பிக்கும். அடிப்படையில், முன்னோட்டம் என்பது பிளாட்ஃபார்ம் அப்ளிகேஷன்களின் அதே கிளையன்ட் மற்றும் அதே டேட்டாவுடன் வேலை செய்கிறது.

ஒரு குறிப்பிட்ட கூறு எவ்வாறு செயல்படுகிறது என்பதைப் புரிந்துகொள்வதற்கான எளிதான வழி, அதனுடன் தொடர்புகொள்வதாகும். எனவே, நாங்கள் ஸ்டோரிபுக் போன்ற கருவிகளைப் பயன்படுத்தவில்லை, ஆனால் ஊடாடும் முன்னோட்டத்தை உருவாக்கினோம் - நீங்கள் தொடலாம், சுட்டிக்காட்டலாம், கிளிக் செய்யலாம்... வடிவமைப்பு அமைப்பில் புதிய கூறுகளைச் சேர்க்கும்போது, ​​​​அது மாதிரிக்காட்சியில் தோன்றும், இதனால் தளங்களில் கவனம் செலுத்த வேண்டியிருக்கும். அதை செயல்படுத்தும் போது.

ஆவணங்கள்

JSON வடிவில் இயங்குதளங்களுக்கு வழங்கப்பட்ட தரவின் அடிப்படையில், கூறுகளுக்கான ஆவணங்கள் தானாக உருவாக்கப்படும். அவை ஒவ்வொன்றிலும் உள்ள பண்புகள் மற்றும் சாத்தியமான மதிப்புகளின் பட்டியல் விவரிக்கப்பட்டுள்ளது. தானியங்கு உருவாக்கத்திற்குப் பிறகு, தகவலை கைமுறையாக தெளிவுபடுத்தலாம் மற்றும் உரை விளக்கத்தைச் சேர்க்கலாம். முன்னோட்டம் மற்றும் ஆவணங்கள் ஒவ்வொரு கூறுகளின் மட்டத்திலும் ஒன்றோடொன்று குறுக்கு-குறிப்பிடப்படுகின்றன, மேலும் ஆவணத்தில் உள்ள அனைத்து தகவல்களும் கூடுதல் JSON கோப்புகளின் வடிவத்தில் டெவலப்பர்களுக்குக் கிடைக்கும்.

டிப்ரிகேட்டர்

மற்றொரு தேவை என்னவென்றால், காலப்போக்கில் இருக்கும் கூறுகளை மாற்றவும் புதுப்பிக்கவும் முடியும். வடிவமைப்பு அமைப்பு டெவலப்பர்களுக்கு எந்த பண்புகளை அல்லது முழு கூறுகளையும் கூட பயன்படுத்த முடியாது என்பதைச் சொல்லவும், அவை எல்லா தளங்களிலும் பயன்படுத்தப்படாதவுடன் அவற்றை அகற்றவும் கற்றுக்கொண்டது. இந்த செயல்பாட்டில் இன்னும் நிறைய "கைமுறை" உழைப்பு உள்ளது, ஆனால் நாங்கள் இன்னும் நிற்கவில்லை.

வாடிக்கையாளர் வளர்ச்சி

சந்தேகத்திற்கு இடமின்றி, நாங்கள் ஆதரிக்கும் அனைத்து தளங்களின் குறியீட்டில் வடிவமைப்பு அமைப்பு தரவின் விளக்கம் மிகவும் சிக்கலான நிலை. எடுத்துக்காட்டாக, இணையத்தில் உள்ள மாடுலர் கட்டங்கள் புதியதாக இல்லை என்றால், iOS மற்றும் Android க்கான சொந்த மொபைல் பயன்பாடுகளின் டெவலப்பர்கள் அதை எவ்வாறு வாழ்வது என்பதைக் கண்டுபிடிப்பதற்கு முன்பு கடினமாக உழைத்தனர்.

iOS பயன்பாட்டுத் திரைகளை அமைப்பதற்கு, iviUIKit வழங்கிய இரண்டு அடிப்படை வழிமுறைகளைப் பயன்படுத்துகிறோம்: உறுப்புகளின் இலவச தளவமைப்பு மற்றும் உறுப்புகளின் சேகரிப்புகளின் தளவமைப்பு. நாங்கள் VIPER ஐப் பயன்படுத்துகிறோம், மேலும் iviUIKit உடனான அனைத்து தொடர்புகளும் பார்வையில் குவிந்துள்ளன, மேலும் Apple UIKit உடனான பெரும்பாலான தொடர்புகள் iviUIKit இல் குவிந்துள்ளன. தனிமங்களின் அளவுகள் மற்றும் ஏற்பாடுகள் நெடுவரிசைகள் மற்றும் தொடரியல் கட்டமைப்புகளின் அடிப்படையில் குறிப்பிடப்படுகின்றன, அவை நேட்டிவ் iOS SDK கட்டுப்பாடுகளுக்கு மேல் செயல்படுகின்றன, மேலும் அவற்றை நடைமுறைப்படுத்துகின்றன. இது குறிப்பாக UICollectionView உடன் பணிபுரியும் போது எங்கள் வாழ்க்கையை எளிதாக்கியது. மிகவும் சிக்கலானவை உட்பட தளவமைப்புகளுக்கு பல தனிப்பயன் ரேப்பர்களை நாங்கள் எழுதியுள்ளோம். குறைந்தபட்ச கிளையன்ட் குறியீடு இருந்தது, அது அறிவிப்பாக மாறியது.

ஆண்ட்ராய்டு திட்டத்தில் ஸ்டைல்களை உருவாக்க, கிரேடலைப் பயன்படுத்துகிறோம், டிசைன் சிஸ்டம் தரவை எக்ஸ்எம்எல் வடிவத்தில் ஸ்டைலாக மாற்றுகிறோம். அதே நேரத்தில், எங்களிடம் பல்வேறு நிலைகளின் பல ஜெனரேட்டர்கள் உள்ளன:

• அடிப்படை. உயர் நிலை ஜெனரேட்டர்களுக்கான ப்ரிமிடிவ்களின் தரவு பாகுபடுத்தப்படுகிறது.
• வளம். படங்கள், சின்னங்கள் மற்றும் பிற கிராபிக்ஸ்களைப் பதிவிறக்கவும்.
• கூறு. அவை ஒவ்வொரு கூறுகளுக்கும் எழுதப்பட்டுள்ளன, இது என்ன பண்புகள் மற்றும் அவற்றை எவ்வாறு பாணிகளாக மொழிபெயர்ப்பது என்பதை விவரிக்கிறது.

விண்ணப்ப வெளியீடுகள்

வடிவமைப்பாளர்கள் புதிய கூறுகளை வரைந்த பிறகு அல்லது ஏற்கனவே உள்ள ஒன்றை மறுவடிவமைப்பு செய்த பிறகு, இந்த மாற்றங்கள் வடிவமைப்பு அமைப்பில் வழங்கப்படுகின்றன. ஒவ்வொரு இயங்குதளத்தின் டெவலப்பர்களும் மாற்றங்களை ஆதரிக்க தங்கள் குறியீட்டு உருவாக்கத்தை நன்றாகச் செய்கிறார்கள். இதற்குப் பிறகு, இந்த கூறு தேவைப்படும் இடத்தில் புதிய செயல்பாட்டை செயல்படுத்துவதில் இது பயன்படுத்தப்படலாம். எனவே, வடிவமைப்பு அமைப்புடனான தொடர்பு உண்மையான நேரத்தில் நிகழாது, ஆனால் புதிய வெளியீடுகளை இணைக்கும் நேரத்தில் மட்டுமே. இந்த அணுகுமுறை தரவு பரிமாற்ற செயல்முறையின் மீது சிறந்த கட்டுப்பாட்டை அனுமதிக்கிறது மற்றும் கிளையன்ட் மேம்பாட்டு திட்டங்களில் குறியீடு செயல்பாட்டை உறுதி செய்கிறது.

முடிவுகளை

ஐவி ஆன்லைன் சினிமாவின் வளர்ச்சியை ஆதரிக்கும் உள்கட்டமைப்பின் ஒரு பகுதியாக வடிவமைப்பு அமைப்பு மாறி ஒரு வருடம் ஆகிறது, மேலும் நாம் ஏற்கனவே சில முடிவுகளை எடுக்கலாம்:

• இது ஒரு பெரிய மற்றும் சிக்கலான திட்டமாகும், இது நிலையான அர்ப்பணிப்பு ஆதாரங்கள் தேவைப்படுகிறது.
• ஆன்லைன் வீடியோ சேவையின் நோக்கங்களைச் சந்திக்கும் எங்கள் தனித்துவமான குறுக்கு-தளம் காட்சி மொழியை உருவாக்க இது எங்களுக்கு அனுமதித்தது.
• பார்வை மற்றும் செயல்பாட்டு ரீதியாக பின்தங்கிய தளங்கள் எங்களிடம் இல்லை.

ஐவி வடிவமைப்பு அமைப்பு கூறுகளின் முன்னோட்டம் - design.ivi.ru

ஆதாரம்: www.habr.com