Changing the content of framelayout on button click

Question

Right I have a main layout defined, that has a frame, a table in that frame and then at the bottom a horizontal scroll view with a load of buttons. When the button is clicked the content of frame should change to a new table, just like when you choose a different tab in the tab layout tutorial (not using a tab layout as I have lots of buttons that don't fit on the screen unless scrolled)

<?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"
        android:padding="5dp">
        <FrameLayout
            android:id="@+id/tabcontent"
            android:layout_width="fill_parent"            
            android:layout_height="wrap_content"
            android:layout_weight="1.2"            
            android:padding="5dp" android:background="@color/white">
            <TableLayout android:id="@+id/Jobs" android:layout_width="fill_parent" android:layout_height="wrap_content" android:stretchColumns="*">
                <TableRow android:id="@+id/JobRow" android:layout_width="wrap_content" android:layout_height="wrap_content">
                    <TextView android:id="@+id/JobID" android:layout_column="1" android:layout_width="fill_parent" android:layout_height="wrap_content" android:textColor="@color/black"></TextView>
                    <TextView android:id="@+id/JobStatus" android:layout_column="2" android:layout_width="fill_parent" android:layout_height="wrap_content" android:textColor="@color/black"></TextView>
                    <TextView android:id="@+id/Customer" android:layout_column="3" android:layout_width="fill_parent" android:layout_height="wrap_content" android:textColor="@color/black"></TextView>
                    <TextView android:id="@+id/Department" android:layout_column="4" android:layout_width="fill_parent" android:layout_height="wrap_content" android:textColor="@color/black"></TextView>
                    <TextView android:id="@+id/DocType" android:layout_column="5" android:layout_width="fill_parent" android:layout_height="wrap_content" android:textColor="@color/black"></TextView>
                </TableRow> 
            </TableLayout>
        </FrameLayout>
        <HorizontalScrollView 
            android:layout_height="wrap_content" android:layout_width="fill_parent" android:layout_gravity="bottom" android:scrollbars="none">
            <LinearLayout 
                android:orientation="horizontal" android:layout_height="wrap_content"
                android:layout_width="fill_parent">
                <ImageButton android:id="@+id/batching" android:layout_width="fill_parent" android:layout_height="wrap_content" android:src="@drawable/batching"></ImageButton>
                <ImageButton android:id="@+id/merging" android:layout_width="fill_parent" android:layout_height="wrap_content" android:src="@drawable/merging"></ImageButton>
                <ImageButton android:id="@+id/processing" android:layout_width="fill_parent" android:layout_height="wrap_content" android:src="@drawable/processing"></ImageButton>
                <ImageButton android:layout_width="fill_parent" android:layout_height="wrap_content" android:src="@drawable/processing"></ImageButton>
                <ImageButton android:layout_width="fill_parent" android:layout_height="wrap_content" android:src="@drawable/processing"></ImageButton>
                <ImageButton android:layout_width="fill_parent" android:layout_height="wrap_content" android:src="@drawable/processing"></ImageButton>
                <ImageButton android:layout_width="fill_parent" android:layout_height="wrap_content" android:src="@drawable/processing"></ImageButton>
                <ImageButton android:layout_width="fill_parent" android:layout_height="wrap_content" android:src="@drawable/processing"></ImageButton>
                <ImageButton android:layout_width="fill_parent" android:layout_height="wrap_content" android:src="@drawable/processing"></ImageButton>
                <ImageButton android:layout_width="fill_parent" android:layout_height="wrap_content" android:src="@drawable/processing"></ImageButton>
                <ImageButton android:layout_width="fill_parent" android:layout_height="wrap_content" android:src="@drawable/processing"></ImageButton>
                <ImageButton android:layout_width="fill_parent" android:layout_height="wrap_content" android:src="@drawable/processing"></ImageButton>
                <ImageButton android:layout_width="fill_parent" android:layout_height="wrap_content" android:src="@drawable/processing"></ImageButton>
                <ImageButton android:layout_width="fill_parent" android:layout_height="wrap_content" android:src="@drawable/processing"></ImageButton>
            </LinearLayout>
        </HorizontalScrollView>
</LinearLayout>

Now for tabs changing the content of the tab seemed quite easy like so:

public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    Resources res = getResources(); // Resource object to get Drawables
    TabHost tabHost = getTabHost();  // The activity TabHost
    TabHost.TabSpec spec;  // Resusable TabSpec for each tab
    Intent intent;  // Reusable Intent for each tab

    // Create an Intent to launch an Activity for the tab (to be reused)
    intent = new Intent().setClass(this, ArtistsActivity.class);

    // Initialize a TabSpec for each tab and add it to the TabHost
    spec = tabHost.newTabSpec("artists").setIndicator("Artists",
                      res.getDrawable(R.drawable.ic_tab_artists))
                  .setContent(intent);
    tabHost.addTab(spec);

    // Do the same for the other tabs
    intent = new Intent().setClass(this, AlbumsActivity.class);
    spec = tabHost.newTabSpec("albums").setIndicator("Albums",
                      res.getDrawable(R.drawable.ic_tab_albums))
                  .setContent(intent);
    tabHost.addTab(spec);

    intent = new Intent().setClass(this, SongsActivity.class);
    spec = tabHost.newTabSpec("songs").setIndicator("Songs",
                      res.getDrawable(R.drawable.ic_tab_songs))
                  .setContent(intent);
    tabHost.addTab(spec);

    tabHost.setCurrentTab(2);
}

How can I do something similar with the frame content and buttons? I was thinking something along the lines of

public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);      

    Resources res = getResources(); // Resource object to get Drawables
    final Intent batchingIntent, mergingIntent, processingIntent;

    // Create an Intent to launch an Activity for the tab (to be reused)        


    final Button batchButton = (Button) findViewById(R.id.batching);
    batchingIntent = new Intent().setClass(this, BatchingActivity.class);
    batchButton.setOnClickListener(new OnClickListener() {
        public void onClick(View v) {
            // Perform action on clicks
            FrameLayout frame = (FrameLayout) findViewById(R.id.tabcontent);
            frame.setContent(batchingIntent) // doesn't exist obviously
        }
    });

Answer 1

You can't nest an Activity inside a FrameLayout. What you can do is swap its views with new ones:

FrameLayout frame = (FrameLayout) findViewById(R.id.tabcontent);
frame.removeAllViews();
frame.addView(aNewViewOne);
frame.addView(aNewViewTwo);
 ...

Instead of adding views you could also inflate a layout into the FrameLayout:

LayoutInflater.from(context).inflate(R.other_tab, frame, true);