Issue #555

Synthetic properties generated by Kotlin Android Extensions plugin needs a view for Fragment/Activity to be set before hand.

In your case, for Fragment, you need to use view.btn_K in onViewCreated

override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
    super.onCreateView(inflater, container, savedInstanceState)
    val view = inflater.inflate(R.layout.fragment_card_selector, container, false)
    view.btn_K.setOnClickListener{} // access with `view`
    return view
}

Or better, you should only access synthetic properties in onViewCreated

override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
    super.onCreateView(inflater, container, savedInstanceState)
    return inflater.inflate(R.layout.fragment_card_selector, container, false)
}

override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
    super.onViewCreated(view, savedInstanceState)
    btn_K.setOnClickListener{} // access without `view`
}

Please notice that savedInstanceState parameter should be nullable Bundle?, and also check Importing synthetic properties

It is convenient to import all widget properties for a specific layout
in one go:

import kotlinx.android.synthetic.main.<layout>.*

Thus if the layout filename is activity_main.xml, we’d import
kotlinx.android.synthetic.main.activity_main.*.

If we want to call the synthetic properties on View, we should also
import kotlinx.android.synthetic.main.activity_main.view.*.

Read more

• https://stackoverflow.com/questions/34541650/nullpointerexception-when-trying-to-access-views-in-a-kotlin-fragment/51674381#51674381

Issue #497

Synthetic properties generated by Kotlin Android Extensions plugin needs a view for Fragment/Activity to be set before hand.

In your case, for Fragment, you need to use view.btn_K in onViewCreated

override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
    super.onCreateView(inflater, container, savedInstanceState)
    val view = inflater.inflate(R.layout.fragment_card_selector, container, false)
    view.btn_K.setOnClickListener{} // access with `view`
    return view
}

Or better, you should only access synthetic properties in onViewCreated

override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
    super.onCreateView(inflater, container, savedInstanceState)
    return inflater.inflate(R.layout.fragment_card_selector, container, false)
}

override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
    super.onViewCreated(view, savedInstanceState)
    btn_K.setOnClickListener{} // access without `view`
}

Please notice that savedInstanceState parameter should be nullable Bundle?, and also check Importing synthetic properties

It is convenient to import all widget properties for a specific layout
in one go:

import kotlinx.android.synthetic.main.<layout>.*

Thus if the layout filename is activity_main.xml, we’d import
kotlinx.android.synthetic.main.activity_main.*.

If we want to call the synthetic properties on View, we should also
import kotlinx.android.synthetic.main.activity_main.view.*.

Original answer https://stackoverflow.com/questions/34541650/nullpointerexception-when-trying-to-access-views-in-a-kotlin-fragment/51674381#51674381

Issue #472

Build error view

Use convenient code from Omnia

To make view height dynamic, pin UILabel to edges and center

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43

import UIKit

final class ErrorMessageView: UIView {
    let box: UIView = {
        let view = UIView()
        view.backgroundColor = R.color.primary
        view.layer.cornerRadius = 6
        return view
    }()

    let label: UILabel = {
        let label = UILabel()
        label.styleAsText()
        label.textColor = R.color.darkText
        label.numberOfLines = 0
        return label
    }()

    override init(frame: CGRect) {
        super.init(frame: frame)
        setup()
    }

    required init?(coder: NSCoder) {
        fatalError()
    }

    private func setup() {
        addSubviews([box, label])
        NSLayoutConstraint.on([
            box.pinEdges(view: self, inset: UIEdgeInsets.all(16)),
            label.pinEdges(view: box, inset: UIEdgeInsets.all(8))
        ])

        NSLayoutConstraint.on([
            box.heightAnchor.constraint(greaterThanOrEqualToConstant: 48)
        ])

        NSLayoutConstraint.on([
            label.centerYAnchor.constraint(equalTo: centerYAnchor)
        ])
    }
}

Show and hide

Use Auto Layout and basic UIView animation. Use debouncer to avoid hide gets called for the new show. Use debouncer instead of DispatchQueue.main.asyncAfter because it can cancel the previous DispatchWorkItem

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43

import UIKit

final class ErrorMessageHandler {
    let view: UIView
    let errorMessageView = ErrorMessageView()
    let debouncer = Debouncer(delay: 0.5)

    init(view: UIView) {
        self.view = view
    }

    func show(text: String) {
        self.errorMessageView.label.text = text
        view.addSubview(errorMessageView)
        NSLayoutConstraint.on([
            errorMessageView.leftAnchor.constraint(equalTo: view.leftAnchor),
            errorMessageView.rightAnchor.constraint(equalTo: view.rightAnchor),
            errorMessageView.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor)
        ])

        toggle(shows: true)
        debouncer.run {
            self.hide()
        }
    }

    func hide() {
        toggle(shows: false)
    }

    private func toggle(shows: Bool) {
        self.errorMessageView.alpha = shows ? 0 : 1.0
        UIView.animate(withDuration: 0.25, animations: {
            self.errorMessageView.alpha = shows ? 1.0 : 0
        }, completion: { _ in
            if shows {
                self.view.bringSubviewToFront(self.errorMessageView)
            } else {
                self.errorMessageView.removeFromSuperview()
            }
        })
    }
}

Handle keyboard

If we add this error message on UIView in ViewController and we use KeyboardHandler to scroll the entire view, then this snack bar will move up as well

1
2
3
4
5
6
7
8
9
10

final class ErrorMessageHandler {
    private let errorMessageView = ErrorMessageView()
    private var view = UIView()
    private var bottomOffset: CGFloat = 0

    func on(view: UIView, bottomOffset: CGFloat) {
        self.view = view
        self.bottomOffset = bottomOffset
    }
}

UIView animation completion

One tricky thing is that if we call hide and then show immediately, the completion of hide will be called after and then remove the view.

When we start animation again, the previous animation is not finished, so we need to check

Read UIView.animate

completion
A block object to be executed when the animation sequence ends. This block has no return value and takes a single Boolean argument that indicates whether or not the animations actually finished before the completion handler was called. If the duration of the animation is 0, this block is performed at the beginning of the next run loop cycle. This parameter may be NULL.

1
2
3
4
5
6
7
8
9
10
11
12
13
14

private func toggle(shows: Bool) {
    self.errorMessageView.alpha = shows ? 0 : 1.0
    UIView.animate(withDuration: 0.25, delay: 0, options: .curveEaseInOut, animations: {
        self.errorMessageView.alpha = shows ? 1.0 : 0
    }, completion: { finished in
        if shows {
            self.view.bringSubviewToFront(self.errorMessageView)
        } else if finished {
            self.errorMessageView.removeFromSuperview()
        } else {
            // No op
        }
    })
}

Issue #466

iOS

1

View Controller -> View Model | Logic Handler -> Data Handler -> Repo

Android

1

Activity -> Fragment -> View Model | Logic Handler -> Data Handler -> Repo

Issue #431

Use AdMob with Firebase

• https://firebase.google.com/docs/admob/android/quick-start

build.gradle

1
2
3
4
5
6
7
8
9
10

buildscript {
    repositories {
        google()
        jcenter()
        
    }
    dependencies {
        classpath 'com.google.gms:google-services:4.3.2'
    }
}

app/build.gradle

1
2
3
4
5
6
7
8
9
10
11
12
13

class Version {
    class Firebase {
        static def analytics = "17.2.0"
        static def ads = "18.2.0"
    }
}

dependencies {
    implementation "com.google.firebase:firebase-analytics:$Version.Firebase.analytics"
    implementation "com.google.firebase:firebase-ads:$Version.Firebase.ads"
}

apply plugin: 'com.google.gms.google-services'

Manifest.xml

1
2
3
4
5
6
7
8

<manifest>
    <application>
        <!-- Sample AdMob App ID: ca-app-pub-3940256099942544~3347511713 -->
        <meta-data
            android:name="com.google.android.gms.ads.APPLICATION_ID"
            android:value="[ADMOB_APP_ID]"/>
    </application>
</manifest>

MyApplication.kt

1
2
3
4
5
6
7

class MyApplication: Application() {
    override fun onCreate() {
        super.onCreate()

        MobileAds.initialize(this)
    }
}

AdView

fragment.xml

1
2
3
4
5
6
7
8
9
10

<com.google.android.gms.ads.AdView
        xmlns:ads="http://schemas.android.com/apk/res-auto"
        android:id="@+id/adView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        ads:adSize="BANNER"
        ads:adUnitId="ca-app-pub-123456/123456"
        ads:layout_constraintBottom_toBottomOf="parent"
        ads:layout_constraintLeft_toLeftOf="parent"
        ads:layout_constraintRight_toRightOf="parent"/>

Fragment.kt

1
2
3
4
5

import com.google.android.gms.ads.AdRequest
import com.google.android.gms.ads.AdView

val request = AdRequest.Builder().build()
adView.loadAd(request)

Troubleshooting

Link your app to Firebase option not showing

• https://support.google.com/admob/answer/6383165?authuser=0
• Use standalone AdMob https://developers.google.com/admob/android/quick-start

app/build.gradle

1
2
3

dependencies {
    implementation 'com.google.android.gms:play-services-ads:18.2.0'
}

Cannot fit requested classes in a single dex file

• https://stackoverflow.com/questions/48249633/errorcannot-fit-requested-classes-in-a-single-dex-file-try-supplying-a-main-dex

app/build.gradle

1
2
3
4
5
6
7
8
9
10

android {
    defaultConfig {
        multiDexEnabled true
    }
}

dependencies {
    implementation 'com.android.support:multidex:1.0.3'
}

Read more

• http://thetechnocafe.com/a-complete-guide-to-integrating-admob-in-your-android-app/

Issue #397

We recommend that, rather than disabling the preview window, you follow the common Material Design patterns. You can use the activity’s windowBackground theme attribute to provide a simple custom drawable for the starting activity.

styles.xml

1
2
3

<style name="LaunchTheme" parent="Theme.AppCompat.NoActionBar">
    <item name="android:windowBackground">@drawable/launch_background</item>
</style>

Set android:theme="@style/LaunchTheme" to activity element

AndroidManifest.xml

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
          package="com.onmyway133.whatsupintech">
    <uses-permission android:name="android.permission.INTERNET" />

    <application
            android:name=".MyApplication"
            android:allowBackup="true"
            android:icon="@mipmap/ic_launcher"
            android:label="@string/app_name"
            android:roundIcon="@mipmap/ic_launcher_round"
            android:supportsRtl="true"
            android:theme="@style/AppTheme">
        <activity
                android:name=".features.main.MainActivity"
                android:label="@string/app_name"
                android:theme="@style/LaunchTheme">
            <intent-filter>
                <action android:name="android.intent.action.MAIN"/>
                <category android:name="android.intent.category.LAUNCHER"/>
            </intent-filter>
        </activity>
    </application>

</manifest>

MainActivity.kt

1
2
3
4
5
6
7
8

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        setTheme(R.style.AppTheme_NoActionBar)
        super.onCreate(savedInstanceState)
        setContentView(R.layout.main_activity)
    }
}

Read more

• The Complete Android Splash Screen Guide
• Themed launch screens

Issue #396

Use app:headerLayout

1
2
3
4
5
6
7
8
9
10

<com.google.android.material.navigation.NavigationView
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:id="@+id/navigationView"
    android:fitsSystemWindows="true"
    android:layout_gravity="start"
    app:menu="@menu/drawer_menu"
    app:itemIconTint="@color/title"
    app:itemTextColor="@color/title"
    app:headerLayout="@layout/navigation_header" />

navigation_header.xml

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <androidx.appcompat.widget.AppCompatImageView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:src="@drawable/icon"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"/>

</androidx.constraintlayout.widget.ConstraintLayout>

Issue #383

Right click res -> New -> Android Resource Directory, select anim and name it anim
Right click res/anim -> New -> Android Resource file, name it bounce

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:fromYDelta="0"
        android:toYDelta="-100"
        android:repeatCount="infinite" />
</set>
``` 

We have to set `repeatCount` in xml, setting in code does not work !!

```kt
val bounce = AnimationUtils.loadAnimation(context, R.anim.bounce)
bounce.repeatMode = Animation.REVERSE
bounce.duration = (1000..2000).random().toLong()

imageView.startAnimation(bounce)

Issue #382

1
2
3
4
5
6
7
8
9
10

import android.content.Context

fun Int.toDp(context: Context?): Int {
    if (context != null) {
        val scale = context.resources.displayMetrics.density
        return (this.toFloat() * scale + 0.5f).toInt()
    } else {
        return 0
    }
}

1
2

val set = ConstraintSet()
set.setMargin(imageView.id, ConstraintSet.RIGHT, rightMargin.toDp(150))

Read more

• https://stackoverflow.com/questions/5255184/android-and-setting-width-and-height-programmatically-in-dp-units

Issue #381

From API < 17, there is ViewCompat.generateViewId()
For API 17, there is View.generateViewId()

Note that to use ConstraintSet, all views under ConstraintLayout inside xml must have unique id

1
2
3
4
5
6
7
8
9

val imageView = ImageView(context)
imageView.id = View.generateViewId()
imageView.setImageResource(resId)
constraintLayout.addView(imageView)

val set = ConstraintSet()
set.clone(constraintLayout)
set.connect(imageView.id, ConstraintSet.RIGHT, ConstraintSet.PARENT_ID, ConstraintSet.RIGHT)
set.applyTo(constraintLayout)

Issue #380

Downloadable fonts

https://developer.android.com/guide/topics/ui/look-and-feel/downloadable-fonts

Android 8.0 (API level 26) and Android Support Library 26 introduce support for APIs to request fonts from a provider application instead of bundling files into the APK or letting the APK download fonts. The feature is available on devices running Android API versions 14 and higher through the Support Library 26

Before

• Select File -> New -> Folder -> Assets Folder to create src/main/assets/fonts

1
2

al myTypeface = Typeface.createFromAsset(assets, "fonts/myFont.ttf")
myTextView.typeface = myTypeface

In res

Create font directory

Right click res -> New -> Android Resource Directory, select font and name the folder font

Add custom fonts to res/font folder. Note that name must be lower case and underscore, like opensans_extrabolditalic.ttf

Right click res/font -> New -> Font resource file to create font family

opensans.xml

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35

<?xml version="1.0" encoding="utf-8"?>
<font-family
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto" >
    <font
        android:font="@font/opensans_regular"
        android:fontStyle="normal"
        android:fontWeight="400"
        app:fontFamily="@font/opensans_regular"
        app:fontStyle="normal"
        app:fontWeight="400" />
    <font
        android:font="@font/opensans_semibold"
        android:fontStyle="normal"
        android:fontWeight="400"
        app:fontFamily="@font/opensans_semibold"
        app:fontStyle="normal"
        app:fontWeight="400" />
    <font
        android:font="@font/opensans_bold"
        android:fontStyle="normal"
        android:fontWeight="400"
        app:fontFamily="@font/opensans_bold"
        app:fontStyle="normal"
        app:fontWeight="400" />
</font-family>
``` 

Then use

```xml
<TextView
    android:fontFamily="@font/opensans_bold"
    android:textSize="26dp"
/>

Read more

• https://stackoverflow.com/questions/5583608/difference-between-res-and-assets-directories
• https://www.raywenderlich.com/213-custom-and-downloadable-fonts-on-android
• https://stackoverflow.com/questions/27588965/how-to-use-custom-font-in-a-project-written-in-android-studio

Issue #379

1
2
3
4
5
6
7

interface Api {
    @GET("topstories.json?print=pretty")
    suspend fun getTopStories(): List<Int>

    @GET("item/{id}.json?print=pretty")
    suspend fun getStory(@Path("id") id: Int): Item
}

1
2
3
4
5
6
7
8
9

class Repo {
    fun api(): Api {
        return Retrofit.Builder()
            .baseUrl("https://hacker-news.firebaseio.com/v0/")
            .addConverterFactory(MoshiConverterFactory.create())
            .build()
            .create(Api::class.java)
    }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

class ViewModel(val repo: Repo): ViewModel() {
    val items = MutableLiveData<ArrayList<Item>>()

    suspend fun load() {
        try {
            val ids = repo.api()
                .getTopStories()
                .take(20)

            val items = ids.map {
                repo.api().getStory(it)
            }
            this.items.value = items.toCollection(ArrayList())
        } catch (e: Exception) {
            this.items.value = arrayListOf()
        }
    }
}

Running parallel

The above run in serial. To run in parallel, we can use async

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

import kotlinx.coroutines.async
import kotlinx.coroutines.coroutineScope

class ViewModel(val repo: Repo): ViewModel() {
    val items = MutableLiveData<ArrayList<Item>>()

    suspend fun load() {
        try {
            val ids = repo.api()
                .getTopStories()
                .take(20)

            coroutineScope {
                val items = ids
                    .map { async { repo.api().getStory(it) } }
                    .awaitAll()

                this@ViewModel.items.value = items.toCollection(ArrayList())
            }

        } catch (e: Exception) {
            this.items.value = arrayListOf()
        }
    }
}

Parallel decomposition

https://medium.com/@elizarov/structured-concurrency-722d765aa952

With structured concurrency async coroutine builder became an extension on CoroutineScope just like launch did. You cannot simply write async { … } anymore, you have to provide a scope. A proper example of parallel decomposition becomes:

coroutineScope

https://proandroiddev.com/part-2-coroutine-cancellation-and-structured-concurrency-2dbc6583c07d

coroutineScope function can be used to create a custom scope that suspends and only completes when all coroutines launched within that scope complete. If any of the children coroutines within the coroutineScope throws an exception, all other running sibling coroutines gets cancelled and this exception is propagated up the hierarchy. If the parent coroutine at the top of the hierarchy does not handle this error, it will also be cancelled.

awaitAll

https://kotlin.github.io/kotlinx.coroutines/kotlinx-coroutines-core/kotlinx.coroutines/await-all.html

Awaits for completion of given deferred values without blocking a thread and resumes normally with the list of values when all deferred computations are complete or resumes with the first thrown exception if any of computations complete exceptionally including cancellation.

This function is not equivalent to deferreds.map { it.await() } which fails only when it sequentially gets to wait for the failing deferred, while this awaitAll fails immediately as soon as any of the deferreds fail.

This suspending function is cancellable. If the Job of the current coroutine is cancelled or completed while this suspending function is waiting, this function immediately resumes with CancellationException.

Read more

• https://jivimberg.io/blog/2018/05/04/parallel-map-in-kotlin/
• https://stackoverflow.com/questions/53535977/coroutines-runblocking-vs-coroutinescope
• awaitAll https://kotlin.github.io/kotlinx.coroutines/kotlinx-coroutines-core/kotlinx.coroutines/await-all.html

Issue #378

After having a generic RecyclerView, if we want to show multiple kinds of data in Fragment, we can use generic.

We may be tempted to use interface or protocol, but should prefer generic.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

class FeedFragment() : Fragment() {
    override fun onActivityCreated(savedInstanceState: Bundle?) {
        super.onActivityCreated(savedInstanceState)

        val mainViewModel: MainViewModel = ViewModelProviders.of(activity!!).get(MainViewModel::class.java)
        mainViewModel.resId.observe(viewLifecycleOwner, Observer {
            when (it) {
                R.id.gitHub -> { handleGitHub() }
                R.id.hackerNews -> { handleHackerNews() }
                R.id.reddit -> { handleReddit() }
                R.id.dev -> { handleDev() }
                R.id.productHunt -> { handleProductHunt() }
                else -> {}
            }
        })

        recyclerView.layoutManager = LinearLayoutManager(context)
    }
}

The difference between each kind are

• The type of model
• The type of Adapter
• How to observe from viewModel
• How to load from viewModel

Here we also use lifecycleScope from lifecycle runtime ktx

1

implementation "androidx.lifecycle:lifecycle-runtime-ktx:2.2.0-alpha01"

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

private fun <T> handle(
    makeResId: () -> Int,
    makeAdapter: () -> com.myapp.Adapter<T>,
    observe: ((ArrayList<T>) -> Unit) -> Unit,
    load: suspend () -> Unit
) {
    (activity as AppCompatActivity).toolbar.title = getString(makeResId())
    val adapter = makeAdapter()
    recyclerView.adapter = adapter
    observe {
        adapter.update(it)
    }
    fun doLoad() {
        viewLifecycleOwner.lifecycleScope.launch {
            progressBar.visibility = View.VISIBLE
            load()
            progressBar.visibility = View.GONE
            swipeRefreshLayout.isRefreshing = false
        }
    }
    doLoad()
    swipeRefreshLayout.setOnRefreshListener {
        doLoad()
    }
}

Then we just need to provide the required data

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

private fun handleDev() {
    val viewModel: com.myapp.ViewModel by viewModel()
    handle(
        { R.string.menu_dev },
        { com.myapp.Adapter(items = arrayListOf()) },
        { completion ->
            viewModel.items.observe(viewLifecycleOwner, Observer {
                completion(it)
            })
        },
        {
            viewModel.load()
        }
    )
}

Read more

• Use Kotlin coroutines with Architecture components

Issue #370

Define response model

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

import com.squareup.moshi.Json

data class Response(
    @field:Json(name="data") val data: ResponseData
)

data class ResponseData(
    @field:Json(name="posts") val posts: Posts
)

data class Posts(
    @field:Json(name="edges") val edges: List<Edge>
)

data class Edge(
    @field:Json(name="node") val node: Item
)

data class Item(
    @field:Json(name="id") val id: String,
    @field:Json(name="name") val name: String,
    @field:Json(name="url") val url: String,
    @field:Json(name="tagline") val tagline: String,
    @field:Json(name="featuredAt") val featuredAt: String,
    @field:Json(name="votesCount") val votesCount: Int,
    @field:Json(name="commentsCount") val commentsCount: Int,
    @field:Json(name="thumbnail") val thumbnail: Thumbnail
)

data class Thumbnail(
    @field:Json(name="url") val ur: String
)

Here is the query

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

{
  posts {
    edges {
      node {
        id
        name
        url
        tagline
        featuredAt
        votesCount
        commentsCount
        thumbnail {
          url
        }
      }
    }
  }
}

Here’s how request looks in Insomnia

1
2
3
4
5
6
7
8
9
10

> POST /v2/api/graphql HTTP/1.1
> Host: api.producthunt.com
> User-Agent: insomnia/6.6.2
> Cookie: __cfduid=d9a588136cbb286b156d8e4a873d52a301566795296
> Accept: application/json
> Content-Type: application/json
> Authorization: Bearer 068665d215cccad9123449841463b1248da07123418915a192a1233dedfd23b2
> Content-Length: 241

| {"query":"{\n  posts {\n    edges {\n      node {\n        id\n        name\n        url\n        tagline\n        featuredAt\n        votesCount\n        commentsCount\n        thumbnail {\n          url\n        }\n      }\n    }\n  }\n}"}

To post as json, need to use object for Moshi to convert

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

data class GetTopBody(
    @field:Json(name="query") val queryString: String
)

interface Api {
    @Headers(
        "Content-Type: application/json",
        "Accept: application/json",
        "Authorization: Bearer 068665d215cccad9123449841463b1248da07123418915a192a1233dedfd23b2",
        "Host: api.producthunt.com",
        "User-Agent: insomnia/6.6.2"
    )

    @POST("./")
    suspend fun getTop(
        @Body body: GetTopBody
    ): Response
}

And consume it in ViewModel. Use multiline string interpolation. No need to set contentLength

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35

class ViewModel(val repo: Repo): ViewModel() {
    val items = liveData {
        val queryString = """
{
    posts {
        edges {
            node {
                id
                name
                url
                tagline
                featuredAt
                votesCount
                commentsCount
                thumbnail {
                    url
                }
            }
        }
    }
}
        """.trimIndent()

        val body = GetTopBody(queryString)

        try {
            val response = repo.api().getTop(body)
            val items = response.data.posts.edges.map { it.node }
            emit(items.toCollection(ArrayList()))
        } catch (e: Exception) {
            emit(arrayListOf<Item>())
        }

    }
}

The response looks like

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36

{
  "data": {
    "posts": {
      "edges": [
        {
          "node": {
            "id": "158359",
            "name": "Toast",
            "url": "https://www.producthunt.com/posts/toast-2?utm_campaign=producthunt-api&utm_medium=api-v2&utm_source=Application%3A+PH+API+Explorer+%28ID%3A+9162%29",
            "tagline": "Organise tabs into organised sessions",
            "featuredAt": "2019-08-25T07:00:00Z",
            "votesCount": 318,
            "commentsCount": 16,
            "thumbnail": {
              "url": "https://ph-files.imgix.net/a169654a-850d-4b1c-80ba-be289f973fb7?auto=format&fit=crop"
            }
          }
        },
        {
          "node": {
            "id": "165621",
            "name": "Tree",
            "url": "https://www.producthunt.com/posts/tree-2?utm_campaign=producthunt-api&utm_medium=api-v2&utm_source=Application%3A+PH+API+Explorer+%28ID%3A+9162%29",
            "tagline": "Write documents in tree-like organisation with Markdown",
            "featuredAt": "2019-08-25T09:10:53Z",
            "votesCount": 227,
            "commentsCount": 11,
            "thumbnail": {
              "url": "https://ph-files.imgix.net/68b1f007-e630-4c79-8a27-756ec364343f?auto=format&fit=crop"
            }
          }
        }
      ]
    }
  }
}

Map

Instead of using an object, we can use Map. If using HashMap, I get

Unable to create @Body converter for java.util.HashMap<java.lang.String, java.lang.String>

1
2
3
4
5
6

@POST("./")
suspend fun getTop(
    @Body body: Map<String, String>
): Response

val body = mapOf("query" to queryString)

Troubleshooting

Use Network Profiler to inspect failure View > Tool Windows > Profiler

Read more

• Product Hunt API Docs https://api.producthunt.com/v2/docs
• API Explorer https://ph-graph-api-explorer.herokuapp.com/
• Posts http://api-v2-docs.producthunt.com.s3-website-us-east-1.amazonaws.com/object/post/
• https://stackoverflow.com/questions/21398598/how-to-post-raw-whole-json-in-the-body-of-a-retrofit-request

Issue #367

1

https://api.github.com/search/repositories?sort=stars&order=desc&q=language:javascript,java,swift,kotlin&q=created:>2019-08-21

1
2
3
4
5
6
7
8

interface Api {
    @GET("https://api.github.com/search/repositories")
    suspend fun getTrendingRepos(
        @Query("sort") sort: String,
        @Query("order") order: String,
        @Query("q") qs: List<String>
    ): Response
}

1
2
3
4
5
6
7
8
9
10

class Repo {
    fun api(): Api {
        return Retrofit.Builder()
            .baseUrl("https://api.github.com/")
            .addConverterFactory(MoshiConverterFactory.create())
            .build()
            .create(Api::class.java)
    }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

class ViewModel(val repo: Repo, val dateProvider: DateProvider): ViewModel() {
    val items = MutableLiveData<ArrayList<Item>>()

    suspend fun load() {
        try {
            val order = "desc"
            val sort = "star"

            val formatter = SimpleDateFormat("YYYY-MM-dd")
            val qs = listOf(
                "language:javascript,java,swift,kotlin",
                "q=created:>${formatter.format(dateProvider.yesterday)}"
            )

            val response = repo.api().getTrendingRepos(sort=sort, order=order, qs=qs)
            this.items.value = response.items.toCollection(ArrayList())
        } catch (e: Exception) {
            this.items.value = arrayListOf()
        }
    }
}

Issue #366

Code uses Retrofit 2.6.0 which has Coroutine support

app/build.gradle

1
2
3
4
5
6

implementation "androidx.lifecycle:lifecycle-livedata-ktx:2.2.0-alpha01"

implementation "com.squareup.moshi:moshi:$Version.moshi"

implementation "com.squareup.retrofit2:retrofit:$Version.retrofit"
implementation "com.squareup.retrofit2:converter-moshi:$Version.retrofit"

Api.kt

1
2
3
4
5
6

import retrofit2.http.GET

interface Api {
    @GET("api/articles")
    suspend fun getArticles(): List<Article>
}

Repo.kt

1
2
3
4
5
6
7
8
9
10
11
12

import retrofit2.Retrofit
import retrofit2.converter.moshi.MoshiConverterFactory

class Repo {
    fun get(): Api {
        return Retrofit.Builder()
            .baseUrl("https://dev.to")
            .addConverterFactory(MoshiConverterFactory.create())
            .build()
            .create(Api::class.java)
    }
}

ViewModel.kt

1
2
3
4
5
6
7
8
9

import androidx.lifecycle.ViewModel
import androidx.lifecycle.liveData
import kotlinx.coroutines.Dispatchers

class ViewModel(val repo: Repo): ViewModel() {
    val articles = liveData(Dispatchers.Main) {
        emit(repo.get().getArticles().toCollection(ArrayList()))
    }
}

Article.kt

1
2
3
4
5
6

import com.squareup.moshi.Json

data class Article(
    @field:Json(name="type_of") val typeOf: String,
    @field:Json(name="title") val title: String
)

Issue #363

ViewModels a simple example

https://medium.com/androiddevelopers/viewmodels-a-simple-example-ed5ac416317e

Rotating a device is one of a few configuration changes that an app can go through during its lifetime, including keyboard availability and changing the device’s language. All of these configuration changes cause the Activity to be torn down and recreated

The ViewModel class is designed to hold and manage UI-related data in a life-cycle conscious way. This allows data to survive configuration changes such as screen rotations.

The ViewModel exists from when the you first request a ViewModel (usually in the onCreate the Activity) until the Activity is finished and destroyed. onCreate may be called several times during the life of an Activity, such as when the app is rotated, but the ViewModel survives throughout.

Storing an Application context in a ViewModel is okay because an Application context is tied to the Application lifecycle. This is different from an Activity context, which is tied to the Activity lifecycle. In fact, if you need an Application context, you should extend AndroidViewModel which is simply a ViewModel that includes an Application reference.

The first time the ViewModelProviders.of method is called by MainActivity, it creates a new ViewModel instance. When this method is called again, which happens whenever onCreate is called, it will return the pre-existing ViewModel associated with the specific Court-Counter MainActivity

1

ViewModelProviders.of(<THIS ARGUMENT>).get(ScoreViewModel.class);

This allows you to have an app that opens a lot of different instances of the same Activity or Fragment, but with different ViewModel information

Dive deep into Android’s ViewModel — Android Architecture Components

https://android.jlelse.eu/dive-deep-into-androids-viewmodel-android-architecture-components-e0a7ded26f70

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

/**
 * Utilities methods for {@link ViewModelStore} class.
 */
public class ViewModelProviders {
/**
     * Creates a {@link ViewModelProvider}, which retains ViewModels while a scope of given Activity
     * is alive. More detailed explanation is in {@link ViewModel}.
     * <p>
     * It uses {@link ViewModelProvider.AndroidViewModelFactory} to instantiate new ViewModels.
     *
     * @param activity an activity, in whose scope ViewModels should be retained
     * @return a ViewModelProvider instance
     */
    @NonNull
    @MainThread
    public static ViewModelProvider of(@NonNull FragmentActivity activity) {
        ViewModelProvider.AndroidViewModelFactory factory =
                ViewModelProvider.AndroidViewModelFactory.getInstance(
                        checkApplication(activity));
        return new ViewModelProvider(ViewModelStores.of(activity), factory);
    }
  
 }

It seems like ViewModelProviders.of is just a factory of ViewModelProvider, which depends upon ViewModelFactory and a ViewModelStore.

1
2

MyViewModelFactory factory = new MyViewModelFactory(data1, data2);
ViewModelProviders.of(this, factory).get(MyViewModel.class);

1
2
3

public class ViewModelStore {
    private final HashMap<String, ViewModel> mMap = new HashMap<>();
}

HolderFragment

HolderFragment is a regular Android Headless Fragment. It is the scope where all ViewModels inside the ViewModelStore will live.

1
2
3
4
5

public class HolderFragment extends Fragment implements ViewModelStoreOwner {
    private static final HolderFragmentManager sHolderFragmentManager = new HolderFragmentManager();
    private ViewModelStore mViewModelStore = new ViewModelStore();
}

1
2
3
4

static class HolderFragmentManager {
    private Map<Activity, HolderFragment> mNotCommittedActivityHolders = new HashMap<>();
    private Map<Fragment, HolderFragment> mNotCommittedFragmentHolders = new HashMap<>();
}

Who owns the HolderFragment?

The HolderFragment has an inner static class named HolderFragmentManager. The HolderFragmentManager creates and manages HolderFragment instances.
After creating the instances it associates them with an Activity or Fragment.

The whole process is done using the methods holderFragmentFor(Activity) and holderFragmentFor(Fragment).

How does HolderFragment retains the state ?

By setting retain instance to true and not providing a view, the HolderFragment becomes essentially a headless Fragment that is retained for as long as the Activity is not destroyed.

1
2
3

public HolderFragment() {
   setRetainInstance(true);
}

void setRetainInstance (boolean retain)

Control whether a fragment instance is retained across Activity re-creation (such as from a configuration change). This can only be used with fragments not in the back stack. If set, the fragment lifecycle will be slightly different when an activity is recreated:

Retrieving ViewModel instance

1

get(MyViewModel.class)

It tries to retrieve a MyViewModel instance from the store. If none is there, it uses the factory to create it and then stores it into HashMap<String, ViewModel>. In order to retrieve the already created ViewModel, it generates a key from the class qualified name.

Issue #359

app/build.gradle

1
2
3

implementation "org.koin:koin-core:$Version.koin"
implementation "org.koin:koin-androidx-scope:$Version.koin"
implementation "org.koin:koin-androidx-viewmodel:$Version.koin"

MyApplication.kt

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

import android.app.Application
import org.koin.android.ext.koin.androidContext
import org.koin.android.ext.koin.androidLogger
import org.koin.androidx.viewmodel.dsl.viewModel
import org.koin.core.context.startKoin
import org.koin.dsl.module

class MyApplication: Application() {
    var appModule = module {
        single { MyRepo() }
        viewModel { MyViewModel(get()) }
    }

    override fun onCreate() {
        super.onCreate()

        startKoin {
            androidLogger()
            androidContext(this@MyApplication)
            modules(appModule)
        }
    }
}

MyFragment.kt

1
2
3

import org.koin.androidx.viewmodel.ext.android.viewModel

val viewModel: MyViewModel by viewModel()

Issue #358

app/build.gradle

1

implementation "androidx.lifecycle:lifecycle-livedata-ktx:2.2.0-alpha01"

1
2
3
4
5
6
7
8
9
10
11
12
13

import androidx.lifecycle.ViewModel
import androidx.lifecycle.liveData
import kotlinx.coroutines.Dispatchers

class MainViewModel : ViewModel() {
    val repository: TodoRepository = TodoRepository()

    val firstTodo = liveData(Dispatchers.IO) {
        val retrivedTodo = repository.getTodo(1)

        emit(retrivedTodo)
    }
}

Use coroutines with LiveData

https://developer.android.com/topic/libraries/architecture/coroutines

The liveData building block serves as a structured concurrency primitive between coroutines and LiveData. The code block starts executing when LiveData becomes active and is automatically canceled after a configurable timeout when the LiveData becomes inactive.

Source code

https://android.googlesource.com/platform/frameworks/support/+/androidx-master-dev/lifecycle/lifecycle-livedata-ktx/src/main/java/androidx/lifecycle/CoroutineLiveData.kt
https://android.googlesource.com/platform/frameworks/support/+/androidx-master-dev/lifecycle/lifecycle-livedata-ktx/src/main/java/androidx/lifecycle/FlowLiveData.kt

CoroutineLiveData.kt

1
2
3
4
5
6

@UseExperimental(ExperimentalTypeInference::class)
fun <T> liveData(
    context: CoroutineContext = EmptyCoroutineContext,
    timeoutInMs: Long = DEFAULT_TIMEOUT,
    @BuilderInference block: suspend LiveDataScope<T>.() -> Unit
): LiveData<T> = CoroutineLiveData(context, timeoutInMs, block)

a LiveData that tries to load the User from local cache first and then tries from the server and also yields the updated value

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

val user = liveData {
 	// dispatch loading first
 	emit(LOADING(id))
 	// check local storage
 	val cached = cache.loadUser(id)

 	if (cached != null) {
    	emit(cached)
 	}

 	if (cached == null || cached.isStale()) {
    	val fresh = api.fetch(id) // errors are ignored for brevity
     	cache.save(fresh)
     	emit(fresh)
    }
}

Read more

• Suspend what you’re doing: Retrofit has now Coroutines support!
• Exploring new Coroutines and Lifecycle Architectural Components integration on Android
• Coroutine in Android: Working with Lifecycle

Issue #357

generic/Adapter.kt

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

package com.onmyway133.generic

import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import androidx.recyclerview.widget.RecyclerView

abstract class Adapter<T>(var items: ArrayList<T>): RecyclerView.Adapter<RecyclerView.ViewHolder>() {
    abstract fun configure(item: T, holder: ViewHolder)

    fun update(items: ArrayList<T>) {
        this.items = items
        notifyDataSetChanged()
    }

    override fun getItemCount(): Int = items.count()

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): RecyclerView.ViewHolder {
        val view = LayoutInflater
            .from(parent.context)
            .inflate(viewType, parent, false)
        return ViewHolder(view)
    }

    override fun onBindViewHolder(holder: RecyclerView.ViewHolder, position: Int) {
        configure(items[position], holder as ViewHolder)
    }

}

class ViewHolder(view: View): RecyclerView.ViewHolder(view) {}

hero/HeroAdapter.kt

1
2
3
4
5
6
7
8
9
10
11
12
13

package com.onmyway133.hero
import kotlinx.android.synthetic.main.hero_item_view.view.*

class Adapter(items: ArrayList<Hero>): com.onmyway133.generic.Adapter<Hero>(items) {
    override fun configure(item: Hero, holder: ViewHolder) {
        holder.itemView.titleLabel.text = item.name
        holder.itemView.descriptionLabel.text = item.description
    }

    override fun getItemViewType(position: Int): Int {
        return R.layout.hero_item_view
    }
}

May run into https://stackoverflow.com/questions/49512629/default-interface-methods-are-only-supported-starting-with-android-n

app/build.gradle

1
2
3
4
5
6

android {
    compileOptions {
        sourceCompatibility JavaVersion.VERSION_1_8
        targetCompatibility JavaVersion.VERSION_1_8
    }
}

Issue #351

From Gradle tips and recipes, Configure project-wide properties

For projects that include multiple modules, it might be useful to define properties at the project level and share them across all modules. You can do this by adding extra properties to the ext block in the top-level build.gradle file.

1
2
3
4
5

ext {
    navigationVersion = "2.0.0"
}

rootProject.ext.navigationVersion

Versions are used mostly in dependencies block so having them defined in global ext is not quite right. We can use def to define variables

1
2
3
4

dependencies {
    def navigationVersion = "2.0.0"
    implementation "androidx.navigation:navigation-fragment-ktx:$navigationVersion"
}

For better namespacing, we can use a class

1
2
3
4
5
6
7
8
9
10

class Version {
    static def navigation = "2.0.0"
    static def drawerLayout = "1.0.0"
    static def koin = "2.0.1"
    static def moshi = "1.8.0"
}

dependencies {
    implementation "androidx.navigation:navigation-fragment-ktx:$Version.navigation"
}

Issue #349

build.gradle

1
2
3

dependencies {
    classpath 'android.arch.navigation:navigation-safe-args-gradle-plugin:1.0.0-alpha05'
}

app/build.gradle

1
2
3
4
5
6
7
8
9
10

apply plugin: 'androidx.navigation.safeargs'

dependencies {
    def navigationVersion = "2.0.0"
    def drawerLayoutVersion = "1.0.0"

    implementation "androidx.drawerlayout:drawerlayout:$drawerLayoutVersion"
    implementation "androidx.navigation:navigation-fragment-ktx:$navigationVersion"
    implementation "androidx.navigation:navigation-ui-ktx:$navigationVersion"
}

main_activity.xml

• Use CoordinatorLayout and ToolBar
• Define layout_gravity for NavigationView

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37

<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.widget.DrawerLayout
    android:layout_height="match_parent"
    android:layout_width="match_parent"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/drawerLayout"
    tools:context=".MainActivity">

    <androidx.coordinatorlayout.widget.CoordinatorLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <com.google.android.material.appbar.AppBarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
            <androidx.appcompat.widget.Toolbar
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:id="@+id/toolbar"/>
        </com.google.android.material.appbar.AppBarLayout>
        <fragment
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:id="@+id/hostFragment"
            android:name="androidx.navigation.fragment.NavHostFragment"
            app:defaultNavHost="true"
            app:navGraph="@navigation/navigation_graph"/>
    </androidx.coordinatorlayout.widget.CoordinatorLayout>
    <com.google.android.material.navigation.NavigationView
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:id="@+id/navigationView"
        android:fitsSystemWindows="true"
        android:layout_gravity="start"
        app:menu="@menu/drawer_menu"/>
</androidx.drawerlayout.widget.DrawerLayout>

navigation/navigation_graph.xml

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

<?xml version="1.0" encoding="utf-8"?>
<navigation xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/navigationGraph"
    xmlns:tools="http://schemas.android.com/tools"
    app:startDestination="@id/aboutFragment">
    <fragment
        android:id="@+id/aboutFragment"
        android:name="com.onmyway133.whatsupintech.AboutFragment"
        android:label="@string/menu_about"
        tools:layout="@layout/about_fragment" />
    <fragment
        android:id="@+id/feedFragment"
        android:name="com.onmyway133.whatsupintech.FeedFragment"
        android:label="@string/menu_git_hub"
        tools:layout="@layout/feed_fragment" />
    <fragment
        android:id="@+id/webFragment"
        android:name="com.onmyway133.whatsupintech.WebFragment"
        tools:layout="@layout/web_fragment"/>
</navigation>

menu/drawer_menu.xml

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
      android:layout_width="match_parent"
      android:layout_height="match_parent">
    <group android:checkableBehavior="single">
        <item
            android:id="@+id/about"
            android:title="@string/menu_about" />
        <item
            android:id="@+id/hackerNews"
            android:title="@string/menu_hacker_news" />
        <item
            android:id="@+id/reddit"
            android:title="@string/menu_reddit" />
        <item
            android:id="@+id/dev"
            android:title="@string/menu_dev" />
        <item
            android:id="@+id/gitHub"
            android:title="@string/menu_git_hub" />
    </group>
</menu>

MainActivity.kotlin

• Use AppBarConfiguration to define multiple top level destinations
• Convert Toolbar to ActionBar

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55

package com.onmyway133.whatsupintech

import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity;
import androidx.core.view.GravityCompat
import androidx.navigation.findNavController
import androidx.navigation.ui.AppBarConfiguration
import androidx.navigation.ui.navigateUp
import androidx.navigation.ui.setupActionBarWithNavController
import androidx.navigation.ui.setupWithNavController
import kotlinx.android.synthetic.main.main_activity.*

class MainActivity : AppCompatActivity() {

    lateinit var appBarConfig: AppBarConfiguration

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.main_activity)
        setupNavigationController()
    }

    fun setupNavigationController() {
        val navigationController = findNavController(R.id.hostFragment)

        setSupportActionBar(toolbar)

        appBarConfig = AppBarConfiguration(setOf(R.id.aboutFragment, R.id.feedFragment), drawerLayout)
        setupActionBarWithNavController(navigationController, appBarConfig)
        navigationView.setupWithNavController(navigationController)
        navigationView.setNavigationItemSelectedListener { menuItem ->
            drawerLayout.closeDrawers()
            menuItem.isChecked = true
            when (menuItem.itemId) {
                R.id.about -> navigationController.navigate(R.id.aboutFragment)
                R.id.gitHub, R.id.reddit, R.id.hackerNews, R.id.dev -> navigationController.navigate(R.id.feedFragment)
            }

            true
        }
    }

    override fun onSupportNavigateUp(): Boolean {
        val navigationController = findNavController(R.id.hostFragment)
        return navigationController.navigateUp(appBarConfig) || super.onSupportNavigateUp()
    }

    override fun onBackPressed() {
        if (drawerLayout.isDrawerOpen(GravityCompat.START)) {
            drawerLayout.closeDrawer(GravityCompat.START)
        } else {
            return super.onBackPressed()
        }
    }
}

Update UI components with NavigationUI

Tie destinations to menu items

NavigationUI also provides helpers for tying destinations to menu-driven UI components. NavigationUI contains a helper method, onNavDestinationSelected(), which takes a MenuItem along with the NavController that hosts the associated destination. If the id of the MenuItem matches the id of the destination, the NavController can then navigate to that destination.

Add a navigation drawer

The drawer icon is displayed on all top-level destinations that use a DrawerLayout. Top-level destinations are the root-level destinations of your app. They do not display an Up button in the app bar.

Read more

• Android Navigation TypeSafe Arguments Gradle Plugin
• Get started with the Navigation component
• Conditional navigation
• Navigation Drawer with New JetPacks Navigation Component

Issue #338

Gradle uses Groovy and it has ext, also known as ExtraPropertiesExtension

Additional, ad-hoc, properties for Gradle domain objects.

Extra properties extensions allow new properties to be added to existing domain objects. They act like maps, allowing the storage of arbitrary key/value pairs. All ExtensionAware Gradle domain objects intrinsically have an extension named “ext” of this type.

1
2
3
4
5
6
7
8
9

project.ext {
  myprop = "a"
}
assert project.myprop == "a"
assert project.ext.myprop == "a"

project.myprop = "b"
assert project.myprop == "b"
assert project.ext.myprop == "b"

In root build.gradle, ext adds extra property to rootProject object. There we can access rootProject.ext or just ext

1
2
3

ext {
  myLibraryVersion = '1.0.0'
}

In module app/build.gradle, ext adds extra property to project object. There we can access project.ext or just ext

1
2
3

ext {
  myLibraryVersion = '1.0.0'
}

Issue #316

• Browsers and devices used in 2018
• AppStore measurement

Issue #285

kts

settings.gradle.kts

1

include(":app")

build.gradle.kts

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88

import org.gradle.kotlin.dsl.apply
import org.gradle.kotlin.dsl.dependencies
import org.gradle.kotlin.dsl.kotlin
import org.gradle.kotlin.dsl.*
import org.jetbrains.kotlin.config.KotlinCompilerVersion

plugins {
    id("com.android.application")
    kotlin("android")
    kotlin("android.extensions")
}

//apply {
//    from("$rootDir/tools/grgit.gradle")
//    from("$rootDir/buildSrc/quality.gradle.kts")
//    from("$rootDir/tools/ktlint.gradle")
//    from("$rootDir/tools/detekt.gradle")
//}

android {
    compileSdkVersion(28)
    flavorDimensions("default")

    defaultConfig {
        applicationId = "com.onmyway133.myapp"
        minSdkVersion(26)
        targetSdkVersion(28)
//        versionCode = ext.get("gitCommitCount") as? Int
        versionCode = 1
        versionName = "1.0"
        testInstrumentationRunner = "androidx.test.runner.AndroidJUnitRunner"
    }

    signingConfigs {
        create("release") {
            keyAlias = "keyalias"
            keyPassword = "keypassword"
            storePassword = "storepassword"
            storeFile = file("/Users/khoa/Android/Key/keystore")
        }
    }

    buildTypes {
        getByName("debug") {
            signingConfig = signingConfigs.getByName("debug")
            isMinifyEnabled = true
            proguardFiles(getDefaultProguardFile("proguard-android-optimize.txt"), "$project.rootDir/tools/proguard-rules-debug.pro")
        }

        getByName("release") {
            signingConfig = signingConfigs.getByName("release")
            isMinifyEnabled = true
            isShrinkResources = true
            proguardFiles(getDefaultProguardFile("proguard-android-optimize.txt"), "$project.rootDir/tools/proguard-rules.pro")
        }
    }

    productFlavors {
        create("staging") {

        }

        create("production") {

        }
    }

    lintOptions {
        lintConfig = file("$project.rootDir/tools/lint-rules.xml")
        htmlOutput = file("$project.buildDir/outputs/lint/lint.html")
        xmlReport = false
        htmlReport = true
    }
}

dependencies {
    implementation(fileTree(mapOf("dir" to "libs", "include" to listOf("*.jar"))))
    implementation(kotlin("stdlib-jdk7", KotlinCompilerVersion.VERSION))
    implementation("androidx.appcompat:appcompat:1.0.2")
    implementation("androidx.core:core-ktx:1.0.2")
    implementation("androidx.constraintlayout:constraintlayout:1.1.3")
    implementation("com.google.android.material:material:1.0.0")
    testImplementation("junit:junit:4.12")
    androidTestImplementation("androidx.test:runner:1.1.1")
    androidTestImplementation("androidx.test.espresso:espresso-core:3.1.1")
}

tasks.getByName("check").dependsOn("lint")

tools/quality.gradle.kts

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55

plugins {
    id("findbugs")
    id("pmd")
    id("checkstyle")
}

tasks {
    val findbugs by registering(FindBugs::class) {
        ignoreFailures = false
        effort = "max"
        reportLevel = "low"
        classes = files("$project.buildDir/intermediates/javac")

        setExcludeFilter(file("$rootProject.rootDir/tools/findbugs-exclude.xml"))

        source = fileTree("src/main/java/")
        classpath = files()

        reports {
            xml.isEnabled = false
            html.isEnabled = true
            html.destination = file("$project.buildDir/outputs/findbugs/findbugs-output.html")
        }
    }

    val pmd by registering(Pmd::class) {
        ruleSetFiles = files("${project.rootDir}/tools/pmd-rules.xml")
        ignoreFailures = false
        ruleSets = listOf<String>()

        fileTree()
        source(fileTree(baseDir = "src/main/java"))
        include("**/*.kt")
        exclude("**/gen/**")

        reports {
            xml.isEnabled = false
            html.isEnabled = true
            html.destination = file("$project.buildDir/outputs/pmd/pmd.html")
        }
    }

    val checkstyle by registering(Checkstyle::class) {
        description = "Check code standard"
        group = "verification"

        configFile = file("$project.rootDir/tools/checkstyle.xml")
        source(fileTree(baseDir = "src"))
        include("**/*.kt")
        exclude("**/gen/**")

        classpath = files()
        ignoreFailures = false
    }
}

Reference

• https://guides.gradle.org/migrating-build-logic-from-groovy-to-kotlin
• https://github.com/gradle/kotlin-dsl/blob/master/samples/hello-android/app/build.gradle.kts

About Gradle

• Understanding Android Gradle build files
• Configure your build

Issue #273

Original post https://hackernoon.com/using-bitrise-ci-for-android-apps-fa9c48e301d8

CI, short for Continuous Integration, is a good practice to move fast and confidently where code is integrated into shared repository many times a day. The ability to have pull requests get built, tested and release builds get distributed to testers allows team to verify automated build and identify problems quickly.

I ‘ve been using BuddyBuild for both iOS and Android apps and were very happy with it. The experience from creating new apps and deploying build is awesome. It works so well that Apple acquired it, which then lead to the fact that Android apps are no longer supported and new customers can’t register.

We are one of those who are looking for new alternatives. We’ve been using TravisCI, CircleCI and Jenkins to deploy to Fabric. There is also TeamCity that is promising. But after a quick survey with friends and people, Bitrise is the most recommended. So maybe I should try that.

The thing I like about Bitrise is its wide range support of workflow. They are just scripts that execute certain actions, and most of them are open source. There’s also yml config file, but all things can be done using web interface, so I don’t need to look into pages of documentation just to get the configuration right.

This post is not a promote for Bitrise, it is just about trying and adapting to new things. There is no eternal thing in tech, things come ad go fast. Below are some of the lessons I learn after using Bitrise, hope you find them useful.

Variant to build

There is no Android Build step in the default ‘primary’ workflow, as primary is generally used for testing the code for every push. There is an Android Build step in the deploy workflow and the app gets built by running this workflow. However, I like to have the Android Build step in my primary workflow, so I added it there.

Usually I want app module and stagingRelease build variant as we need to deploy staging builds to internal testers.

If you go to Bitrise.yml tab you can see that the configuration file has been updated. This is very handy. I’ve used some other CI services and I needed to lookup their documentation on how to make this yml work.

Bump version code automatically

I’ve used some other CI services before and the app version code surely does not start from 0. So it makes sense that Bitrise can auto bump version code from the current number. There are some predefined steps in Workflow but they don’t serve my need

For the Set Android Manifest Version code and name step, the source code is here so I understand what it does. It works by modify AndroidManifest.xml file using sed . This article Adjust your build number is not clear enough.

sed -i.bak “s/android:versionCode=”\”${VERSIONCODE}\””/android:versionCode=”\”${CONFIG_new_version_code}\””/” ${manifest_file}

In our projects, the versionCode is from an environment variable BUILD_NUMBER in Jenkins, so we need look up the same thing in Available Environment Variables, and it is BITRISE_BUILD_NUMBER , which is a build number of the build on bitrise.io.

This is how versionCode looks like in build.gradle

versionCode (System.*getenv*("BITRISE_BUILD_NUMBER") as Integer ?: System.*getenv*("BUILD_NUMBER") as Integer ?: 243)

243 is the current version code of this project, so let’s go to app’s Settings and change Your next build number will be

Deploy to Fabric

I hope Bitrise has its own Crash reporting tool. For now I use Crashlytics in Fabric. And despite that Bitrise can distribute builds to testers, I still need to cross deploy to Fabric for historial reasons.

There is only script steps-fabric-crashlytics-beta-deploy to deploy IPA file for iOS apps, so we need something for Android. Fortunately I can use the Fabric plugin for gradle.

Add Fabric plugin

Follow Install Crashlytics via Gradle to add Fabric plugin. Basically you need to add these dependencies to your app ‘s build.gradle

buildscript {
    repositories {
        google()
        maven { url 'https://maven.fabric.io/public' }
    }

    dependencies {
        classpath 'io.fabric.tools:gradle:1.+'
    }
}

apply plugin: 'io.fabric'

dependencies {
    compile('com.crashlytics.sdk.android:crashlytics:2.9.4@aar') {
        transitive = true;
    }
}

and API credentials in Manifest file

<meta-data
 android:name=”io.fabric.ApiKey”
 android:value=”67ffdb78ce9cd50af8404c244fa25df01ea2b5bc”
 />

Deploy command

Modern Android Studio usually includes a gradlew execution file in the root of your project. Run ./gradlew tasks for the list of tasks that you app can perform, look for Build tasks that start with assemble . Read more Build your app from the command line

You can execute all the build tasks available to your Android project using the Gradle wrapper command line tool. It’s available as a batch file for Windows (gradlew.bat) and a shell script for Linux and Mac (gradlew.sh), and it’s accessible from the root of each project you create with Android Studio.

For me, I want to deploy staging release build variant, so I run. Check that the build is on Fabric.

./gradlew assembleStagingRelease crashlyticsUploadDistributionStagingRelease

Manage tester group

Go to your app on Fabric.io and create group of testers. Note that alias that is generated for the group

Go to your app’s build.gradle and add ext.betaDistributionGroupAliases=’my-internal-testers’ to your desired productFlavors or buildTypes . For me I add to staging under productFlavors

productFlavors {
   staging {
     // …
     ext.betaDistributionGroupAliases=’hyper-internal-testers-1'
   }
   production {
     // …
   }
}

Now that the command is run correctly, let’s add that to Bitrise

Gradle Run step

Go to Workflow tab and add a Gradle Run step and place it below Deploy to Bitrise.io step.

Expand Config, and add assembleStagingRelease crashlyticsUploadDistributionStagingRelease to Gradle task to run .

Now start a new build in Bitrise manually or trigger new build by making pull request, you can see that the version code is increased for every build, crossed build gets deployed to Fabric to your defined tester groups.

As an alternative, you can also use Fabric/Crashlytics deployer, just update config with your apps key and secret found in settings.

Where to go from here

I hope those tips are useful to you. Here are some more links to help you explore further

• Convert old Android workflows and configure new steps based on the old Gradle tasks on Bitrise

• Replace whole line containing a string using Sed

• Alternatives to Buddybuild?

• Simplifying Android app distribution with Beta by Crashlytics

• Fabric app for Android Studio

• Crashlytics distribution for app with multiple flavors

• Gradle plugins

• Setting up a new app in Crashlytics without the IDE plugin

Issue #257

checkstyle (Java)

• http://checkstyle.sourceforge.net/
• https://github.com/checkstyle/checkstyle

Checkstyle is a development tool to help programmers write Java code that adheres to a coding standard. It automates the process of checking Java code to spare humans of this boring (but important) task. This makes it ideal for projects that want to enforce a coding standard.

app/build.gradle

1
2
3
4
5
6
7
8
9
10
11
12
13
14

apply plugin: 'checkstyle'

task checkstyle(type: Checkstyle) {
    description 'Check code standard'
    group 'verification'

    configFile file('$project.rootDir/tools/checkstyle.xml')
    source 'src'
    include '**/*.kt'
    exclude '**/gen/**'

    classpath = files()
    ignoreFailures = false
}

tools/chekcstyle

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26

<?xml version="1.0"?><!DOCTYPE module PUBLIC
        "-//Puppy Crawl//DTD Check Configuration 1.2//EN"
        "http://www.puppycrawl.com/dtds/configuration_1_2.dtd">
<module name="Checker">
    <module name="FileTabCharacter"/>
    <module name="TreeWalker">

        <!-- Checks for Naming Conventions                            -->
        <!-- See http://checkstyle.sourceforge.net/config_naming.html -->
        <module name="MethodName"/>
        <module name="ConstantName"/>

        <!-- Checks for Imports                                 -->
        <!-- See http://checkstyle.sourceforge.net/config_imports.html-->
        <module name="AvoidStarImport"/>
        <module name="UnusedImports"/>

        <!-- Checks for Size                                          -->
        <!-- See http://checkstyle.sourceforge.net/config_sizes       -->
        <module name="ParameterNumber">
            <property name="max" value="6"/>
        </module>

        <!-- other rules ignored for brevity -->
    </module>
</module>

findbugs (Java)

• http://findbugs.sourceforge.net/

A program which uses static analysis to look for bugs in Java code

app/build.gradle

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

apply plugin: 'findbugs'

task findbugs(type: FindBugs) {
    ignoreFailures = false
    effort = "max"
    reportLevel = "low"
    classes = files("$project.buildDir/intermediates/javac")

    excludeFilter = file("$rootProject.rootDir/tools/findbugs-exclude.xml")

    source = fileTree('src/main/java/')
    classpath = files()

    reports {
        xml.enabled = false
        html.enabled = true
        html.destination file("$project.buildDir/outputs/findbugs/findbugs-output.html")
    }
}