Built with Android Studio and Kotlin.
Build an invoicing app with Android Studio and Kotlin. Let's get started!. Open Android Studio, select the following.
Be sure to use Kotlin
and androidx
.
Android Studio should open content_main.xml
, and it should look like this. If not, switch from Design
mode to Text
mode using the bottom tab.
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
tools:context=".MainActivity"
tools:showIn="@layout/activity_main">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
We can delete the TextView
and replace it with this.
<androidx.recyclerview.widget.RecyclerView
android:layout_width="0dp"
android:layout_height="0dp" />
Because we're using ConstraintLayout
we need to specify 0dp
for both the layout_width
and layout_height
. Then we should constraint it.
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
tools:context=".MainActivity"
tools:showIn="@layout/activity_main">
<androidx.recyclerview.widget.RecyclerView
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
Now we're nearly done with this RecycleView
. Let's give it an id
.
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/listOfInvoices"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
Next, let's create a data
class. Right click on com.example.myinvoicing
(or whatever you named it) and choose New Kotlin File/Class.
Name it Invoice
and set it's Kind
to Class
.
Replace it with the following data class
.
package com.example.myinvoicing
data class Invoice(
val id: Int,
val title: String,
val text: String,
val author: String
)
Open MainActivity.kt
and remove everything except this.
package com.example.myinvoicing
import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import kotlinx.android.synthetic.main.activity_main.*
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
setSupportActionBar(toolbar)
}
}
Inside onCreate
, add this line.
val invoices = listOf(
Invoice(0, "Pool Repair", "Invoice for repairing your pool.", "Daniel Malone")
)
The entire file should now look like this.
package com.example.myinvoicing
import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import kotlinx.android.synthetic.main.activity_main.*
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
setSupportActionBar(toolbar)
val invoices = listOf(
Invoice(0, "Pool Repair", "Invoice for repairing your pool.", "Daniel Malone")
)
}
}
Now we need to connect the RecyclerView
from our XML to our Kotlin code. Add this below the above code.
listOfInvoices.apply {
layoutManager = LinearLayoutManager(this@MainActivity)
adapter = InvoicesAdapter(invoices)
}
Note that InvoicesAdapter
might be red, indicating there is a coding error. We'll fix that now. Create a new Kotlin class the same way we created it before, by right clicking on com.example.myinvoicing
on the left side of the screen.
Alert tutorial.
Material Design.
Stroke it.
Create beautiful buttons in XML.
Built with Android Studio and Kotlin.
Getting started is sometimes the hardest part.
Add a click listener in Kotlin.
Let users sign in.
It always begins with registration.