How to implement a command that allows user to add and delete tabs in the application?

Question

I am trying to make an app with tabs at the top that link a website too each one, such as a computer that uses tabs in safari or firefox. What I am trying to do is implement an add and delete class that will allow the user to delete a tab if wanted and add another that will link to a different website. Any help would be greatly appreciated.

Here is the main java file.

public class UniversityofColorado extends TabActivity {


@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    TabHost host=getTabHost();

    host.addTab(host.newTabSpec("one")
            .setIndicator("Google")
            .setContent(new Intent(this, Hello.class)));

    host.addTab(host.newTabSpec("two")
                    .setIndicator("Colorado Main Site")
                    .setContent(new Intent(this, ColoradoMainSiteBrowser.class)));

    host.addTab(host.newTabSpec("three")
                    .setIndicator("CULearn")
                    .setContent(new Intent(this, CULearnBrowser.class)));

    host.addTab(host.newTabSpec("four")
            .setIndicator("CULink")
            .setContent(new Intent(this, CULinkBrowser.class)));

    host.addTab(host.newTabSpec("five")
            .setIndicator("MyCUInfo")
            .setContent(new Intent(this, MyCUInfoBrowser.class)));

    host.addTab(host.newTabSpec("six")
            .setIndicator("Campus Map")
            .setContent(new Intent(this, CampusBrowser.class)));

    host.addTab(host.newTabSpec("Seven")
            .setIndicator("Notes")
            .setContent(new Intent(this, Notepadv3.class)));
}   




    // Inflates menu when "menu Key" is pressed
    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        MenuInflater inflater = getMenuInflater();
        inflater.inflate(R.menu.menu, menu);
        return true;
    }
}

This is one of the java files that the main java file uses:

public class ColoradoMainSiteBrowser extends Activity {

WebView webview;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
webview = (WebView) findViewById(R.id.webview);
webview.setWebViewClient(new HelloWebViewClient());
webview.getSettings().setJavaScriptEnabled(true);
webview.loadUrl("http://colorado.edu/");
}
private class HelloWebViewClient extends WebViewClient {
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url)
{
view.loadUrl(url);
return true;
}
}
public boolean onKeyDown(int keyCode, KeyEvent event) {
if ((keyCode == KeyEvent.KEYCODE_BACK) && webview.canGoBack()) {
webview.goBack();
return true;
}
return super.onKeyDown(keyCode, event);
}
}

How would I implement the add and delete buttons to have this same format when the new tabs were added.

Answer 1

In order to achieve the desired effect, you probably need to drop an activity for each tab approach.

Instead, you would create a "default" view that you can use to all websites that accept the URL as a parameter.

Then, instead of "intenting" a new activity to each tab, you Inflate that view to the new tab, passing the URL as a parameter.

To create and delete tabs dinamically would be easy. A simple button that Inflates/removes the view would sufice.

---

XML

res/layout/main.xml

<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/tabhost"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:padding="5dp">
        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content" />
        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:padding="5dp" />
    </LinearLayout>    
</TabHost>

res/layout/tab.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
>
<TextView
android:id="@+id/url_tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="HELLO TAB!"
>
</TextView>
</LinearLayout>

res/menu/menu.xml

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item android:enabled="true" android:visible="true" android:icon="@android:drawable/ic_menu_add" android:title="Add Website" android:titleCondensed="add" android:id="@+id/add"></item>
<item android:titleCondensed="Delete" android:enabled="true" android:visible="true" android:icon="@android:drawable/ic_menu_delete" android:id="@+id/delete" android:title="Delete Website"></item>
</menu>

JAVA CODE

main.java

import android.app.TabActivity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuInflater;
import android.view.MenuItem;
import android.view.View;
import android.widget.TabHost;
import android.widget.TextView;


public class Main extends TabActivity implements TabHost.TabContentFactory {


    TabHost tabHost;

    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        this.tabHost = getTabHost();  // The activity TabHost

        tabHost.addTab(tabHost.newTabSpec("http://www.google.com/").setIndicator("Google").setContent(this));
        tabHost.addTab(tabHost.newTabSpec("http://www.stackoverflow.com/").setIndicator("StackOverflow").setContent(this)); 
    }

    public View createTabContent(String tag) {

        // Inflation per se.
        // we don't return anything yet so we can work with this view
        View tab = View.inflate(this, R.layout.tab, null);

        // Here we work with the view
        // in this case we set the textview to match our tag
        // its a good way to parse arguments to the new tab
        TextView tv = (TextView) tab.findViewById(R.id.url_tv);
        tv.setText(tag);

        //After work we can return view
        return tab;  
    }


    private void addMethod(String webSiteURL, String webSiteName) {

        // Find a way that suits you to pass arguments to here

        tabHost.addTab(tabHost.newTabSpec(webSiteURL).setIndicator(webSiteName).setContent(this));

    }

    private void deleteMethod() {

        // Create a way to decide which tab to delete.
        // for instance, FindViewByTag is a method of ViewGroup and works
        // then call the parent of the view with
        // ViewGroup parent = (ViewGroup) viewToDelete.getParent();
        // finally use oarent.removeView(viewToDelete);

    }

    // Inflates menu when "menu Key" is pressed
    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        MenuInflater inflater = getMenuInflater();
        inflater.inflate(R.menu.menu, menu);
        return true;
    }


    // This method is called once the menu is selected
    @Override
    public boolean onOptionsItemSelected(MenuItem item) {


        switch (item.getItemId()) {

            case R.id.add:

                // These variable is created artificially so that something is passed to our addMethod
                // You should find a way to pass these argument to our method
                // can be a dialog screen, or getting the URL from somewhere
                // its your call
                String webSiteURL = "http://www.evonytools.org/";
                String webSiteName = "Tivie's Tools";

                addMethod(webSiteURL, webSiteName);

            case R.id.delete:

                deleteMethod();

                break;
        }
        return true;
    }  
}