D A S E N Y
ساخت Image Slider حرفه ای در برنامه نویسی اندروید

با سلام خدمت تمامی همراهان سایت Daseny و برنامه نویسان عزیز. در این آموزش قصد داریم با ساخت Image Slider حرفه ای در برنامه نویسی اندروید آشنا شویم.

وجود یک اسلایدر عکس علاوه بر اینکه می تواند در زیبایی برنامه شما موثر باشد، این امکان را به شما می دهد که موارد مهم را در کمترین جا به کاربر نمایش دهید. برای مثال برخی از محصولات شما تخفیف ویژه دارند و قصد دارید کاربران از این موضوع مطلع شوند. در این مورد Image Slider می تواند انتخاب خوبی برای شما باشد. برای ساخت Image Slider حرفه ای در برنامه نویسی اندروید ، می توانید از کتابخانه Image Sllide Show استفاده کنید. برای آموزش استفاده از این کتابخانه در ادامه با ما همراه باشید.

ساخت Image slider حرفه ای در برنامه نویسی اندرید با Image Slide Show

برای استفاده از کتابخانه Image Slide Show ابتدا باید آن را به پروژه خودتان اضافه کنید. برای این کار ابتدا کد زیر را به بخش repositories اضافه کنید.

maven { url 'https://jitpack.io' }

سپس کد زیر را نیز به dependencies بیافزائید و بر روی Sync Now کلیک کنید.

implementation 'com.github.denzcoskun:ImageSlideshow:0.0.4'

پس از اینکه کتابخانه با موفقیت به برنامه اضافه شد کدهای زیر را در Layout برنامه خودتان قرار دهید.

<com.denzcoskun.imageslider.ImageSlider
    android:layout_width="match_parent"
    android:layout_height="320dp"
    android:id="@+id/imageSlider"
    app:error_image="@drawable/error"
    app:placeholder="@drawable/placeholder"
    app:delay="10000"
    app:auto_cycle="true"
    app:corner_radius="45"/>

در کد بالا چند خط جدید وجود دارد که به ترتیب عبارت اند از:

error_image : عکسی که در مواقع لود نشدن تصاویر اصلی نمایش داده می شود.

placeholder : تصویر نشان داده شده قبل از لود عکس های اصلی.

delay : پس از چه زمانی پیمایش خودکار تصاویر آغاز شود.

auto_cycle : فعال یا غیرفعال کردن پیمایش خودکار بین تصاویر.

corner_radius : اندازه زاویه گوشه های تصاویر.

اکنون به سراغ کدهای جاوا روید و کدهای زیر را در متد ()onCreate یا هر جای دیگری که می خواهید Image Slider شروع به کار کند قرار دهید.

ImageSlider imageSlider=findViewById(R.id.imageSlider);
ArrayList<SlideModel>slideModels=new ArrayList<>();
slideModels.add(new SlideModel(R.drawable.image1));
slideModels.add(new SlideModel("http://yourdomain.com/image2"));
slideModels.add(new SlideModel(R.drawable.image3,"title"));
slideModels.add(new SlideModel("http://yourdomain.com/image4","title"));
imageSlider.setImageList(slideModels);
imageSlider.setItemClickListener(new ItemClickListener() {
    @Override
    public void onItemSelected(int i) {
        
    }
});

در کد بالا ابتدا یک نمونه از کلاس ImageSlider تعریف شده و ارتباط آن را با Layout برنامه برقرار شده است. برای افزودن تصاویر باید یک آرایه از کلاس SlideModel ایجاد کنید. همانطور که مشاهده می کنید سازنده این کلاس چهار Overload دارد که این امکان را به ما می دهد که از تصاویری که در Resources برنامه موجود است استفاده کنیم. یا اینکه آدرس عکسی که در اینترنت قرار دارد را وارد کنیم. همچنین می توانیم برای هر عکس یک title (عنوان) در نظر بگیریم. پس از مقداردهی آرایه آن را به اسلایدر معرفی می کنیم. در مرحله بعد یک ItemClickListener تعریف شده است. زمانی که بر روی یکی از تصاوید کلیک شود تابع ()onItemSelected اجرا شده و ایندکس تصویر انتخابی را برای ما برمیگرداند.

به این ترتیب با روش ساخت Image Slider حرفه ای در برنامه نویسی اندروید آشنا شدیم.

کدهای برنامه

activity_main.xml

<?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:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    tools:context=".MainActivity">

    <com.denzcoskun.imageslider.ImageSlider
        android:layout_width="match_parent"
        android:layout_height="320dp"
        android:id="@+id/imageSlider"
        app:error_image="@drawable/error"
        app:placeholder="@drawable/placeholder"
        app:delay="10000"
        app:auto_cycle="true"
        app:corner_radius="45"/>
</RelativeLayout>

MainActivity.java

package com.example.myapplication;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

import com.denzcoskun.imageslider.ImageSlider;
import com.denzcoskun.imageslider.interfaces.ItemClickListener;
import com.denzcoskun.imageslider.models.SlideModel;

import java.util.ArrayList;

public class MainActivity extends AppCompatActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ImageSlider imageSlider=findViewById(R.id.imageSlider);
ArrayList<SlideModel>slideModels=new ArrayList<>();
slideModels.add(new SlideModel(R.drawable.image1));
slideModels.add(new SlideModel("http://yourdomain.com/image2"));
slideModels.add(new SlideModel(R.drawable.image3,"title"));
slideModels.add(new SlideModel("http://yourdomain.com/image4","title"));
imageSlider.setImageList(slideModels);
imageSlider.setItemClickListener(new ItemClickListener() {
@Override
public void onItemSelected(int i) {

}
});
}
}

این آموزش هم به پایان رسید. لطفا نظرات، انتقادات و پیشنهادات خود را برای ما بنویسید. همچنین اگر سوالی دارید می توانید در بخش نظرات بازگو کنید. ما در اسرع وقت پاسخ گوی شما خواهیم بود.

اگر به برنامه نویسی اندروید علاقه دارید می توانید در دوره مقدماتی برنامه نویسی اندروید ما شرکت کنید.

مطالب اخیر

پیام بگذارید