Anko Layouts और Anko Coroutines का उपयोग करके एक Android एप्लिकेशन बनाना

लगभग एक साल पहले, मैंने अपने एंड्रॉइड प्रोजेक्ट्स में कोटलिन का उपयोग करना शुरू कर दिया था। मैं कुछ नया करने की कोशिश करना चाहता था जो सीखना दिलचस्प होगा। फिर मैं अनको आ गया। उस समय तक, xml में UI लिखना बहुत सुस्त था। मुझे हमेशा अपने हाथों से इंटरफ़ेस लिखना पसंद था, बिना WYSIWYG का सहारा लिए और एंड्रॉइड स्टूडियो में उपयोग किए जाने वाले xml मार्कअप। केवल नकारात्मक यह है कि आपको किसी भी बदलाव की जांच के लिए आवेदन को फिर से शुरू करना होगा। आप एक प्लगइन का उपयोग कर सकते हैं जो दिखाता है कि एप्लिकेशन लॉन्च किए बिना यूआई कैसा दिखेगा, लेकिन यह मुझे अजीब लग रहा था। उसके पास एक्सएमएल को एंको लेआउट डीएसएल में बदलने की शांत क्षमता भी है।

पुस्तकालय की सबसे बड़ी कमी प्रलेखन की लगभग पूर्ण कमी है। यह पता लगाने के लिए कि इसे सही तरीके से कैसे उपयोग किया जाए, मुझे अक्सर स्रोत पर गौर करना पड़ता है। इस लेख में, Anko Layouts और Anko Coroutines का उपयोग करके अनुप्रयोग विकास पर विस्तार से चर्चा की जाएगी।

Anko पुस्तकालय स्वयं 4 स्वतंत्र भागों में विभाजित है:

• Anko लेआउट - एक यूआई का निर्माण।
• Anko कॉमन्स - उपयोगी उपकरण और सुविधाएँ।
• Anko SQLite - SQLite डेटाबेस के साथ काम करते हैं।
• कोरकोइन के साथ काम करने के लिए Anko Coroutines उपयोगी उपकरण हैं।

प्रोजेक्ट में लाइब्रेरी जोड़ने के लिए, प्रोजेक्ट के आधार पर सिर्फ एक लाइन जोड़ें:

implementation "org.jetbrains.anko:anko:$anko_version"

जहां anko_version लाइब्रेरी का वर्तमान संस्करण है, प्रोजेक्ट स्तर पर बिल्ड.ग्रेड फ़ाइल में पंजीकृत है:

ext.anko_version='0.10.8'

अनको लेआउट

Anko लेआउट आपको UI का उपयोग करने की तुलना में अधिक कुशलता से UI Android एप्लिकेशन विकसित करने की अनुमति देता है।

मैदान पर मुख्य खिलाड़ी एक एकल बनाएँ दृश्य विधि वाला AnkoComponent<T> इंटरफ़ेस है जो AnkoComponent<T> को स्वीकार करता है और एक दृश्य देता है। यह इस विधि में है कि संपूर्ण UI बनाया गया है। AnkoContext<T> इंटरफ़ेस ViewManager पर एक आवरण है। इसके बारे में और बाद में होगा।

AnkoComponent<T> कैसे AnkoComponent<T> इसकी थोड़ी समझ होने के बाद, आइए हमारी गतिविधि के वर्ग में एक सरल UI बनाने का प्रयास करें। यह स्पष्ट करने योग्य है कि UI की ऐसी "प्रत्यक्ष" वर्तनी केवल गतिविधि में ही संभव है, क्योंकि इसके लिए एक अलग एक्सटेंशन फ़ंक्शन akoView लिखा गया है, जिसमें addView पद्धति को कहा जाता है , और AnkoContextImpl<T> को स्वयं setContentView = true पैरामीटर के साथ विधि में बनाया गया है।

 class AppActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) verticalLayout { lparams(matchParent, matchParent) gravity = Gravity.CENTER textView("Cool Anko TextView") { gravity = Gravity.CENTER } } } 

जाहिर है, एक से अधिक TextView के लिए, ऑनक्रैट विधि जल्दी से एक डंप में बदल जाएगी। आइए यूआई से गतिविधि वर्ग को अलग करने का प्रयास करें। ऐसा करने के लिए, एक अन्य वर्ग बनाएं जिसमें इसका वर्णन किया जाएगा।

 class AppActivityUi: AnkoComponent<AppActivity> { override fun createView(ui: AnkoContext<AppActivity>): View = with(ui) { verticalLayout { lparams(matchParent, matchParent) gravity = Gravity.CENTER textView("Cool Anko TextView") { gravity = Gravity.CENTER } } } } 

अब, हमारे यूआई को हमारी गतिविधि में पास करने के लिए, आप उपयोग कर सकते हैं

 AppActivityUi().setContentView(this) 

ठीक है, लेकिन क्या होगा अगर हम टुकड़े के लिए एक यूआई बनाना चाहते हैं? ऐसा करने के लिए, आप सीधे onCreateView टुकड़ा विधि से कॉल करके createView पद्धति का उपयोग कर सकते हैं। यह इस तरह दिखता है:

 class AppFragment : Fragment() { override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View { return AppFragmentUi().createView(AnkoContext.create(requireContext(), this)) } } 

जैसा कि पहले ही उल्लेख किया गया है - AnkoContext<T> ViewManager पर एक आवरण है। इसके साथी ऑब्जेक्ट में तीन मुख्य विधियाँ हैं जो AnkoContext<T> । हम उनका और अधिक विस्तार से विश्लेषण करेंगे।

बनाने

  fun <T> create(ctx: Context, owner: T, setContentView: Boolean = false): AnkoContext<T> 

और उसका जुड़वां भाई

 fun create(ctx: Context, setContentView: Boolean = false): AnkoContext<Context> 

वापसी AnkoContextImpl<T> ।

सभी मानक मामलों में विधियों का उपयोग किया जाता है, उदाहरण के लिए, गतिविधि और टुकड़े के साथ पिछले उदाहरणों में। यहां सबसे दिलचस्प है मालिक और setContentView विकल्प। पहला आपको एक विशिष्ट फ़्रैगमेंट, गतिविधि या कुछ और बनाने के लिए अनुमति देता है।

 MyComponent().createView(AnkoContext.create(context, myVew)) class MyComponent: AnkoComponent<View> { override fun createView(ui: AnkoContext<View>): View = with(ui) { val myView: View= ui.owner //     } } 

दूसरा पैरामीटर - setContentView - स्वचालित रूप से परिणामी दृश्य को जोड़ने की कोशिश करेगा यदि प्रसंग एक गतिविधि या प्रसंगवृत्त का एक उदाहरण है । यदि वह सफल नहीं होता है, तो वह एक IllegalStateException को फेंक देगा।

createDelegate

यह विधि बहुत उपयोगी हो सकती है, लेकिन गिहाब पर आधिकारिक प्रलेखन इसके बारे में कुछ नहीं कहता है। जब मैंने यूआई कक्षाओं को ब्लोट करने की समस्या को हल किया तो मैं इस स्रोत में आ गया:

 fun <T: ViewGroup> createDelegate(owner: T): AnkoContext<T> = DelegatingAnkoContext(owner) 

यह आपको स्वामी को createView घटक के परिणाम को जोड़ने की अनुमति देता है।

एक उदाहरण के रूप में इसके उपयोग पर विचार करें। मान लीजिए कि हमारे पास एक बड़ा वर्ग है जो एप्लिकेशन स्क्रीन में से एक का वर्णन करता है - AppFragmentUi।

 verticalLayout { relativeLayout { id = R.id.toolbar //    view } relativeLayout{ id = R.id.content //     view } } 

तार्किक रूप से, इसे दो भागों में विभाजित किया जा सकता है - टूलबार और सामग्री, AppFragmentUiToolbar और AppFragmentUiContent, क्रमशः। तब हमारा मुख्य वर्ग AppFragmentUi बहुत सरल हो जाएगा:

 class AppFragmentUi: AnkoComponent<AppFragment> { override fun createView(ui: AnkoContext<AppFragment>) = with(ui) { verticalLayout { AppFragmentUiToolbar().createView(AnkoContext.createDelegate(this)) AppFragmentUiContent().createView(AnkoContext.createDelegate(this)) } } } class AppFragmentUiToolbar : AnkoComponent<_LinearLayout> { override fun createView(ui: AnkoContext<_LinearLayout>): View = with(ui.owner) { relativeLayout { id = R.id.toolbar //   view } } } 

ध्यान दें कि ui नहीं, लेकिन ui.owner को ऑब्जेक्ट के रूप में फ़ंक्शन के with किया जाता है।
इस प्रकार, हमारे पास निम्नलिखित एल्गोरिथम हैं:

1. घटक उदाहरण बनाया जाता है।
2. CreateView Method जोड़े जाने के लिए View बनाता है।
3. परिणामी दृश्य को स्वामी में जोड़ा जाता है।

एक निकट सन्निकटन: this.addView(AppFragmentUiToolbar().createView(...))
जैसा कि आप देख सकते हैं, createDelegate के साथ विकल्प अधिक पठनीय है।

createReusable

यह मानक AnkoContext.create जैसा दिखता है, लेकिन इसके अतिरिक्त - नवीनतम दृश्य को मूल दृश्य माना जाता है:

 class MyComponent: AnkoComponent<MyObject> { override fun createView(ui: AnkoContext<MyObject>): View = with(ui) { textView("Some text") //       IllegalStateException: View is already set //     "Another text" textView("Another text") } } 

मानक कार्यान्वयन में, यदि रूट दृश्य सेट किया गया है, तो समानांतर में दूसरा दृश्य सेट करने का प्रयास अपवाद को फेंक देगा ।

CreateReusable मेथड ReusableAnkoContext क्लास को लौटाता है, जो AnkoContextImpl से विरासत में मिलता है और पहले से मौजूद alreadyHasView() विधि को ओवरराइड करता है।

CustomView

सौभाग्य से, एनको लेआउट इस कार्यक्षमता तक सीमित नहीं है। यदि हमें अपना स्वयं का कस्टम दृश्य दिखाने की आवश्यकता है, तो हमें लिखना नहीं पड़ेगा

 verticalLayout { val view = CustomView(context) //.... addView(view) //  addView(view.apply { ... }) } 

ऐसा करने के लिए, आप अपना खुद का रैपर जोड़ सकते हैं, जो ऐसा ही करेगा।

यहाँ मुख्य घटक विस्तार विधि हैं <T: View>ankoView(factory: (Context) -> T, theme: Int, init: T.() -> Unit) ViewManager, Context या गतिविधि से।

• factory - एक फ़ंक्शन, जिस इनपुट के संदर्भ में पास किया गया है और दृश्य लौटाया गया है। वास्तव में, यह वह कारखाना है जिसमें दृश्य का निर्माण होता है।
• थीम एक शैली संसाधन है जिसे वर्तमान दृश्य पर लागू किया जाएगा।
• init एक फ़ंक्शन है जिसमें बनाए गए व्यू के लिए आवश्यक पैरामीटर सेट किए जाएंगे।

हमारे CustomView के लिए अपना कार्यान्वयन जोड़ें

 inline fun ViewManager.customView(theme: Int = 0, init: (CustomView).() -> Unit): CustomView { return ankoView({ CustomView(it) }, theme, init) } 

अब हमारा CustomView बहुत ही सरलता से बनाया गया है:

 customView { id = R.id.customview //   } 

लेआउटपरम्स को व्यू में लागू करने के लिए आप लैपरम का उपयोग कर सकते हैं।

 textView("text") { textSize = 12f }.lparams(width = matchParent, height = wrapContent) { centerInParent() } 

यह ध्यान देने योग्य है कि यह सभी दृश्य पर लागू नहीं है - सभी लैपरम विधियां आमतौर पर रैपर में घोषित की जाती हैं। उदाहरण के लिए, _RelativeLayout RelativeLayout पर एक आवरण है। और इसलिए सभी के लिए।

सौभाग्य से, एंड्रॉइड सपोर्ट लाइब्रेरी के लिए कई आवरण लिखे गए हैं, इसलिए आप केवल ग्रेड फ़ाइल में निर्भरता को शामिल कर सकते हैं।

  // Appcompat-v7 (Anko Layouts) implementation "org.jetbrains.anko:anko-appcompat-v7:$anko_version" implementation "org.jetbrains.anko:anko-coroutines:$anko_version" // CardView-v7 implementation "org.jetbrains.anko:anko-cardview-v7:$anko_version" // Design implementation "org.jetbrains.anko:anko-design:$anko_version" implementation "org.jetbrains.anko:anko-design-coroutines:$anko_version" // GridLayout-v7 implementation "org.jetbrains.anko:anko-gridlayout-v7:$anko_version" // Percent implementation "org.jetbrains.anko:anko-percent:$anko_version" // RecyclerView-v7 implementation "org.jetbrains.anko:anko-recyclerview-v7:$anko_version" implementation "org.jetbrains.anko:anko-recyclerview-v7-coroutines:$anko_version" // Support-v4 (Anko Layouts) implementation "org.jetbrains.anko:anko-support-v4:$anko_version" // ConstraintLayout implementation "org.jetbrains.anko:anko-constraint-layout:$anko_version" 

अन्य बातों के अलावा, पुस्तकालय विभिन्न श्रोताओं के अधिक सुविधाजनक कार्यान्वयन के लिए अनुमति देता है। भंडार से एक छोटा सा उदाहरण:

 seekBar.setOnSeekBarChangeListener(object : OnSeekBarChangeListener { override fun onProgressChanged(seekBar: SeekBar, progress: Int, fromUser: Boolean) = Unit override fun onStartTrackingTouch(seekBar: SeekBar?) = Unit override fun onStopTrackingTouch(seekBar: SeekBar) = Unit }) 

और अब Anko का उपयोग कर

 seekBar { onSeekBarChangeListener { onProgressChanged { seekBar, progress, fromUser -> // do something } } } 

इसके अलावा, कुछ श्रोता कोरटाइन का समर्थन करते हैं:

  verticalLayout{ val anyCoroutineContext = GlobalScope.coroutineContext onClick(anyCoroutineContext) { //this: CoroutineScope } } 

आँको कोरटाइन

स्मृति रिसाव-संवेदी वस्तुओं को सुरक्षित रूप से स्थानांतरित करने के लिए, asReference विधि का asReference । यह WeakReference पर आधारित है और Ref ऑब्जेक्ट लौटाता है ।

 verticalLayout{ val activity = ui.owner val activityReference: Ref<AppActivity> = activity.asReference() onClick(anyCoroutineContext) { ref().doSomething() } } 

मान लीजिए कि आप मानक ViewPager.OnPageChangeListener में corutin के लिए समर्थन जोड़ना चाहते हैं। आइए इसे साकबर उदाहरण के रूप में शांत करें।
सबसे पहले, एक अलग वर्ग बनाएं और ViewPager.OnPageChangeListener से इनहेरिट करें।

 class CoroutineOnPageChangeListener( private val coroutineContext: CoroutineContext = Dispatchers.Main ) : ViewPager.OnPageChangeListener { } 

हम लैम्ब्डा को वैरिएबल में स्टोर करेंगे, जिसे ViewPager.OnPageChangeListener द्वारा कॉल किया जाएगा।

  private var onPageScrollStateChanged: ((Int, CoroutineContext) -> Unit)? = null private var onPageScrolled: ((Int, Float, Int, CoroutineContext) -> Unit)? = null private var onPageSelected: ((Int, CoroutineContext) -> Unit)? = null 

हम इनमें से किसी एक चर के लिए इनिशियलाइज़ेशन लागू करते हैं (बाकी काम उसी तरह से किए जाते हैं)

  fun onPageScrollStateChanged(action: ((Int, CoroutineContext) -> Unit)?) { onPageScrollStateChanged = action } 

और अंत में हम एक ही नाम के साथ एक फ़ंक्शन लागू करते हैं।

  override fun onPageScrollStateChanged(state: Int) { GlobalScope.launch(coroutineContext) { onPageScrollStateChanged?.invoke(state, coroutineContext) } } 

यह काम करने के लिए एक एक्सटेंशन फ़ंक्शन जोड़ने के लिए रहता है

 fun ViewPager.onPageChangeListenerCoroutines(init: CoroutineOnPageChangerListener.() -> Unit) { val listener = CoroutineOnPageChangerListener() listener.init() addOnPageChangeListener(listener) } 

और इस पूरी चीज़ को ViewPager के नीचे पेस्ट करें

 viewPager { onPageChangeListenerCoroutines { onPageScrolled { position, offset, pixels, coroutineContext -> //  -   . } } } 

 class CoroutineOnPageChangeListener( private val coroutineContext: CoroutineContext = Dispatchers.Main ) : ViewPager.OnPageChangeListener { private var onPageScrollStateChanged: ((Int, CoroutineContext) -> Unit)? = null private var onPageScrolled: ((Int, Float, Int, CoroutineContext) -> Unit)? = null private var onPageSelected: ((Int, CoroutineContext) -> Unit)? = null fun onPageScrollStateChanged(action: ((Int, CoroutineContext) -> Unit)?) { onPageScrollStateChanged = action } fun onPageScrolled(action: ((Int, Float, Int, CoroutineContext) -> Unit)?) { onPageScrolled = action } fun onPageSelected(action: ((Int, CoroutineContext) -> Unit)?) { onPageSelected = action } override fun onPageScrolled(position: Int, positionOffset: Float, positionOffsetPixels: Int) { GlobalScope.launch(coroutineContext) { onPageScrolled?.invoke(position, positionOffset, positionOffsetPixels, coroutineContext) } } override fun onPageSelected(position: Int) { GlobalScope.launch(coroutineContext) { onPageSelected?.invoke(position, coroutineContext) } } override fun onPageScrollStateChanged(state: Int) { GlobalScope.launch(coroutineContext) { onPageScrollStateChanged?.invoke(state, coroutineContext) } } } fun ViewPager.onPageChangeListenerCoroutines(init: CoroutineOnPageChangerListener.() -> Unit) { val listener = CoroutineOnPageChangerListener() listener.init() addOnPageChangeListener(listener) } 

एंको लेआउट लाइब्रेरी में भी कई उपयोगी विधियां हैं, जैसे विभिन्न मैट्रिक्स में अनुवाद।