Selamat sore para developer, setelah sekian lama tidak posting kali ini saya akan memberikan alternatif untuk android networking dengan code yang simple dan sedikit. Sebelumnya saya menggunakan volley untuk netwroking dan jika dibandingkan dengan library ini dalam segi penggunaan source akan sangat jauh berbeda.

Fast Android Networking

Keunggulan dari library ini yang saya suka adalah fitur Upload dan Download nya, karena di Volley tidak terdapat fitur tersebut dan dengan source yang sedikit pula yang membuat saya ingin menggunakan library ini.

Berikut adalah perbedaan penggunaan Volley dengan FAN

- POST REQUEST

FAN

 AndroidNetworking.post("http://google.com/")  
          .addBodyParameter("firstname", "Pandu")  
          .addBodyParameter("lastname", "Septian")  
          .setPriority(Priority.MEDIUM)  
          .build()  
          .getAsJSONArray(new JSONArrayRequestListener() {  
           @Override  
           public void onResponse(JSONArray response) {  
            // do anything with response  
           }  
           @Override  
           public void onError(ANError error) {  
            // handle error  
           }  
         });   


VOLLEY

 // Instantiate the RequestQueue.  
 RequestQueue queue = Volley.newRequestQueue(this);  
 String url ="http://www.google.com";  
 // Request a string response from the provided URL.  
 StringRequest stringRequest = new StringRequest(Request.Method.GET, url,  
       new Response.Listener<String>() {  
   @Override  
   public void onResponse(String response) {  
     // Display the first 500 characters of the response string.  
     mTextView.setText("Response is: "+ response.substring(0,500));  
   }  
 }, new Response.ErrorListener() {  
   @Override  
   public void onErrorResponse(VolleyError error) {  
     mTextView.setText("That didn't work!");  
   }  
 })  
 {  
   @overide  
   protected Map<String, String> getParams() throws AuthFailureError {  
     HashMap<String, String> params = new HashMap<>();  
     params.put("firstname","Pandu");  
     params.put("lastname","Septian");  
     reutrn params;  
   }  
 };  
 // Add the request to the RequestQueue.  
 queue.add(stringRequest);  

Berikut adalah penjelasan singkat dari saya. Semoga bermanfaat.
Untuk link librarynya adalah dibawah ini :

https://amitshekhariitbhu.github.io/Fast-Android-Networking/index.html

Selamat pagi para developer.
Lama tidak posting, kali ini saya akan sharing tentang Parsing JSON pada android. Buat yang belum kenal sama JSON yuk kita kenalan dulu

JSON (JavaScript Object Notation) adalah format pertukaran data yang ringan, mudah dibaca dan ditulis oleh manusia, serta mudah diterjemahkan dan dibuat (generate) oleh komputer. Format ini dibuat berdasarkan bagian dari Bahasa Pemprograman JavaScript, Standar ECMA-262 Edisi ke-3 - Desember 1999. JSON merupakan format teks yang tidak bergantung pada bahasa pemprograman apapun karena menggunakan gaya bahasa yang umum digunakan oleh programmer keluarga C termasuk C, C++, C#, Java, JavaScript, Perl, Python dll. Oleh karena sifat-sifat tersebut, menjadikan JSON ideal sebagai bahasa pertukaran-data. Source : http://www.json.org/json-id.html

Nah kalo sudah paham mari kita parsing JSON pada android, karena sekarang banyak sekali API yang menggunakan format JSON, jadi penting sekali untuk memahami ini.

Pertama kita harus memahami Element pada sebuah data JSON

  • Array([) - Tanda [ (Square Bracket) adalah sebuah JSON Array
  • Objects({) - Tanda { (Curly bracket) adalah sebuah JSON Object
  • Key - Sebuah string yang berguna sebagai identifikasi sebuah value pada JSON Object
  • Value - Setiap Key memiliki value baik String,Integer,Double, Dll.

Berikut adalah contoh JSON data :


 {  
  "NAMA": "PANDU SEPTIAN GUMILAR",  
  "ALAMAT": "JAKARTA",  
  "JENIS_KELAMIN": "LAKI - LAKI",  
  "GOL_DARAH": "A",  
  "AGAMA": "ISLAM",  
  "PENDIDIKAN": [  
   {  
    "TINGKAT": "SD",  
    "NAMA": "SDN 01"  
   },  
   {  
    "TINGKAT": "SMP",  
    "NAMA": "SMP 01"  
   },  
   {  
    "TINGKAT": "SMA",  
    "NAMA": "SMA 01"  
   }  
  ]  
 }  

Berikut adalah cara parsing data diatas : 


 String jsonData;  
 JSONObject reader = new JSONObject(jsonData);  
 // Mengambil Data Nama  
 String nama = reader.getString("NAMA");  

Data JSON di deklarasikan kedalam string jsonData lalu kita buat reader sebagai parsing awal. Selanjutnya adalah mengambil data pendidikan sebagai Data Array yang akan kita looping dan kita ambil JSON Objectnya.

 JSONArray pendidikan = reader.getJSONArray("PENDIDIKAN");  
 // Looping Array  
 for(int i = 0; i < pendidikan.length(); i++){  
     //Buat JSON Object tiap item  
     JSONObject itemPendidikan = pendidikan.getJSONObject(i);  
     String tingkatPendidikan = itemPendidikan.getString("TINGKAT");  
     String namaPendidikan = itemPendidikan.getString("NAMA");  
 }  

Berikut adalah beberapa method : 

  • get(String name) - Method ini mengeluarkan value hanya pada tanpa tipe Object.
  • getBoolean(String name) - Method ini mengeluarkan data dengan tipe boolean.
  • getDouble(String name) - Method ini mengeluarkan data dengan tipe double.
  • getInt(String name) - Method ini mengeluarkan data dengan tipe integer.
  • getLong(String name) - Method ini mengeluarkan data dengan tipe long.
  • length() - Method ini mengeluarkan jumlah name/value yang ada pada sebuah object.

Mungkin cukup sekian sharing kali ini semoga bermanfaat dan bisa menambah ilmu para pembaca blog ini.
Terima Kasih sudah berkunjung di blog ini.
Salam :)

Halo para developer, setelah sekian lama tidak membuat postingan akhirnya sempat juga membuat post lagi. Dan kali ini saya akan berbagi cara membuat navigation drawer. Android Studio sudah menyediakan NavigationDrawer activity jadi yang kita akan lakukan adalah custom Navigation Drawer yang sudah tersedia tersebut. Oke Langsung saja kita buka Android Studio nya lalu buat project baru.


Kita tentukan nama aplikasi, domain dan project locationnya. Lalu klik Next


 Pilih minimum SDK nya lalu klik Next


Pada bagian ini kita pilih Navigation Drawer Activity dan klik Next dan Klik Next lagi pada bagian berikutnya. Maka akan tampil struktur project nya.



Dari struktur diatas yang akan kita ubah adalah pada bagian content_main.xml, nav_header_main.xml, activity_main_drawer.xml, dan MainActivity.java. 

Pertama kita ubah content_main.xml ubah root layoutnya menjadi FrameLayout, karena saya pada saat buat project adalah ConstraintLayout maka akan saya ubah dulu menjadi FrameLayout lalu berikan attribut id sehingga menjadi seperti ini :


 <?xml version="1.0" encoding="utf-8"?>  
 <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"  
   xmlns:app="http://schemas.android.com/apk/res-auto"  
   xmlns:tools="http://schemas.android.com/tools"  
   android:id="@+id/root_layout"  
   android:layout_width="match_parent"  
   android:layout_height="match_parent"  
   app:layout_behavior="@string/appbar_scrolling_view_behavior"  
   tools:context="com.panduseptian.navigationdrawertutorial.MainActivity"  
   tools:showIn="@layout/app_bar_main">  
 </FrameLayout>  

Setelah selesai maka kita akan pindah ke nav_header_main.xml. Disini kita bisa sesuaikan menu yang akan tampil pada aplikasi yang akan kita buat. Disini saya akan menghapus 2 item pada group item menjadi seperti ini : 



 <?xml version="1.0" encoding="utf-8"?>  
 <menu xmlns:android="http://schemas.android.com/apk/res/android">  
   <group android:checkableBehavior="single">  
     <item  
       android:id="@+id/nav_camera"  
       android:icon="@drawable/ic_menu_camera"  
       android:title="Import" />  
     <item  
       android:id="@+id/nav_gallery"  
       android:icon="@drawable/ic_menu_gallery"  
       android:title="Gallery" />  
   </group>  
   <item android:title="Communicate">  
     <menu>  
       <item  
         android:id="@+id/nav_share"  
         android:icon="@drawable/ic_menu_share"  
         android:title="Share" />  
       <item  
         android:id="@+id/nav_send"  
         android:icon="@drawable/ic_menu_send"  
         android:title="Send" />  
     </menu>  
   </item>  
 </menu>  

Dan menu sudah selesai kita buat, selanjutnya adalah merubah header dari Navigation Drawer di nav_header_main.xml. Disini saya akan menambahkan library CircleImageView di build.gradle



 dependencies {  
   ...  
   compile 'de.hdodenhof:circleimageview:2.1.0'  
 }  

* Untuk link dari Librarynya disini => https://github.com/hdodenhof/CircleImageView

 Lalu kita copy image ke folder drawable dan ubah menjadi seperti ini:



 <?xml version="1.0" encoding="utf-8"?>  
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
   xmlns:app="http://schemas.android.com/apk/res-auto"  
   android:layout_width="match_parent"  
   android:layout_height="@dimen/nav_header_height"  
   android:background="@drawable/side_nav_bar"  
   android:gravity="bottom"  
   android:orientation="vertical"  
   android:paddingBottom="@dimen/activity_vertical_margin"  
   android:paddingLeft="@dimen/activity_horizontal_margin"  
   android:paddingRight="@dimen/activity_horizontal_margin"  
   android:paddingTop="@dimen/activity_vertical_margin"  
   android:theme="@style/ThemeOverlay.AppCompat.Dark">  
   <de.hdodenhof.circleimageview.CircleImageView  
     android:id="@+id/imageView"  
     android:layout_width="72dp"  
     android:layout_height="72dp"  
     android:paddingTop="@dimen/nav_header_vertical_spacing"  
     android:src="@drawable/profile"/>  
   <TextView  
     android:layout_width="match_parent"  
     android:layout_height="wrap_content"  
     android:paddingTop="@dimen/nav_header_vertical_spacing"  
     android:text="Pandu Septian"  
     android:textAppearance="@style/TextAppearance.AppCompat.Body1" />  
   <TextView  
     android:id="@+id/textView"  
     android:layout_width="wrap_content"  
     android:layout_height="wrap_content"  
     android:text="pandusg404@gmail.com" />  
 </LinearLayout>  

Oke untuk viewnya sudah selesai, sebelum kita masuk ke MainActivity.java kita buat 2 Fragment yaitu Fragment1 dan Fragment2




Untuk layoutnya kita buat simple saja contohnya : 



 <FrameLayout 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="com.panduseptian.navigationdrawertutorial.Fragment2">  
   <!-- TODO: Update blank fragment layout -->  
   <!-- TODO: Update blank fragment layout -->  
   <TextView  
     android:layout_width="match_parent"  
     android:layout_height="match_parent"  
     android:gravity="center"  
     android:text="Fragment 2" />  
 </FrameLayout>  

Oke sekarang kita buka MainActivity.java

Kita tambahkan script berikut pada onCreate : 


 FragmentTransaction fragmentTransaction = getSupportFragmentManager().beginTransaction();  
 fragmentTransaction.replace(R.id.root_layout, new Fragment1());  
 fragmentTransaction.commit();  

Lalu pada onNavigationItemSelected kita tambahkan script berikut :

 int id = item.getItemId();  
     switch (id){  
       case R.id.nav_camera:  
         FragmentTransaction fragmentTransaction = getSupportFragmentManager().beginTransaction();  
         fragmentTransaction.replace(R.id.root_layout, new Fragment1());  
         fragmentTransaction.commit();  
         break;  
       case R.id.nav_gallery:  
         FragmentTransaction fragmentTransaction1 = getSupportFragmentManager().beginTransaction();  
         fragmentTransaction1.replace(R.id.root_layout, new Fragment2());  
         fragmentTransaction1.commit();  
         break;  
     }  
     DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);  
     drawer.closeDrawer(GravityCompat.START);  
     return true;  


Sehingga menjadi seperti ini : 



 package com.panduseptian.navigationdrawertutorial;  
 import android.os.Bundle;  
 import android.support.design.widget.FloatingActionButton;  
 import android.support.design.widget.Snackbar;  
 import android.support.v4.app.FragmentTransaction;  
 import android.view.View;  
 import android.support.design.widget.NavigationView;  
 import android.support.v4.view.GravityCompat;  
 import android.support.v4.widget.DrawerLayout;  
 import android.support.v7.app.ActionBarDrawerToggle;  
 import android.support.v7.app.AppCompatActivity;  
 import android.support.v7.widget.Toolbar;  
 import android.view.Menu;  
 import android.view.MenuItem;  
 public class MainActivity extends AppCompatActivity  
     implements NavigationView.OnNavigationItemSelectedListener {  
   @Override  
   protected void onCreate(Bundle savedInstanceState) {  
     super.onCreate(savedInstanceState);  
     setContentView(R.layout.activity_main);  
     Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);  
     setSupportActionBar(toolbar);  
     FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);  
     fab.setOnClickListener(new View.OnClickListener() {  
       @Override  
       public void onClick(View view) {  
         Snackbar.make(view, "Replace with your own action", Snackbar.LENGTH_LONG)  
             .setAction("Action", null).show();  
       }  
     });  
     FragmentTransaction fragmentTransaction = getSupportFragmentManager().beginTransaction();  
     fragmentTransaction.replace(R.id.root_layout, new Fragment1());  
     fragmentTransaction.commit();  
     DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);  
     ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(  
         this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);  
     drawer.setDrawerListener(toggle);  
     toggle.syncState();  
     NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);  
     navigationView.setNavigationItemSelectedListener(this);  
   }  
   @Override  
   public void onBackPressed() {  
     DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);  
     if (drawer.isDrawerOpen(GravityCompat.START)) {  
       drawer.closeDrawer(GravityCompat.START);  
     } else {  
       super.onBackPressed();  
     }  
   }  
   @Override  
   public boolean onCreateOptionsMenu(Menu menu) {  
     // Inflate the menu; this adds items to the action bar if it is present.  
     getMenuInflater().inflate(R.menu.main, menu);  
     return true;  
   }  
   @Override  
   public boolean onOptionsItemSelected(MenuItem item) {  
     // Handle action bar item clicks here. The action bar will  
     // automatically handle clicks on the Home/Up button, so long  
     // as you specify a parent activity in AndroidManifest.xml.  
     int id = item.getItemId();  
     //noinspection SimplifiableIfStatement  
     if (id == R.id.action_settings) {  
       return true;  
     }  
     return super.onOptionsItemSelected(item);  
   }  
   @SuppressWarnings("StatementWithEmptyBody")  
   @Override  
   public boolean onNavigationItemSelected(MenuItem item) {  
     // Handle navigation view item clicks here.  
     int id = item.getItemId();  
     switch (id){  
       case R.id.nav_camera:  
         FragmentTransaction fragmentTransaction = getSupportFragmentManager().beginTransaction();  
         fragmentTransaction.replace(R.id.root_layout, new Fragment1());  
         fragmentTransaction.commit();  
         break;  
       case R.id.nav_gallery:  
         FragmentTransaction fragmentTransaction1 = getSupportFragmentManager().beginTransaction();  
         fragmentTransaction1.replace(R.id.root_layout, new Fragment2());  
         fragmentTransaction1.commit();  
         break;  
     }  
     DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);  
     drawer.closeDrawer(GravityCompat.START);  
     return true;  
   }  
 }  

Oke sekarang kita build dan run ke HP android kita dan hasilnya seperti ini : 




Cukup sekian tutorial singkatnya, semoga bermanfaat buat teman-teman developer semua.

Pada kesempatan kali ini saya ingin berbagi kepada para developer semua tentang Membuat Realtime Chat dengan menggunakan Firebase. Buat yang belum tau apa itu FireBase silakan baca disini Apa itu FIREBASE?

Sebelum ke praktek mari kita bahas dulu Kenapa harus menggunakan Firebase? toh pake Ajax bisa?. Jawabannya adalah Jika kita menggunakan ajax memerlukan proses request secara berulang-ulang yang dibutuhkan untuk mengambil data dari server sehingga akan membebankan server. Sedangkan jika kita menggunakan Firebase kita tidak perlu request data untuk mendapatkan sebuah data melainkan server yang akan memberikan data itu ketika ada sebuah perubahan. Contoh ketika kita menggunakan ajax agar realtime maka aplikasi kita akan melakukan request setiap 500ms sekali dengan kata lain 1 second terdapat 2 Request secara berulang ketika ada 100 user dalam waktu 1 Detik maka terdapat 200 request dalam 1 Detik dan terus menerus setiap menit, jam, hari, bulan dan server kita lebih sering Down. Berikut adalah penjelasan yang saya pelajari dan saya pahami.

Nah kalo sudah paham kita lanjutkan tutorialnya. Pertama yang harus kita lakukan adalah menuju ke Firebase Console berikut link nya https://console.firebase.google.com.


Lalu kita buat proyek baru, akan muncul form isian lalu isi nama proyek dan negaranya.


Selanjutnya kita klik menu Database lalu pilih tab Aturan lalu buat menjadi seperti ini :

Lalu klik Publikasikan.

Selanjutnya kita pilih tab Data dan buat Child dengan nama Chat dan Value "" seperti ini :



Oke, settingan untuk aturan sudah selesai sekarang kita menuju menu Overview lalu klik menu Tambahkan Firebase ke aplikasi web Anda. Maka akan muncul popup seperti gambar dan click salin.



Langkah selanjutnya adalah membuat file HTML untuk chat formnya dan jangan lupa menyispkan code dari popup yang sudah kita salin tadi dari firebase, kurang lebih seperti berikut :
 
 <html>  
 <head>  
      <title>Realtime Chat</title>  
      <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">  
      <script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>  
      <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>  
      <style>  
           .message-bubble   
           {  
                padding: 10px 0px 10px 0px;  
           }  
           .message-bubble:nth-child(even) { background-color: #F5F5F5; }  
           .message-bubble > *  
           {  
                padding-left: 10px;    
           }  
           .panel-body { padding: 0px; }  
           .panel-heading { background-color: #3d6da7 !important; color: white !important; }  
      </style>  
 </head>  
 <body>  
      <div class="container">  
           <div class="row">  
                <div class="panel panel-default">  
                 <div class="panel-heading">Panel heading without title</div>  
                 <div class="panel-body">  
                     <div class="container" id="chat_data">  
                     </div>  
                     <div class="panel-footer">  
                          <div class="row">  
                               <div class="col-md-4">  
                                    <input type="text" id="name" class="form-control">  
                               </div>  
                               <div class="col-md-8">  
                                    <div class="input-group">  
                                     <input type="text" id="msg" class="form-control">  
                                     <span class="input-group-btn">  
                                         <button class="btn btn-default" type="button">Send</button>  
                                     </span>  
                                    </div>  
                               </div>  
                          </div>  
                     </div>  
                 </div>  
                </div>  
           </div>  
      </div>  
      <script src="https://www.gstatic.com/firebasejs/3.6.3/firebase.js"></script>  
      <script>  
           // Initialize Firebase  
           var config = {  
                apiKey: "AIzaSyAmW1Y2cudtWX_jTYUde01-yKz1K-WnMgk",  
                authDomain: "realtime-chat-6c6e4.firebaseapp.com",  
                databaseURL: "https://realtime-chat-6c6e4.firebaseio.com",  
                storageBucket: "realtime-chat-6c6e4.appspot.com",  
                messagingSenderId: "31374372226"  
           };  
           firebase.initializeApp(config);  
           $(document).ready(function(){  
                var rootchatref = firebase.database().ref('/');  
                var chatref = firebase.database().ref('/Chat');  
                chatref.on('child_added', function(snapshot) {  
                     var data = snapshot.val();  
                     //console.log(data);  
                     $('#chat_data').prepend('<div class="row message-bubble"><p class="text-muted">'+data.user+'</p><span>'+data.msg+'</span></div>');  
                });  
           });  
           function writeChat(user, msg) {  
            // A post entry.  
            var postData = {  
                msg : msg,  
                user: user,  
            };  
            // Get a key for a new Post.  
            var newPostKey = firebase.database().ref().child('Chat').push().key;  
            // Write the new post's data simultaneously in the posts list and the user's post list.  
            var updates = {};  
            updates['/Chat/'+newPostKey] = postData;  
            return firebase.database().ref().update(updates);  
           }  
           $("#msg").keypress(function(e) {  
                var name = $('#name').val();  
                var msg = $('#msg').val();  
                if(e.which == 13) {  
                     if(name == ''){  
                          alert('Isi nama terlebih dahulu..');  
                          $('#name').focus();  
                          return false;  
                     }  
                     if(msg == ''){  
                          alert('Pesan tidakk boleh kosong');  
                          $('#msg').focus();  
                          return false;  
                     }  
                     writeChat(name, msg);  
                     $('#msg').val('');  
                }  
           });  
      </script>  
 </body>  
 </html>  

Oke semua sudah selesai. dan untuk mencobanya kita buka 2 Browser untuk membuktikan Jika Chat Ini realtime.



Berhasil dan realtime :D
Mungkin cukup sekian sharingnya kali ini semoga bermanfaat untuk teman-teman semua.

Selamat pagi para developer kali ini saya akan meneruskan tutorial Membuat Material Sliding Tab, yaitu membuat ListView pada Fragment.

Oke langsung saja kita menuju view pada Fragment lalu buat seperti berikut :

 <FrameLayout 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="com.panduseptian.slidingtab.CallsFragment">  
   <ListView  
     android:id="@+id/list"  
     android:layout_width="match_parent"  
     android:layout_height="match_parent">  
   </ListView>  
 </FrameLayout>  

Jika sudah, kita menuju Fragment nya lalu masukan code seperti berikut :

 package com.panduseptian.slidingtab;  
 import android.os.Bundle;  
 import android.support.v4.app.Fragment;  
 import android.view.LayoutInflater;  
 import android.view.View;  
 import android.view.ViewGroup;  
 import android.widget.AdapterView;  
 import android.widget.ArrayAdapter;  
 import android.widget.ListView;  
 import android.widget.Toast;  
 /**  
  * A simple {@link Fragment} subclass.  
  */  
 public class CallsFragment extends Fragment {  
   public CallsFragment() {  
     // Required empty public constructor  
   }  
   @Override  
   public View onCreateView(LayoutInflater inflater, ViewGroup container,  
                Bundle savedInstanceState) {  
     View rootView = inflater.inflate(R.layout.fragment_calls, container, false);  
     ListView listview =(ListView) rootView.findViewById(R.id.list);  
     final String[] items = new String[] {"Item 1", "Item 2", "Item 3"};  
     ArrayAdapter<String> adapter = new ArrayAdapter<String>(getActivity(), android.R.layout.simple_list_item_1, items);  
     listview.setAdapter(adapter);  
     listview.setOnItemClickListener(new AdapterView.OnItemClickListener() {  
       @Override  
       public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) {  
         Toast.makeText(getActivity().getApplicationContext(), items[i], Toast.LENGTH_SHORT).show();  
       }  
     });  
     return rootView;  
   }  
 }  

Jika sudah kita run project, maka hasilnya akan seperti berikut :


Mungkin cukup sekian sharing singkatnya, semoga bermanfaat, Terima kasih..

Selamat siang para developer kali ini kita akan membahas tab sliding seperti aplikasi whatsapp karena ada yang request dari facebook.

Oke langsung saja, pertama kita buat project baru lalu import repository design pada build.gradle kita. Perlu diingat versi yang di import harus sesuai dengan yang ada di SDK teman-teman.

Contoh gambar dibawah ini, yang saya block adalah versi dari SDK teman-teman.



 compile 'com.android.support:design:VERSI REPO'  

Jika sudah sekarang kita buat layoutnya terlebih dahulu. Kita buka activity_main.xml lalu buat seperti berikut :

 <?xml version="1.0" encoding="utf-8"?>  
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
   xmlns:tools="http://schemas.android.com/tools"  
   xmlns:app="http://schemas.android.com/apk/res-auto"  
   android:id="@+id/activity_main"  
   android:layout_width="match_parent"  
   android:layout_height="match_parent"  
   android:orientation="vertical"  
   tools:context="com.panduseptian.slidingtab.MainActivity">  
   <android.support.design.widget.TabLayout  
     android:id="@+id/slide"  
     android:layout_width="match_parent"  
     android:layout_height="wrap_content"  
     android:background="@color/colorPrimary"  
     app:tabGravity="fill"  
     app:tabMode="fixed">  
   </android.support.design.widget.TabLayout>  
   <android.support.v4.view.ViewPager  
     android:id="@+id/pager"  
     android:layout_width="match_parent"  
     android:layout_height="match_parent"></android.support.v4.view.ViewPager>  
 </LinearLayout>  

Kita buat 3 fragment untuk di tampilkan pada viewpager dengan cara sperti gambar dibawah :



Jika frgament sudah dibuat, sekarang kita buat adapternya seperti berikut :


Lalu masukan codingan seperti ini :


 package com.panduseptian.slidingtab;  
 import android.support.v4.app.Fragment;  
 import android.support.v4.app.FragmentManager;  
 import android.support.v4.app.FragmentPagerAdapter;  
 /**  
  * Created by pandu on 29/11/16.  
  */  
 public class PagerAdapter extends FragmentPagerAdapter {  
   public PagerAdapter(FragmentManager fm) {  
     super(fm);  
   }  
   @Override  
   public Fragment getItem(int position) {  
     switch (position){  
       case 0:  
         return new CallsFragment();  
       case 1:  
         return new ChatsFragment();  
       case 2:  
         return new ContactsFragment();  
     }  
     return null;  
   }  
   @Override  
   public int getCount() {  
     return 3;  
   }  
   @Override  
   public CharSequence getPageTitle(int position) {  
     switch (position){  
       case 0:  
         return "Calls";  
       case 1:  
         return "Chats";  
       case 2:  
         return "Contacts";  
     }  
     return super.getPageTitle(position);  
   }  
 }  

Sekarang kita ke MainActivity.java


 package com.panduseptian.slidingtab;  
 import android.support.design.widget.TabLayout;  
 import android.support.v4.view.ViewPager;  
 import android.support.v7.app.AppCompatActivity;  
 import android.os.Bundle;  
 public class MainActivity extends AppCompatActivity {  
   private ViewPager viewPager;  
   private PagerAdapter adapter;  
   private TabLayout tabLayout;  
   @Override  
   protected void onCreate(Bundle savedInstanceState) {  
     super.onCreate(savedInstanceState);  
     setContentView(R.layout.activity_main);  
     getSupportActionBar().setElevation(0);  
     viewPager = (ViewPager) findViewById(R.id.pager);  
     adapter = new PagerAdapter(getSupportFragmentManager());  
     viewPager.setAdapter(adapter);  
     tabLayout = (TabLayout) findViewById(R.id.slide);  
     tabLayout.addTab(tabLayout.newTab().setText("Calls"));  
     tabLayout.addTab(tabLayout.newTab().setText("Chats"));  
     tabLayout.addTab(tabLayout.newTab().setText("Contacts"));  
     viewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout));  
     tabLayout.setupWithViewPager(viewPager);  
   }  
 }  

Jika sudah kita Run projectnya, Maka hasilnya seperti berikut :







Cukup sekian tutorial singkatnya, Semoga bermanfaat.

Pandu Septian Gumilar

{picture#http://kekirian.com/wp-content/uploads/2015/12/10419440_814838468537519_2081836625630750537_n-150x150.jpg} YOUR_PROFILE_DESCRIPTION {facebook#YOUR_SOCIAL_PROFILE_URL} {twitter#YOUR_SOCIAL_PROFILE_URL} {google#YOUR_SOCIAL_PROFILE_URL} {pinterest#YOUR_SOCIAL_PROFILE_URL} {youtube#YOUR_SOCIAL_PROFILE_URL} {instagram#YOUR_SOCIAL_PROFILE_URL}
Powered by Blogger.