Stream Chat allows you to add custom data to many of its API’s objects. Let’s take a look at a use case for adding custom data to attachments.
•5 months ago
Getting the Current Location
Before you send your attachment, first you'll need to get the current location of the user. The implementation for getting the current location is already set up, and you can see it in the sample project for this tutorial.
LocationUtils file which has a method with extends the
FusedLocationProviderClient class. The extension method returns a
callbackFlow with the location data.
To get the location you can collect the results in your Activity as shown below:
Here, you're getting location from
FusedLocationProviderClient as a
Flow, using the
locationFlow() extension method. You're also collecting the results in a safe way using the
You now have the user's current location. In the next section, you'll see how to add location coordinates as custom attachments.
API key setup
To be able to load a map, you'll need to have your project on the Google Maps Platform console. From the console, you can get an API Key for your app which enables your app to access all map functionalities. Read more about this in the official documentation.
Once you have the API Key, you can add it in the
local.properties file as:
Adding Location as a Custom Attachment
To add the location to your custom attachment, you need to create an
Attachment object as shown below.
To explain what the code above does:
- Here, you're creating an attachment with the custom
locationtype. You'll use this key later to recognize and display attachments like this. You're also passing in the latitude and longitude from your location coordinates using the
extraDataparameter which allows you to add arbitrary key-value pairs to an attachment.
- You're adding your location attachment to a new
With this, you can send your message with this custom attachment.
Adding A Map Preview
The Android SDK renders previews for attachments like images and files by default. For custom attachments, you'll override the
AttachmentViewFactory class, which allows you to create and render your custom view for attachments.
First, create a layout for your custom attachment:
The layout has a
MapView for displaying the location on the map.
Next you'll create the
LocationAttachmentViewFactory which extends
AttachmentViewFactory. This is how the class looks like:
Here's a breakdown of all the code above:
- This the method responsible for rendering all attachment UI. In this method, you only need to change the UI for attachments that have a location. The other attachments remain unchanged, and can use the default implementation.
- Here, you're getting the location data that you passed on your message using the
locationkey that you defined earlier.
- You're calling the
createLocationViewwhich is responsible for inflating the view.
- Here you're initializing the
- You're calling the
getMapAsync()method. This method sets a callback object which is triggered when the
GoogleMapinstance is ready for use. When that's invoked, you're updating the map with the a zoom level and moving it to the location you added to your attachment.
- You're adding a
LifecycleObserver. This is for calling the different
MapViewlifecycle methods depending on the lifecycle state of
LocationAttachmentViewFactory. For example you're supposed to destoy the
MapViewwhen the view has been destoyed. You achieve this by calling
mapView.onDestroy()when you receive the
With the custom factory created, you now need to set up
MessageListView to use it. You do this as shown in the code below:
You pass the
Activity as the
lifecycleOwner for the
LocationAttachmentViewFactory. This hooks the map behaviours to the lifecycle of the current
With this, your app is ready to send and also preview custom location attachments. For the project, the action button for sending the location is on the options menu as shown in the image below.
You'll use the menu options to send the user's current location from the app to Stream Android Chat SDK. Once you tap on the location icon at the top right, it sends a message with the text: "My Current location" (the
Message object prepared earlier).
As seen from the image above, the attachment shows a map and
TextView. The map shows the location of the coordinates sent as custom attachments.
You've seen how easy it is to add a location as a custom attachment. You can now enrich your chat with location sharing.
The the full sample project with examples in this tutorial on GitHub.
You could take this idea further from here to implement live, continous location sharing as well, by editing the already sent message as the location of your device is updated. This would require some additional bookkeeping and lifecycle management, but Stream's Chat SDK supports it with its editing and realtime notification features.
You can also go through the Message List View Custom Attachments sections that explain more about custom attachments.