Do not play from first image.

Every time when I enter my fragment with SliderLayout, it doesn’t start to play from first image but always from second. Does anybody encounter the same problem? I’m using the latest version of AndroidImageSlider(Version 1.1.5), Android API 14 with support library v7.

Here is my code snippet:

public class FirstFragment extends BaseFragment implements BaseSliderView.OnSliderClickListener {
......
......
private SliderLayout mSlider;
......
......
private void init(){
    Map<Integer, DataBean> fileMaps = new HashMap<>();
    // Here I got my data and set to fileMaps 

    mSlider.stopAutoCycle();
    mSlider.removeAllSliders();
    for (Map.Entry<Integer, DataBean> entry : fileMaps.entrySet()) {
        DefaultSliderView defaultSliderView = new DefaultSliderView(mView.getContext());
        defaultSliderView.bundle(new Bundle()).image(entry.getValue().getImgurl()).setOnSliderClickListener(FirstFragment.this);
        defaultSliderView.getBundle().putString("ex_url", entry.getValue().getExtra_url());
        defaultSliderView.setScaleType(BaseSliderView.ScaleType.CenterInside);
        mSlider.addSlider(defaultSliderView);
    }
    mSlider.setCustomIndicator((PagerIndicator) mView.findViewById(R.id.custom_indicator));
    mSlider.setDuration(5000);
    mSlider.startAutoCycle();
}

And my layout xml snippet:

 <RelativeLayout
android:id="@+id/linearLayout0"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">

<com.daimajia.slider.library.SliderLayout
    android:id="@+id/slider"
    android:layout_width="match_parent"
    android:layout_height="200dp"
    custom:indicator_visibility="visible"
    custom:pager_animation="Default"
    custom:pager_animation_span="800"/>

<com.daimajia.slider.library.Indicators.PagerIndicator
    android:id="@+id/custom_indicator"
    style="@style/AndroidImageSlider_Oval_Blue"
    android:layout_alignBottom="@id/slider"
    android:layout_marginBottom="5dp" />
</RelativeLayout>

[miklendap]

Same issue for me. When you add onPageChangeListener to your sliderShow, you can see that “onPageSelected” method from listener is called X-times (where X is slides count) for first slide (only once, after initialization) - there is probably the problem. And because onImageLoadListener seems to me not working, I’m able to “fix” it only by this hack:

final int DELAY = 10000;
final int TICK = 5000;

new CountDownTimer(DELAY, TICK){
    @Override
    public void onTick(long millisUntilFinished) {
    }

    @Override
    public void onFinish() {
        sliderShow.setCurrentPosition(0);
        sliderShow.startAutoCycle();
    }
}.start();

Assuming that you called “sliderShow.stopAutoCycle()” (it seems AutoCycle is default ON) after you init all slides (after your forEach cycle). In case you are able to detect onImageLoad event of first slide, you don’t have to use Timer and just put code from onFinish() to “onEnd” method of OnImageLoadListener on your first slide…

EDIT:

Another approach using onImageLoadListener (works almost perfect for me):

1. create custom TextSlider class by extending BaseSliderView:

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ImageView;
import android.widget.TextView;

import com.daimajia.slider.library.R.id;
import com.daimajia.slider.library.R.layout;

public class TextSlider extends SliderView {

    public TextSlider(Context context) {
        super(context);
    }

    public View getView() {

        View v = LayoutInflater.from(this.getContext()).inflate(layout.render_type_text, null);
        ImageView target = (ImageView) v.findViewById(id.daimajia_slider_image);
        TextView description = (TextView) v.findViewById(id.description);
        description.setText(this.getDescription());

        this.bindEventAndShow(v, target);

        return v;
    }
}

1. use this code to init images:

sliderShow.setPresetTransformer(SliderLayout.Transformer.Default);
sliderShow.setPresetIndicator(SliderLayout.PresetIndicators.Right_Bottom);
sliderShow.setSliderTransformDuration(SLIDER_TRANSFORM, null);
sliderShow.setDuration(SLIDER_DURATION);

// important
sliderShow.stopAutoCycle();

final int[] loaded = {0};

// "Image" is my custom class
for (Image image: myClass.getImages()) {

    final TextSlider sliderView = new TextSlider(this);
    sliderView.description(image.getCaption());
    sliderView.image(image.getUrl());

    sliderView.setScaleType(SliderView.ScaleType.FitCenterCrop);

    sliderView.setOnImageLoadListener(new SliderView.ImageLoadListener() {@Override
        public void onStart(SliderView target) {}

        @Override
        public void onEnd(boolean result, SliderView target) {

            loaded[0]++;

            // "3" is "magic constant" (onEnd runs 3-X times, where "X" is images count)
            if (loaded[0] == (myClass.getImages().size() * 3)) {

                sliderShow.setCurrentPosition(0, true);

                // play from first image, when all images loaded
                new Handler().postDelayed(new Runnable() {@Override
                    public void run() {
                        sliderShow.startAutoCycle();
                    }
                }, SLIDER_DURATION);
            }
        }
    });

    sliderShow.addSlider(sliderView);
}

[takashiovn]

Add “mSlider.movePrevPosition();” as below mSlider.setDuration(5000); mSlider.movePrevPosition() //show the first dot.