Refresh data in a custom Android Adapter

An Adapter is an object that provides data to certain components like a ListView object or a Spinner object. There are distinct classes that implement the Adapter class, such as ArrayAdapter, which loads an array of objects. We can create a custom adapter that extends the ArrayAdapter class to create custom items.
Let’s say that we want to display Event objects in a ListView. This is our custom adapter:

public class MyCustomAdapter extends ArrayAdapter<MyEvent> {
    private final Context context;
    private List<MyEvent> events;

    public MyCustomAdapter(Context context, int layoutResourceId, List<MyEvent> events) {
        super(context, layoutResourceId, data);
        this.context = context;
        this.events = events;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        // Custom view
    }
}

In the constructor method, the adapter saves the list of objects that will be displayed in the view. If we want to refresh/change this data after creating the adapter, add a new method to the adapter:

public void refreshEvents(List<MyEvent> events) {
    this.events.clear();
    this.events.addAll(events);
    notifyDataSetChanged();
}

This refresh method clears all the data from the list and updates it with new data. Alternatively you can create different methods to add or remove items. In any case, the most important part is to invoke the notifyDataSetChanged method. The notifyDataSetChanged method notifies the attached observers that the underlying data has been changed and any View reflecting the data set should refresh itself.

Finally, from the activity or fragment that contains the list, invoke the previous method with the new data:

mAdapter.refreshEvents(newListOfEvents);

Consider the case in which the refresh method is not called from the UI thread. For example, if the data is updated after a server request:

getActivity().runOnUiThread(new Runnable() {
    @Override
    public void run() {
        mAdapter.refreshEvents(newListOfEvents);
});

Read More

Custom color in Action Bar + Drawer

A navigation drawer is a common structure for the top-level of our Android app. A drawer provides a safe start point of return with which users can easily understand the application structure.

Using Android Studio, we can create a project from the template of an activity with a navigation drawer:

Create navigation drawer activity

A navigation drawer can be opened by a button placed in the top action bar or by swipe gestures. The default action bar for the drawer contains the icon button that opens/closes it, which is known as the toggle button. The action bar, the title and the button have their own default colors.

Default Action Bar

To change the default action bar with our custom colors, we need to change the styles xml file of our app, which initially only contains the base app theme:

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
 
</style>

Under the style of our custom app theme, we need to add an item for the action bar and an item for the drawer toggle icon (arrow):

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="android:actionBarStyle">@style/MyActionBar</item>
    <item name="drawerArrowStyle">@style/MyDrawerArrowToggle</item>

    <!-- Support library compatibility -->
    <item name="actionBarStyle">@style/MyActionBar</item>
</style>

We also need to add the new colors that we are going to use. These color tags are placed outside the style tag.

<color name="background">#ff82B548</color>
<color name="foreground">@android:color/white</color>

Let’s define each one of these items. Firstly, the custom color for the toggle button:

<style name="MyDrawerArrowToggle" parent="Widget.AppCompat.DrawerArrowToggle">
    <item name="color">@color/foreground</item>
</style>

Secondly, the custom background color of the action bar and also the title text style:

<style name="MyActionBar" parent="@style/Widget.AppCompat.ActionBar">
    <item name="android:titleTextStyle">@style/MyTitleTextStyle</item>
    <item name="android:background">@color/background</item>

    <!-- Support library compatibility -->
    <item name="titleTextStyle">@style/TitleTextStyle</item>
    <item name="background">@color/background</item>
</style>

Finally, the title text style is defined as follows:

<style name="MyTitleTextStyle" parent="@style/TextAppearance.AppCompat.Widget.ActionBar.Title">
    <item name="android:textColor">@color/foreground</item>
</style>

And here it is the result:

Custom Action Bar

Read More