Aplikasi Android Tab Host dan Web View pada penggalangan dana

pada tanggal
Assalamu’alaikum Warahmatullahi Wabarakatu

 Masih bersama kumpulan bagi info, kali ini admin akan membagikan cara membuat aplikasi android Web View dan Tab host yang mengambil soucrh web pada www.pppa.or.id dan www.sedekahonline.com
Pertama tama siapkan dulu aplikasi Eclips yang sudah kalian instal

 Buat Project baru dengan nama aplikasi yang kalian inginkan, untuk kali ini kita akan membuat 5 activity.
Berikut ini merupakan langkah-langkah untuk membuat aplikasi tersebut :

 1) Buat Activity Loginnya

 Berikut ini coding LoginActivity.java

 package com.example.penggalangandana;

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

 public class LoginActivity extends Activity {
EditText user;
EditText password;
Button login;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_login);
        user = (EditText) findViewById(R.id.editText1);
        password = (EditText) findViewById(R.id.editText2);
 
        }
    public void Login (View view){
    String nama = user.getText().toString();
    String pas = password.getText().toString();
    if (nama.equals("adlan")&& pas.equals("123")){
    Intent i = new Intent (this, MenuActivity.class);
    startActivityForResult (i, 0);
    }
    }

    @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_login, menu);
        return true;
    }
 
}


Berikut ini Coding activity_login.xml

<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=".LoginActivity" >

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_marginLeft="18dp"
        android:layout_marginTop="63dp"
        android:text="Email"
        android:textAppearance="?android:attr/textAppearanceMedium" />

    <EditText
        android:id="@+id/editText1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignTop="@+id/textView1"
        android:layout_marginLeft="42dp"
        android:layout_toRightOf="@+id/textView1"
        android:ems="10"
        android:inputType="textEmailAddress" >

        <requestFocus />
    </EditText>

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/textView1"
        android:layout_below="@+id/editText1"
        android:layout_marginTop="34dp"
        android:text="Password"
        android:textAppearance="?android:attr/textAppearanceMedium" />

    <EditText
        android:id="@+id/editText2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/editText1"
        android:layout_alignTop="@+id/textView2"
        android:ems="10"
        android:inputType="textPassword" />

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/editText2"
        android:layout_centerVertical="true"
        android:onClick="Login"
        android:text="Login" />

</RelativeLayout>

Pada tahap ini Perhatikan pada imageview login terdapat android:onClick=”login” yang nanti nya di gunakan untuk memanggil fungsi yang terdapat pada LoginActivity.java

 Ini Adalah hasil dari program yang sudah di buat




2. Buat Activity Tab Host

 Berikut Coding MenuActivity.java

 package com.example.penggalangandana;
import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.app.TabActivity;
import android.content.Intent;
import android.widget.TabHost;

 public class MenuActivity extends TabActivity {

 @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_menu);
Intent intent;
        TabHost tabHost = getTabHost();
        TabHost.TabSpec spec;
     
        intent =new Intent().setClass(this,VisimisiActivity.class);
        spec = getTabHost().newTabSpec("Visi Misi").setIndicator("Visi Misi").setContent(intent);
        tabHost.addTab(spec);
     
        intent =new Intent().setClass(this,BeritaActivity.class);
        spec = getTabHost().newTabSpec("Berita").setIndicator("Berita").setContent(intent);
        tabHost.addTab(spec);
     
        intent =new Intent().setClass(this,DonasiActivity.class);
        spec = getTabHost().newTabSpec("Donasi").setIndicator("Donasi").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_menu, menu);
return true;
}
}

 Berikut coding Activity_menu.xml

 <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=".MenuActivity" >

    <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>

 Ini Adalah hasil dari program yang sudah di buat


3) Membuat Activity Visi Misi 

 Berikut VisiMisiActivity.Java

 package com.example.penggalangandana;

 import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;

 public class VisimisiActivity extends Activity {

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

 @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_visimisi, menu);
return true;
}
}

Berikut ini activity_visimisi.xml

<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=".VisimisiActivity" >

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="16dp"
        android:text="VISI"
        android:textAppearance="?android:attr/textAppearanceMedium" />

    <TextView
        android:id="@+id/textView4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_below="@+id/textView3"
        android:layout_marginTop="18dp"
        android:text="1. Menjadikan Tahfidzul Qur’an sebagai budaya hidup masyarakat Indonesia" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_below="@+id/textView1"
        android:layout_marginTop="16dp"
        android:text="Membangun masyarakat madani berbasis Tahfidzul Qur’an untuk kemandirian ekonomi, sosial, budaya, dan pendidikan bertumpu pada sumberdaya lokal yang berorientasi pada pemuliaan Al-Qur’an." />

    <TextView
        android:id="@+id/textView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/textView1"
        android:layout_below="@+id/textView2"
        android:layout_marginTop="16dp"
        android:text="MISI"
        android:textAppearance="?android:attr/textAppearanceMedium" />

    <TextView
        android:id="@+id/textView5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_below="@+id/textView4"
        android:text="2. Mewujudkan kemandirian ekonomi, pangan, pendidikan, dan kemandirian teknologi berbasis Tahfidzul Qur’an" />

    <TextView
        android:id="@+id/textView6"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/textView5"
        android:layout_centerHorizontal="true"
        android:text="3. Menjadikan Indonesia bebas buta Al-Qur’an" />

    <TextView
        android:id="@+id/textView7"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_below="@+id/textView6"
        android:text="4. Menjadi lembaga yang menginspirasi masyarakat untuk peduli dan berpihak pada kaum lemah melalui nilai-nilai sedekah" />

    <TextView
        android:id="@+id/textView8"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_below="@+id/textView7"
        android:text="5. Menjadi lembaga pengelola sedekah yang profesional, transparan, akuntabel, dan terpercaya." />

</RelativeLayout>

 Ini Adalah hasil dari program yang sudah di buat


4) Membuat Activity Berita 

Berikut ini BeritaActivity.java

package com.example.penggalangandana;

import android.os.Bundle;
import android.app.Activity;
import android.webkit.WebView;
import android.webkit.WebViewClient;

public class BeritaActivity 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_berita);
tampilweb("http://pppa.or.id/");
}
}

Berikut ini activity_berita.xml

<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=".BeritaActivity" >

    <WebView
        android:id="@+id/webView1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true" />

</RelativeLayout>

 Ini Adalah hasil dari program yang sudah di buat

5) Membuat Activity Donasi

Berikut ini Activity DonasiAtivity.java 

package com.example.penggalangandana;

import android.os.Bundle;
import android.app.Activity;
import android.webkit.WebView;
import android.webkit.WebViewClient;

public class DonasiActivity 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_donasi);
tampilweb("https://m.sedekahonline.com/");
}
}

Berikut ini activity_donasi.xml

<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=".DonasiActivity" >

    <WebView
        android:id="@+id/webView1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true" />

</RelativeLayout>



6) Langkah Terakhir jangan lupa edit AndroidManifest.xml

Langkah terakhir adalah tambah permission di dalam AndroidManifest.xml agar aplikasi nanti yang kita buat bisa terhubung ke internet dan berikut code codingnya.
<?xml version="1.0" encoding="utf-8"?>

<manifest xmlns:android="http://schemas.android.com/apk/res/android"

    package="com.example.penggalangandana"

    android:versionCode="1"

    android:versionName="1.0" >



    <uses-sdk

        android:minSdkVersion="8"

        android:targetSdkVersion="17" />



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

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



    <application

        android:allowBackup="true"

        android:icon="@drawable/ic_launcher"

        android:label="@string/app_name"

        android:theme="@style/AppTheme" >

        <activity

            android:name="com.example.penggalangandana.LoginActivity"

            android:label="@string/app_name" >

            <intent-filter>

                <action android:name="android.intent.action.MAIN" />



                <category android:name="android.intent.category.LAUNCHER" />

            </intent-filter>

        </activity>

        <activity

            android:name="com.example.penggalangandana.MenuActivity"

            android:label="@string/title_activity_menu" >

        </activity>
        <activity
            android:name="com.example.penggalangandana.VisimisiActivity"
            android:label="@string/title_activity_visimisi" >
        </activity>
        <activity
            android:name="com.example.penggalangandana.BeritaActivity"
            android:label="@string/title_activity_berita" >
        </activity>
        <activity
            android:name="com.example.penggalangandana.DonasiActivity"
            android:label="@string/title_activity_donasi" >
        </activity>
    </application>
</manifest>


Sekian pada saya mengenai langkah langkah membuat aplikasi android tab host dan web view 

 Wassalamualaikum Warahmatullahi Wabarakatu..

Lokasi: Indonesia

Komentar

Posting Komentar