Kotlin Anko Tutorial – Basics of Anko Layouts and More! – Android Library

If only Android API could be simpler. Like come on! 50 keystrokes to show a simple toast?! And the speed of the Android XML layout parsing to some actual meaningful views on the screen also takes a bit of time. Not every user of your app has the shiniest phone…

Behold Anko. Anko is an amazing Android Kotlin library which takes the pain out of Kotlin Android development. No need to deal with an API that’s perfect for Java but not so awesome for a powerful new language like Kotlin.

This post contains all the code that’s been written in this YouTube video.

build.gradle (project)

buildscript {
    ext.kotlin_version = '1.2.30'
    ext.anko_version = '0.10.4'
    repositories {
        google()
        jcenter()
    }
...

build.gradle (app)

apply plugin: 'com.android.application'

apply plugin: 'kotlin-android'

apply plugin: 'kotlin-android-extensions'

kotlin {
    experimental {
        coroutines 'enable'
    }
}

android {
    compileSdkVersion 27
    defaultConfig {
        applicationId "com.resocoder.ankotutorial"
        minSdkVersion 19
        targetSdkVersion 27
        versionCode 1
        versionName "1.0"
        testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}

dependencies {
    implementation fileTree(dir: 'libs', include: ['*.jar'])
    implementation"org.jetbrains.kotlin:kotlin-stdlib-jre7:$kotlin_version"
    implementation 'com.android.support:appcompat-v7:27.1.0'
    testImplementation 'junit:junit:4.12'
    androidTestImplementation 'com.android.support.test:runner:1.0.1'
    androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.1'
    //Anko
    compile "org.jetbrains.anko:anko:$anko_version"
    //Anko Layouts
    compile "org.jetbrains.anko:anko-sdk25:$anko_version"
    compile "org.jetbrains.anko:anko-appcompat-v7:$anko_version"
    //Coroutine listeners for Anko Layouts
    compile "org.jetbrains.anko:anko-sdk25-coroutines:$anko_version"
    compile "org.jetbrains.anko:anko-appcompat-v7-coroutines:$anko_version"
    //For snackbars
    compile "org.jetbrains.anko:anko-design:$anko_version"
    compile "com.android.support:design:27.1.0"
}

MainActivityUI.kt

package com.resocoder.ankotutorial

import android.content.res.ColorStateList
import android.graphics.Color
import android.os.Build
import android.view.Gravity
import android.view.View
import android.widget.Toast
import org.jetbrains.anko.*
import org.jetbrains.anko.design.longSnackbar
import org.jetbrains.anko.sdk25.coroutines.onClick


class MainActivityUI : AnkoComponent<MainActivity> {
    override fun createView(ui: AnkoContext<MainActivity>) = with(ui) {
        frameLayout {
            val textField = editText {
                hint = "Text for toasts and snackbars"
            }.lparams(width = matchParent) {
                margin = dip(12)
                topMargin = dip(30)
            }

            imageView(R.drawable.ic_android_black_24dp) {
                onClick {
                    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP)
                        [email protected] =
                                ColorStateList.valueOf(Color.parseColor("#4CAF50"))
                }
            }.lparams (dip(72), dip(72)) {
                gravity = Gravity.CENTER
            }

            linearLayout {
                button("Show toast") {
                    onClick {
                        toast(textField.text)
                    }
                }

                button("Show snackbar") {
                    onClick {
                        longSnackbar(this@frameLayout, textField.text.toString())
                    }
                }
            }.lparams {
                gravity = Gravity.BOTTOM or Gravity.CENTER_HORIZONTAL
                bottomMargin = dip(72)
            }
        }
    }
}

MainActivity.kt

package com.resocoder.ankotutorial

import android.support.v7.app.AppCompatActivity
import android.os.Bundle
import org.jetbrains.anko.setContentView

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        MainActivityUI().setContentView(this)
    }
}