Forem: Inspire Coding

Android - Custom Toast with Kotlin extension function

Inspire Coding — Tue, 17 Nov 2020 14:41:01 +0000

In this short tutorial I'm going to show you how you can customize your Toast messages using Kotlin extension function.

Step 1: Create a new project

First of all, create a new Android Studio project.

Step 2: Create a layout

The second step is to create a very simple layout. In our case it will contain only an EditText and a Button.

Copy and paste the below code into the activity_main.xml file.

activity_main.xml

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

    <EditText
        android:id="@+id/et_message"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textAlignment="center"
        android:layout_margin="24dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintVertical_bias="0.3"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent" />

    <Button
        android:id="@+id/btn_customToast"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="24dp"
        android:text="Custom Toast"
        app:layout_constraintTop_toBottomOf="@+id/btn_defaultToast"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"/>

</androidx.constraintlayout.widget.ConstraintLayout>

Step 3: Create an icon

Our Toast message will have an icon as well. So, create a checkmark with the below detailes into the drawable folder.

Search for done to find the icon
Create a color in the colors.xml file with the name of green: #78C257

Step 4: Create a shape

The custom Toast message will have

a green border
a light green background
and rounded corners

So, create a new shape in the drawable folder and paste into it the below lines.

shape_roundedcorners

<?xml version="1.0" encoding="utf-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android">

    <solid
        android:color="@color/light_green"/>
    <corners
        android:radius="18dp"/>
    <stroke
        android:color="@color/green"
        android:width="3dp"/>

</shape>

The Hex-code for the light_green color: #B9D7AC

Step 5: Create the layout

The next is to create the custom layout for the Toast message. So, create a new layout file in the res > layout folder with the name of custom_toast. Then paste into it the below lines.

custom_toast

<LinearLayout
    android:id="@+id/cl_customToastContainer"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:padding="12dp"
    android:orientation="horizontal"
    android:gravity="center"
    android:background="@drawable/shape_roundedcorners">

    <ImageView
        android:id="@+id/iv_done"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_done_green" />

    <TextView
        android:id="@+id/tv_message"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Mission Completed"
        android:textColor="@color/green"
        android:layout_marginStart="6dp" />

</LinearLayout>

Step 6: Create the extension function

In this step first, we have to create a new package and file.

New Package: util
New file: ViewExt.kt

Copy and paste the below code into the new ViewExt.kt file

Extension function of custom Toast 

fun Toast.showCustomToast(message: String, activity: Activity)
{
    val layout = activity.layoutInflater.inflate (
        R.layout.custom_toast,
        activity.findViewById(R.id.cl_customToastContainer)
    )

    val textView = layout.findViewById<TextView>(R.id.tv_message)
    textView.text = message

    this.apply {
        setGravity(Gravity.BOTTOM, 0, 40)
        duration = Toast.LENGTH_LONG
        view = layout
        show()
    }
}

Notes

Using the LayoutInflater we gonna make instance about the layout
Set the text of the TextView
Then we can call the apply scope function to set the gravity, the duration and the view.

Step 7: Set the click listener

The last step is to show our custom Toast message when we click on the Button. So, open the MainActivity and paste the below code into the onCreate() method.


btn_customToast 

btn_customToast.setOnClickListener {_button ->
    Toast(this).showCustomToast (
        et_message.text.toString().trim(),
        this
    )
}

Run the app

Run and test the app. ;)

More detailes

The whole tutorial is available on my website

Custom Toast - Inspire Coding - Android development in Kotlin

And you can check the source code on GitHub as well.

GitHub

`Have a nice day :)`

Android MotionLayout – Clearing weather

Inspire Coding — Mon, 16 Nov 2020 16:51:56 +0000

In this tutorial we are going to build up a simple clearing weather animation using MotionLayout.

This animation will contain a changing background color, and 2 moving clouds, which are going to move out to the left and right of the screen.

We are going to implement a click listener also. It means, the animation will start only when we click on it.

When the animation is started and finished, then we gonna show a Toast message. So, we gonna learn how to add events to the states of the Transition as well.

Android WeatherApp Course

This tutorial is part of my WeatherApp course. In this course you can build up a whole application using the OpenWeatherMaps API.
If you would like to do this course, then you can find it under the link: Android WeatherApp course

MotionLayout

MotionLayout is a layout type, where we can animate the views inside of a layout. Because MotionLayout is the subclass of ConstraintLayout, we can use all of its cool features.

In a MotionLayout we can animate not only the transitions between the layouts, we can either animate the layout properties as well.

And one more awesome thing, that we can handle events like click and swipe also. Using this feature we can build up much better user interfaces to reach better user experiences.

MotionLayout uses XML to declare the transitions no matter how complex it is.

Step 1 – Create new project

Our first step is to create a whole new project. For this, launch Android Studio. If you see the “Welcome page”, then click on the “Start a new Android Studio project”. If you have an open project, then from the “File” menu select “New”, then “New Project”. After thet, this window will popup.

Here select the “Empty Activity” option. In the next window, we should provide some information about the newly created app.

This tutorial will be written in Kotlin. So, select from the dropdown list the Kotlin language.

From the next list of the “Minimum SDK” select API 21. In our case API 21 gonna be enough.

If you are done, click on the “Finish” button. The build can take few minutes. Be patient! 😉

When the build has been finished, then you should see the open MainActivity::class and next to this the activity_main.xml files.

Step 2 - Update dependency

We are going to start this chapter by updating the dependencies of ConstraintLayout for the app. First, open the Module build.gradle file from the left Project pane.

Then in the dependencies{} section find this line:
implementation ‘androidx.constraintlayout:constraintlayout:1.1.3’

To start using MotionLayout in our project, we have to update the version of ConstraintLayout at least to version 2.0.0. You can find the highest version under the link: Constraintlayout

When this tutorial was writen, this version was 2.0.0-rc1, so update the above implementation line to

implementation ‘androidx.constraintlayout:constraintlayout:2.0.0-rc1‘

Next sync the project by clicking on the Sync now button at the top right corner of Android Studio.

That’s all what we have to do to start using MotionLayout in our project.

Step 3 - Convert to MotionLayout

Next we will convert ConstraintLayout of the activity_main.xml file to MotionLayout. To do this, open it from the res > layout folders.

Open the design view at the right side of Android Studio. Then go to the Component Tree pane. Click on ConstraintLayout with the right mouse button and select the “Convert to MotionLayout” option.

After the conversation you should have the below window which is the MotionScene of the activity_main.xml file.

This layout describes the starter position of the ConstraintSet…
… and this is the end.
After the conversation, our layout got a new attribute also, which describes the MotionScene of the layout. You can find this XML file in the res > xml folder called activity_main_scene.xml.
Using the first icon you can add new ConstraintSets, which is a new state what you can start for example from the end of the current MotionScene. With the second icon you can add transitions and the third icon is for adding click or swipe event to the transitions.
This is called Transition. Here you can play with the animation and check what is going to happen with the layout during the animation.

Step 4 - The assets

Before we can start to implement the layout and the MotionScene, we have to add the clouds, the sun and 2 new colors to the colors.xml file. Because this step is not the main part of this clearing weather tutorial, we will just add them by downloading the below ZIP file.
Clearing Weather assets

After downloading, unzip the file into the res folder of your project.

Step 5 - The layout

The next step is the implementation of the starter layout. So, open the activity_main.xml file from the res > layout folders and paste into it the below xml code.

The layout will contain 2 Views, which will be the background and 3 ImageViews representing the clouds and the sun.

activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.motion.widget.MotionLayout
    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:layoutDescription="@xml/activity_main_scene"
    tools:context=".MainActivity">
    <View
        android:id="@+id/view_background_gray"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:alpha="1"
        android:background="@color/light_grey"/>
    <View
        android:id="@+id/view_background_blue"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:alpha="0"
        android:background="@color/light_blue"/>
    <ImageView
        android:id="@+id/iv_sun"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_sun"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
    <ImageView
        android:id="@+id/iv_cloud_white"
        android:layout_width="200dp"
        android:layout_height="200dp"
        android:elevation="1dp"
        android:src="@drawable/ic_cloud_white"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintHorizontal_bias="0.2"
        app:layout_constraintVertical_bias="0.45"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
    <ImageView
        android:id="@+id/iv_cloud_grey"
        android:layout_width="150dp"
        android:layout_height="150dp"
        android:src="@drawable/ic_cloud_gray"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintVertical_bias="0.55"
        app:layout_constraintHorizontal_bias="0.8"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.motion.widget.MotionLayout>

Step 6 - The clearing weather animation

Finally in this step, we can start the implementation of the clearing weather animation.

There are 2 ways to do thet. Before Android Studio 4.0 you could do that only using the XML file. From version 4.0 the developers can use a graphical interface, which is the MotionScene. About this we have talked already. You can open this screen when you open the activity_main.xml file and switch to the design view using the icons at the top right corner of Android Studio.

In this tutorial we gonna do that manually. So we gonna use the design view.

The start ConstraintSet

As you can see, the starter ConstraintSet is already done, because we have inserted the above layout. Note the alpha property of the view_background_gray View.

The start ConstraintSet

Now select the end ConstraintSet.

First, we gonna change the transparency of the 2 views. We can do that by setting their alpha property.

From the ConstraintSet table, what you can find below of the above screens, select the view_background_gray and from the Attributes pane change the alpha from 1 to 0.

Similarly, change the alpha of view_background_blue from 0 to 1.

Next, select the iv_cloud_white ImageView. From its attributes remove the horizontal and the vertical bias lines. You can do it easyily in the right Attributes pane.

Then remove it’s right to right and the left ot left alignments.

Finally add the left to right alignment with value of parent. You can do in the desing mode if you click in the Attributes pane on the plus icon.

The result is that, the ImageView gonna be out from the screen at the right side.

The last change on the end ConstraintSet is to modify the attributes of the iv_cloud_grey ImageView as well. So, remove also the bias lines and the left to left – right to right constraints. Thenafter add the right to left constraint with the values of parent.

The Transition

The last thing what we have to set before the first run of the app, is to set the click event.

This click event will start the transition. We can add it to the Transition by clicking on it. You can open it if you click on the arrow which connects the start and the end ConstraintSets.

Thenafter from the Attributes pane, in the OnClick part click on the + icon and add the below attributes with their values.

clickActioin -> toggle
targetId -> @id/iv_cloud_grey

The XML code of the MotionScene

If you are stucked, then just copy the below code into the activity_main_scene.xml file, what you can find in the res > xml folders.

<?xml version="1.0" encoding="utf-8"?>
<MotionScene 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:motion="http://schemas.android.com/apk/res-auto">

    <Transition
        motion:constraintSetEnd="@+id/end"
        motion:constraintSetStart="@id/start"
        motion:duration="1000">
       <KeyFrameSet>
       </KeyFrameSet>
        <OnClick motion:clickAction="toggle"
            motion:targetId="@id/iv_cloud_grey" />
    </Transition>

    <ConstraintSet android:id="@+id/start"/>

    <ConstraintSet android:id="@+id/end">
        <Constraint
            android:id="@+id/view_background_gray"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:alpha="0" />
        <Constraint
            android:id="@+id/view_background_blue"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:alpha="1" />
        <Constraint
            android:id="@+id/iv_cloud_white"
            android:elevation="1dp"
            android:layout_width="200dp"
            android:layout_height="200dp"
            motion:layout_constraintBottom_toBottomOf="parent"
            motion:layout_constraintTop_toTopOf="parent"
            motion:layout_constraintLeft_toRightOf="parent" />
        <Constraint
            android:id="@+id/iv_cloud_grey"
            android:layout_width="150dp"
            android:layout_height="150dp"
            motion:layout_constraintBottom_toBottomOf="parent"
            motion:layout_constraintTop_toTopOf="parent"
            motion:layout_constraintRight_toLeftOf="parent" />
    </ConstraintSet>
</MotionScene>

Run the app

Now its time to test the app. Connect your real device or start an emulator and run the app.

When it is loaded, then click on the clouds. The animation needs to run as you can see on this picture.

Step 6 - The Transition listener

In the last step of this tutorial we are going to implement the Transition listener. Using this listener we can add some actions to the start / end transitions and of course we can specify actions during the transition as well.

In our tutorial we are going to show a Toast message when the transition has been started and when it is finished.

First we have to add an id to the MotionLayout viewgroup in the activity_main.xml file. So open it from the res > layout folders and add the below line to the MotionLayout viewgroup.

android:id=“@+id/motionLayout”

Next, open up the MainActivity::class file from the main source set.

We can use the setTransitionListener() method to add actions to the transition.

So, copy and paste the below line into the onCreate() method.

val motionLayout = findViewById(R.id.motionLayout)

motionLayout.setTransitionListener(object : MotionLayout.TransitionListener {
    override fun onTransitionTrigger(p0: MotionLayout?, p1: Int, p2: Boolean, p3: Float) {
    }
    override fun onTransitionStarted(p0: MotionLayout?, p1: Int, p2: Int)
    {
        Toast.makeText(this@MainActivity, "onTransitionStarted", Toast.LENGTH_SHORT).show()
    }
    override fun onTransitionChange(p0: MotionLayout?, p1: Int, p2: Int, p3: Float) {
    }
    override fun onTransitionCompleted(p0: MotionLayout?, p1: Int)
    {
        Toast.makeText(this@MainActivity, "onTransitionCompleted", Toast.LENGTH_SHORT).show()
    }
})

First in the code we have to find the view of the MotionLayout. Thenafter we use its setTransitionListener() method.

As you can see, it has 4 methods. From them we are going to use only 2, So, we have added a Toast to the onTransitionStarted() and onTransitionCompleted() methods.

Run the app

Run again the app. When you start the transition and when it is finished, then you will have a Toast message on the screen.

Congratulations! 😎

You just created a cool animation, what maybe you can use in your next app. 😊

Run the app

The source code is available on GitHub, check it out and download it using the below link.

GitHub

Android WeatherApp course

Did you like this short tutorial, then check out my Android WeatherApp course as well.

Questions

I hope the description was understandable and clear. But, if you have still questions, then leave me comments below! 😉

Have a nice a day! 🙂

Android widgets – Update using Kotlin Flow, Room and Dagger-Hilt

Inspire Coding — Sat, 05 Sep 2020 13:54:53 +0000

Overview

In this Android tutorial I'm going to show you an approach which helps to update the app's widget realy easy using Kotlin Flow, Room and Dagger-Hilt.

Introduction

First of all, we have to talked in a few words about what does Koltin Flow, Room and Dagger-Hilt mean.

Kotlin Flow

Kotlin Flow is developed by JetBrains, the owner of the Kotlin language and it is a new stream processing API. It implements the Reactive Stream specification, and its goal is ot provide a standard for asynchronous stream processing. Kotlin Flow is build on top of Kotlin Coroutines.
Using Flow we handle streams of values, transform the data in a complex threaded way with only few lines of code.

Room

The Room persistence library provides an abstraction layer over SQLite to allow for more robust database access while harnessing the full power of SQLite.

The library helps you create a cache of your app's data on a device that's running your app. This cache, which serves as your app's single source of truth, allows users to view a consistent copy of key information within your app, regardless of whether users have an internet connection.
Source: Room Persistence Library

Dagger-Hilt

Hilt is a dependency injection library for Android that reduces the boilerplate of doing manual dependency injection in your project.
Hilt provides a standard way to use DI in your application by providing containers for every Android class in your project and managing their lifecycles automatically. Hilt is built on top of the popular DI library Dagger to benefit from the compile-time correctness, runtime performance, scalability, and Android Studio support that Dagger provides.
Source: Dependency injection with Hilt

The sample app

So, after a short indtroduction, let's start coding. :)

Step 1 - Get the starter project

For this tutorial we are going to use a starter project, which is a ToDo app. This app contains Room and RecyclerView to show the created ToDo items.

The tutorial for the starter project is available on Inspire Coding: Room basics – Introduction

GitHub

If you don't want to do the starter tutorial, then you can get the starter project from GitHub as well: GitHub

Clone or just download the project, and import it in Android Studio.

Step 2 - Add the widget

The next step is to add the "widget" package to the main source set.
If the package is created, then create into it a new widget with the below detailes

Width: 4 cells
Height: 1 cell
No Configuration Screen needed
Language: Kotlin

Step 3 - Widget's layout

The layout gonna be very simple.

TextView for the title
TextView for the due date
TextView for the description
ImageView for the priority

< RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/widget_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/shape_roundedcorners_white">

    <TextView
        android:id="@+id/tv_widget_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:text="Task 1"
        android:textColor="@color/colorPrimary"
        android:textSize="14sp" />

    <TextView
        android:id="@+id/tv_widget_dueDate"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/tv_widget_title"
        android:layout_marginStart="8dp"
        android:text="@string/duedate"
        android:textColor="@color/darkGrey"
        android:textSize="8sp" />

    <TextView
        android:id="@+id/tv_widget_description"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/tv_widget_dueDate"
        android:layout_alignParentStart="true"
        android:layout_toStartOf="@id/iv_widget_priority"
        android:layout_marginStart="8dp"
        android:layout_marginEnd="8dp"
        android:text="@string/placeholder_text"
        android:textColor="@color/darkGrey"
        android:textSize="10sp" />

    <ImageView
        android:id="@+id/iv_widget_priority"
        android:layout_width="30dp"
        android:layout_height="30dp"
        android:layout_alignParentTop="true"
        android:layout_alignParentBottom="true"
        android:layout_alignParentEnd="true"
        android:layout_marginEnd="8dp"
        android:src="@drawable/prio_green" />

</ RelativeLayout>

The shape of the widget

Now create a new Drawable resource file with the name: shape_roundedcorners_white.xml and paste into it the below code.

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">

    <solid
        android:color="@color/white"/>
    <corners
        android:radius="12dp"/>

</shape>

This will be the background of the widget.

Step 4 - Implement Hilt

@HiltAndroidApp

Add the @HiltAndroidApp annotation to the MyApp::class

@RoomDatabaseModule

Then create a Hilt module into a new package called "di". This module will get the name of RoomDatabaseModule.
And the file looks like below.

@InstallIn(ApplicationComponent::class)
@Module
class RoomDatabaseModule
{
    @Singleton
    @Provides
    fun providesDatabase (application: Application) = ToDoRoomDatabase.getDatabase(application)

    @Singleton
    @Provides
    fun providesCurrentWeatherDao (database: ToDoRoomDatabase) = database.toDoDao()
}

@AndroidEntryPoint

Thenafter add the @AndroidEntryPoint annotation to the AppWidget::class.

@Inject DAO

Finally modify the ToDoRepository::class to use a constructor injection in the header of the class for the ToDoDAO.

class ToDoRepository @Inject constructor (private val toDoDao: ToDoDao)

Step 5 – Add Flow to DAO

In this step we are going to implement the needed methods to get the todo item from Room which has the todoId of 1.
For this we are going to add the below method to the ToDoDAO::class.

@Query("SELECT * FROM ToDo WHERE toDoId = 1")
fun getFirstToDoItem() : Flow<ToDo>

Note that the method return Flow which wraps a ToDo type.

Step 6 – Extend the repository

Then add the below method to the ToDoRepository::class.

val getFirstToDoItem : Flow<ToDo> = toDoDao.getFirstToDoItem()

The return value is the same like the same method in the ToDoDAO::class.

Step 7 – Update the AppWidget::class

Thenafter we will add 3 member variables to the AppWidget::class.

private val job = SupervisorJob()
val coroutineScope = CoroutineScope(Dispatchers.IO + job)
@Inject lateinit var toDoRepository: ToDoRepository

Because Flow is a suspend function, we can call it only from CoroutineScope. That's why we need the Job and the CoroutineScope.
To get the item from Room is an IO operation, so we are going to add the Dispatchers.IO to the CoroutineScope.

Next, remove the onUpdate() and the onEnabled() methods. We don't need them.

Thenafter add the onReceive() method to the AppWidget::class.

override fun onReceive(context: Context, intent: Intent?)
{
    super.onReceive(context, intent)

    coroutineScope.launch {
        toDoRepository.getFirstToDoItem.collect { _toDo ->
            val appWidgetManager = AppWidgetManager.getInstance(context)
            val man = AppWidgetManager.getInstance(context)
            val ids = man.getAppWidgetIds(ComponentName(context, AppWidget::class.java))

            if (_toDo != null)
            {
                for (appWidgetId in ids)
                {
                    updateAppWidget(
                        context, appWidgetManager, appWidgetId,
                        _toDo.title, _toDo.dueDate, _toDo.description, _toDo.priority
                    )
                }
            }
        }
    }
}

Now you should have an error, because we haven't extended the updateAppWidget() method. So, replace it with the below one.

internal fun updateAppWidget(
    context: Context, appWidgetManager: AppWidgetManager, appWidgetId: Int,
    title: String?, dueDate: String?, description: String?, priority: String?)
{
    // Construct the RemoteViews object
    val views = RemoteViews(context.packageName, R.layout.app_widget)

    if (title != null) {
        views.setTextViewText(R.id.tv_widget_title, title)
    } else {
        views.setTextViewText(R.id.tv_widget_title, "")
    }
    if (dueDate != null) {
        views.setTextViewText(R.id.tv_widget_dueDate, dueDate)
    } else {
        views.setTextViewText(R.id.tv_widget_dueDate, "")
    }
    if (description != null) {
        views.setTextViewText(R.id.tv_widget_description, description)
    } else {
        views.setTextViewText(R.id.tv_widget_title, "")
    }
    if (description != null) {
        when (priority)
        {
            Prioirities.LOW.name -> views.setImageViewResource(R.id.iv_widget_priority, R.drawable.prio_green)
            Prioirities.MEDIUM.name -> views.setImageViewResource(R.id.iv_widget_priority, R.drawable.prio_orange)
            Prioirities.HIGH.name -> views.setImageViewResource(R.id.iv_widget_priority, R.drawable.prio_red)
        }
    }

    views.setOnClickPendingIntent(R.id.widget_layout,
        getPendingIntentActivity(context))

    // Instruct the widget manager to update the widget
    appWidgetManager.updateAppWidget(appWidgetId, views)
}

And one more error. It is there, because we haven't implemented the getPendingIntentActivity() method yet. This method will create for the views a PendingIntent to update the views if the widget's instances.
So, paste the below method at the end of the AppWidget.kt file.

private fun getPendingIntentActivity(context: Context): PendingIntent
{
    // Construct an Intent which is pointing this class.
    val intent = Intent(context, MainActivity::class.java)
    // And this time we are sending a broadcast with getBroadcast
    return PendingIntent.getActivity(context, 0, intent, 0)
}

So, we are almost done. One more thing left before we can test the app. When we delete an instance of the AppWidget, we have to cancel its Job as well. So add the below line to the onDisabled() method.

job.cancel()

Run the app

Finally its time to run the app.

Questions

I hope the description was understandable and clear. But, if you have still questions, then leave me comments below! 😉

Have a nice a day! 🙂

Forem: Inspire Coding

Android - Custom Toast with Kotlin extension function

Step 1: Create a new project

Step 2: Create a layout

Step 3: Create an icon

Step 4: Create a shape

Step 5: Create the layout

Step 6: Create the extension function

Step 7: Set the click listener

Run the app

More detailes

Have a nice day :)

More Android tutorials

Android MotionLayout – Clearing weather

Android WeatherApp Course

MotionLayout

Tags

Step 1 – Create new project

Step 2 - Update dependency

Step 3 - Convert to MotionLayout

Step 4 - The assets

Step 5 - The layout

Step 6 - The clearing weather animation

The start ConstraintSet

The start ConstraintSet

The Transition

The XML code of the MotionScene

Run the app

Step 6 - The Transition listener

Run the app

Run the app

Android WeatherApp course

More Android tutorials

Questions

Android widgets – Update using Kotlin Flow, Room and Dagger-Hilt

Overview

Introduction

Kotlin Flow

Room

Dagger-Hilt

The sample app

Step 1 - Get the starter project

GitHub

Step 2 - Add the widget

Step 3 - Widget's layout

The shape of the widget

Step 4 - Implement Hilt

@HiltAndroidApp

@RoomDatabaseModule

@AndroidEntryPoint

@Inject DAO

Step 5 – Add Flow to DAO

Step 6 – Extend the repository

Step 7 – Update the AppWidget::class

Run the app

More Android tutorials

Questions

`Have a nice day :)`