Question

I am trying to turn a couple buttons into a reusable component in Android. I have successfully gotten the XML / UI portion working, but I can’t figure out how to make code behind it reusable between activities, short of recoding it everywhere. I am new to Android, so I apologize if this is obvious.

I’ve already reviewed this post several times: Android layout Tricks 3 – Part 1 but it seems to be missing a few files, and I do not have enough experience to rebuild them.

A dumbed down version of my main layout:

  <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <WebView android:id="@+id/webview" 
        android:layout_width="fill_parent"
        android:layout_height="375px" 
        android:layout_alignParentTop="true" />

        <include layout="@layout/navbar"/>

</RelativeLayout>

and then of my “component”:

<?xml version="1.0" encoding="UTF-8"?>
<merge xmlns:android="http://schemas.android.com/apk/res/android">
      <LinearLayout   
            android:orientation="horizontal"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:gravity="center">

            <ImageButton android:id="@+id/Button1" 
                android:layout_width="71px"
                android:layout_height="wrap_content"
                android:background="@drawable/button1"              
                android:layout_alignParentBottom="true" />


            <ImageButton android:id="@+id/Button2" 
                android:layout_width="75px"
                android:layout_height="wrap_content"
                android:background="@drawable/button1"  
                android:layout_toRightOf = "@+id/Button1"
                android:layout_alignParentBottom="true" />              

        </LinearLayout>
        </merge>

If you have any additional critiques on my XML, I would appreciate that too.

Answer 1

What I do is make an actual component that contains all of the common code and use it directly. Here is a dumbed down version of the component class:

public class NavigationBar extends LinearLayout {
    public NavigationBar(Context context) {
        super(context);
        setupView(context);
        hookupButtons(context);
    }
    public NavigationBar(Context context, AttributeSet attrs) {
        super(context, attrs);
        setupView(context);
        hookupButtons(context);
    }
    private void setupView(Context context) {
        LayoutInflater inflater = (LayoutInflater)context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        // inflate whatever layout xml has your common xml
        inflater.inflate(R.layout.navigation_bar, this);
    }
}

In my class hookupButtons does exactly what you think it would do. 🙂

Then my in all my layout xmls look similar to this:

<?xml version="1.0" encoding="UTF-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <com.dragonglobal.dragonplayer.ui.widgets.NavigationBar
        android:id="@+id/nav_bar"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
    <ListView
        android:id="@+id/list_of_playlists"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" />
</LinearLayout>

In the onCreate of each activity I also have this (that you can adapt to whatever you need):

NavigationBar navbar = (NavigationBar) findViewById(R.id.nav_bar);
navbar.setText("Playlists");

Of course you will need to add whatever imports you need.

EDIT

Just a clarification: My navigation_bar.xml looks very similar to yours except I don’t have the merge lines in mine.

EDIT 2

Here is what hookupButtons looks like. I’m only showing one button but you should get the idea.

private void hookupButtons(final Context context) {
    ImageButton playlistsBtn = (ImageButton)findViewById(R.id.nav_playlists_btn);
    if (context instanceof PlaylistsActivity) {
        playlistsBtn.setBackgroundDrawable(getResources().getDrawable(R.drawable.nav_playlists_active));
    } else {
        playlistsBtn.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View v) {
                Intent i = new Intent(context, PlaylistsActivity.class);
                i.addFlags(Intent.FLAG_ACTIVITY_REORDER_TO_FRONT);
                context.startActivity(i);
            }
        });
    }
}