[ANDROID] Membuat Image Slider
Selamat siang para developer android, kali saya akan sharing tentang bagaimana membuat image slider pada android dengan library dari . Langsung saja kita ke TKP...
Pertama kita import dulu library nya dengan cara buka build.gradle pada folder app/ lalu masukan librarynya seperti ini :
Setelah itu tekan tombol Sync Now lalu tunggu sampai proses build selesai. Sekarang kita buka AndroidManifest lalu masukan permission INTERNET dan
READ_EXTERNAL_STORAGE
Sekarang kita menuju ke activity_main.xml lalu buat seperti berikut ini :
Selanjutnya kita ke MainActivity lalu buat seperti ini :
Untuk melihat hasilnya kita Run Rpojectnya, dan berikut adalah hasilnya
Berikut tutorial singkat dari saya. Semoga bermanfaat untuk para developer semua.
Salam Sukses.
Pertama kita import dulu library nya dengan cara buka build.gradle pada folder app/ lalu masukan librarynya seperti ini :
dependencies {
compile "com.android.support:support-v4:+"
compile 'com.squareup.picasso:picasso:2.3.2'
compile 'com.nineoldandroids:library:2.4.0'
compile 'com.daimajia.slider:library:1.1.5@aar'
}
Setelah itu tekan tombol Sync Now lalu tunggu sampai proses build selesai. Sekarang kita buka AndroidManifest lalu masukan permission INTERNET dan
READ_EXTERNAL_STORAGE
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
Sekarang kita menuju ke activity_main.xml lalu buat seperti berikut ini :
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.panduseptian.imageslider.MainActivity">
<com.daimajia.slider.library.SliderLayout
android:id="@+id/slider"
android:layout_width="match_parent"
android:layout_height="200dp" />
</RelativeLayout>
Selanjutnya kita ke MainActivity lalu buat seperti ini :
package com.panduseptian.imageslider;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import com.daimajia.slider.library.Animations.DescriptionAnimation;
import com.daimajia.slider.library.SliderLayout;
import com.daimajia.slider.library.SliderTypes.BaseSliderView;
import com.daimajia.slider.library.SliderTypes.TextSliderView;
import com.daimajia.slider.library.Tricks.ViewPagerEx;
import java.util.HashMap;
public class MainActivity extends AppCompatActivity {
private SliderLayout sliderLayout;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
sliderLayout = (SliderLayout) findViewById(R.id.slider);
// Load image dari URL
HashMap<String,String> url_maps = new HashMap<String, String>();
url_maps.put("Hannibal", "http://static2.hypable.com/wp-content/uploads/2013/12/hannibal-season-2-release-date.jpg");
url_maps.put("Big Bang Theory", "http://tvfiles.alphacoders.com/100/hdclearart-10.png");
url_maps.put("House of Cards", "http://cdn3.nflximg.net/images/3093/2043093.jpg");
url_maps.put("Game of Thrones", "http://images.boomsbeat.com/data/images/full/19640/game-of-thrones-season-4-jpg.jpg");
// Load Image Dari res/drawable
HashMap<String,Integer> file_maps = new HashMap<String, Integer>();
file_maps.put("Hannibal",R.drawable.hannibal);
file_maps.put("Big Bang Theory",R.drawable.bigbang);
file_maps.put("House of Cards",R.drawable.house);
file_maps.put("Game of Thrones", R.drawable.game_of_thrones);
for(String name : file_maps.keySet()){
TextSliderView textSliderView = new TextSliderView(this);
// initialize a SliderLayout
textSliderView
.description(name)
.image(file_maps.get(name))
.setScaleType(BaseSliderView.ScaleType.Fit);
//add your extra information
textSliderView.bundle(new Bundle());
textSliderView.getBundle()
.putString("extra",name);
sliderLayout.addSlider(textSliderView);
}
sliderLayout.setPresetTransformer(SliderLayout.Transformer.Accordion);
sliderLayout.setPresetIndicator(SliderLayout.PresetIndicators.Center_Bottom);
sliderLayout.setCustomAnimation(new DescriptionAnimation());
sliderLayout.setDuration(4000);
}
}
Untuk melihat hasilnya kita Run Rpojectnya, dan berikut adalah hasilnya
Berikut tutorial singkat dari saya. Semoga bermanfaat untuk para developer semua.
Salam Sukses.






















