Membuat Aplikasi Android Flora Fauna menggunakan Tab Host dan Button

Pada Tugas kali ini, Akan mencoba untuk membuat aplikasi androin menggunakan

Tab Host
Web View
Button

Naaah, penasaran kan? Yuk check this out!!!

1. Pertama kita buat tampilan Login seperti berikut


Berikut isi file Java :

package com.example.wijanghidayat161021401424;

import android.os.Bundle;
import android.app.Activity;
import android.content.Intent;
import android.view.View;
import android.widget.EditText;
import android.widget.Toast;

public class MainActivity extends Activity {

private EditText uname;
private EditText pass;

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

setContentView(R.layout.activity_main);
uname = (EditText) findViewById(R.id.uname);
pass = (EditText) findViewById(R.id.pass);
}

public void login(View view) {
String Nama = uname.getText().toString();
String Pass = pass.getText().toString();
if (Nama.equals("admin") && Pass.equals("admin")) {
Intent i = new Intent(this, TabhostActivity.class);
startActivityForResult(i, 0);

}
else {
Toast.makeText(getApplicationContext(),
"Password atau username salah, Silahkan masukkan lagi",
Toast.LENGTH_LONG).show();
}
}

}

Dan file XML nya

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity" >

    <EditText
        android:id="@+id/uname"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="88dp"
        android:ems="10"
        android:hint="User Name" />

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignRight="@+id/uname"
        android:layout_below="@+id/pass"
        android:layout_marginTop="32dp"
        android:text="Login"
        android:onClick="login" />

    <EditText
        android:id="@+id/pass"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/uname"
        android:layout_below="@+id/uname"
        android:layout_marginTop="28dp"
        android:ems="10"
        android:hint="Password"
        android:inputType="textPassword" >

        <requestFocus />
    </EditText>


</RelativeLayout>

2. Setelah Login, akan Tampil Tab host sebagai berikut!



Naah, berikut file .Java 

package com.example.wijanghidayat161021401424;

import android.os.Bundle;
import android.app.Activity;
import android.app.TabActivity;
import android.content.Intent;
import android.view.Menu;
import android.widget.TabHost;

public class TabhostActivity extends TabActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_tabhost);

Intent intent;
     TabHost tabHost = getTabHost();
     TabHost.TabSpec spec;
       
             
     intent = new Intent().setClass(this, FaunaActivity.class);
     spec = getTabHost().newTabSpec("Fauna").setIndicator("Fauna").setContent(intent);
     tabHost.addTab(spec);
       
     intent = new Intent().setClass(this, FloraActivity.class);
     spec = getTabHost().newTabSpec("Flora").setIndicator("Flora").setContent(intent);
     tabHost.addTab(spec);
       
   
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.activity_tabhost, menu);
return true;
}

}
 

XML nya:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".TabhostActivity" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:text="@string/hello_world" />

    <TabHost
        android:id="@android:id/tabhost"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true" >

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical" >

            <TabWidget
                android:id="@android:id/tabs"
                android:layout_width="match_parent"
                android:layout_height="wrap_content" >
            </TabWidget>

            <FrameLayout
                android:id="@android:id/tabcontent"
                android:layout_width="match_parent"
                android:layout_height="match_parent" >

                <LinearLayout
                    android:id="@+id/tab1"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent" >
                </LinearLayout>

                <LinearLayout
                    android:id="@+id/tab2"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent" >
                </LinearLayout>

                <LinearLayout
                    android:id="@+id/tab3"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent" >
                </LinearLayout>
            </FrameLayout>
        </LinearLayout>
    </TabHost>

</RelativeLayout>

3. Nah tadi itu untuk Tab Host nya, Untuk Tampilan Fauna nya Seperti berikut

Berikut .Java
package com.example.wijanghidayat161021401424;

import android.os.Bundle;
import android.app.Activity;
import android.content.Intent;
import android.view.Menu;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;

public class FaunaActivity extends Activity {
Button button1,button2,button3;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_fauna);
button1 = (Button) findViewById(R.id.button1);
button1.setOnClickListener(new OnClickListener() {
public void onClick(View v) {
Intent intentOrangUtan = new Intent(FaunaActivity.this,OrangUtanActivity.class);
FaunaActivity.this.startActivity(intentOrangUtan);
FaunaActivity.this.finish();
}
});
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.activity_fauna, menu);
return true;
}

}
 
Dan XML nya

package com.example.wijanghidayat161021401424;

import android.os.Bundle;
import android.app.Activity;
import android.content.Intent;
import android.view.Menu;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;

public class FaunaActivity extends Activity {
Button button1,button2,button3;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_fauna);
button1 = (Button) findViewById(R.id.button1);
button1.setOnClickListener(new OnClickListener() {
public void onClick(View v) {
Intent intentOrangUtan = new Intent(FaunaActivity.this,OrangUtanActivity.class);
FaunaActivity.this.startActivity(intentOrangUtan);
FaunaActivity.this.finish();
}
});
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.activity_fauna, menu);
return true;
}

}


4. Untuk yang tampilan Flora

Berikut file .Java
package com.example.wijanghidayat161021401424;

import android.os.Bundle;
import android.app.Activity;
import android.content.Intent;
import android.view.Menu;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;

public class FloraActivity extends Activity {
Button button1,button2,button3;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_flora);
button1 = (Button) findViewById(R.id.button1);
button1.setOnClickListener(new OnClickListener() {
public void onClick(View v) {
Intent intentBangkai = new Intent(FloraActivity.this,BangkaiActivity.class);
FloraActivity.this.startActivity(intentBangkai);
FloraActivity.this.finish();
}
});
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.activity_flora, menu);
return true;
}

}
 
Dan XML nya:

package com.example.wijanghidayat161021401424;

import android.os.Bundle;
import android.app.Activity;
import android.content.Intent;
import android.view.Menu;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;

public class FloraActivity extends Activity {
Button button1,button2,button3;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_flora);
button1 = (Button) findViewById(R.id.button1);
button1.setOnClickListener(new OnClickListener() {
public void onClick(View v) {
Intent intentBangkai = new Intent(FloraActivity.this,BangkaiActivity.class);
FloraActivity.this.startActivity(intentBangkai);
FloraActivity.this.finish();
}
});
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.activity_flora, menu);
return true;
}

}


5. Sudah tampil semua kan? Naah berikutnya tampilan yang terhubung dengan Web View. Untuk contoh 1 halaman yang Bunga Bangkai!


Nah, File Java nya


package com.example.wijanghidayat161021401424;


import android.os.Bundle;
import android.annotation.SuppressLint;
import android.app.Activity;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.view.Menu;

@SuppressLint("SetJavaScriptEnabled") public class BangkaiActivity extends Activity {
private void tampilweb(String url){
WebView webviewku = (WebView) findViewById(R.id.webView1);
webviewku.loadUrl(url);
webviewku.getSettings().setJavaScriptEnabled(true);
webviewku.setWebViewClient(new WebViewClient());
}

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_bangkai);
tampilweb("https://www.youtube.com/watch?v=yqBB1JMoFAU");
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.activity_bangkai, menu);
return true;
}

}

Dan untuk XML nya

package com.example.wijanghidayat161021401424;


import android.os.Bundle;
import android.annotation.SuppressLint;
import android.app.Activity;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.view.Menu;

@SuppressLint("SetJavaScriptEnabled") public class BangkaiActivity extends Activity {
private void tampilweb(String url){
WebView webviewku = (WebView) findViewById(R.id.webView1);
webviewku.loadUrl(url);
webviewku.getSettings().setJavaScriptEnabled(true);
webviewku.setWebViewClient(new WebViewClient());
}

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_bangkai);
tampilweb("https://www.youtube.com/watch?v=yqBB1JMoFAU");
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.activity_bangkai, menu);
return true;
}

}


6. Selanjutnya, kalian bisa tambahkan isi menu dari list Flora dan Fauna sesuai keinginan kalian!

7. Nah, Untuk terhubung ke Internet, Tambahkan Commend berikut di Android Manifest!

  <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />


8. Dan kalian juga bisa mempercantik Tampilan sesuai keinginan anda!


Sekian dan Terima Kasih

Comments

Popular Posts