Получить изображения из базы данных Firebase в реальном времени и показать в слайдере изображений, используя Picasso

Question

Я пытаюсь получить изображения из базы данных Firebase в реальном времени и показать их обратно в виде слайдера изображений (слайд-шоу) с помощью Picasso.

Это позволяет мне получить только последнее изображение, сохраненное в firebase.Буду очень признателен за любую помощь!

enter code here
public void update(View view) {

        DatabaseReference mDatabaseRef = FirebaseDatabase.getInstance().getReference().child("uploads");
        mDatabaseRef.addValueEventListener(new ValueEventListener() {
            @Override
            public void onDataChange(DataSnapshot snapshot) {

                // TODO Auto-generated method stub
                if(snapshot.exists()) {
                    for(DataSnapshot s:snapshot.getChildren()) {
                        //For Image1

                        StringBuilder img1=new StringBuilder();
                        Upload t = s.getValue(Upload.class);
                        img1.append(t.getImageUrl());
                        image1.setText(img1.toString());
                        String image1url=image1.getText().toString();
                        Picasso.get().load(image1url).into(imageView1);

                        StringBuilder img2=new StringBuilder();
                        Upload a = s.getValue(Upload.class);
                        img2.append(a.getImageUrl());
                        image2.setText(img1.toString());
                        String image2url=image2.getText().toString();
                        Picasso.get().load(image2url).into(imageView2);
}

Это моя структура базы данных

Firebase-root
       |
       --- uploads
             |
             --- LZ6KO5TaHGaIthbhbnj
             |     |
                   --- imageUrl1: "https://..."
             |     |
                   --- name: "firstpic" 
             |
             --- LZ6NKm-zZg5EW1hvhvh
                   |
                   --- imageUrl2: "https://..."
                   |
                   --- name: "secondpic" 

Answer 1

В этом решении реализована база данных viewflipper, picasso и firebase;

Если необходимо реализовать простой слайдер изображений (слайд-шоу), вы можете использовать viewflipper.

I) Во-первых, вы можете использовать базу данных Firebase для доступа ко всему imageUrl как:

databaseReference.child("uploads")
            .addListenerForSingleValueEvent(new ValueEventListener() {
                @Override
                public void onDataChange(DataSnapshot dataSnapshot) {
                    if (dataSnapshot.exists()) {
                        slideLists.clear();    //slideLists is an ArrayList
                        for (DataSnapshot snapshot : dataSnapshot.getChildren()) {
                            SlideModel model = snapshot.getValue(SlideModel.class);

                            slideLists.add(model);
                        }
                        Toast.makeText(SlideShowActivity.this, "All data fetched", Toast.LENGTH_SHORT).show();
                        usingFirebaseImages(slideLists);    //this method is for calling viewflipper method
                    } else {
                        Toast.makeText(SlideShowActivity.this, "No images in firebase", Toast.LENGTH_SHORT).show();
                    }
                }

                @Override
                public void onCancelled(DatabaseError databaseError) {
                    Toast.makeText(SlideShowActivity.this, "NO images found \n" + databaseError.getMessage(), Toast.LENGTH_SHORT).show();
                }
            });

II) Во-вторых, загрузить эти изображения в imageView через Picasso как:

Picasso.with(SlideShowActivity.this).load(imageUrl).into(imageView); 

III) Реализовать viewflipperдля анимации слайд-шоу изображений:

    ImageView imageView = new ImageView(this);
    Picasso.with(SlideShowActivity.this).load(imageUrl).into(imageView);

    viewFlipper.addView(imageView);

    viewFlipper.setFlipInterval(2500);
    viewFlipper.setAutoStart(true);

    viewFlipper.startFlipping();
    viewFlipper.setInAnimation(this, android.R.anim.slide_in_left);
    viewFlipper.setOutAnimation(this, android.R.anim.slide_out_right);

Наконец, полный код будет выглядеть примерно так:

A) Ваш xml-файл должен содержать следующее:

<ViewFlipper
    android:id="@+id/viewFlipper_slide_show"
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:layout_centerHorizontal="true" />

B) Ваш класс активности должен содержать это: (скажем, SlideShowActivity.java)

public class SlideShowActivity extends AppCompatActivity {

private ViewFlipper viewFlipper;
private DatabaseReference databaseReference;
private List<SlideModel> slideLists;

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

    initialize();

    databaseReference = FirebaseDatabase.getInstance().getReference();
    slideLists = new ArrayList<>();
}

@Override
protected void onStart() {
    super.onStart();
    usingFirebaseDatabase();
}

private void initialize() {
    viewFlipper = findViewById(R.id.viewFlipper_slide_show);
}

private void usingFirebaseDatabase() {
    databaseReference.child("uploads")
            .addListenerForSingleValueEvent(new ValueEventListener() {
                @Override
                public void onDataChange(DataSnapshot dataSnapshot) {
                    if (dataSnapshot.exists()) {
                        slideLists.clear();
                        for (DataSnapshot snapshot : dataSnapshot.getChildren()) {
                            SlideModel model = snapshot.getValue(SlideModel.class);

                            slideLists.add(model);
                        }
                        Toast.makeText(SlideShowActivity.this, "All data fetched", Toast.LENGTH_SHORT).show();
                        usingFirebaseImages(slideLists);
                    } else {
                        Toast.makeText(SlideShowActivity.this, "No images in firebase", Toast.LENGTH_SHORT).show();
                    }
                }

                @Override
                public void onCancelled(DatabaseError databaseError) {
                    Toast.makeText(SlideShowActivity.this, "NO images found \n" + databaseError.getMessage(), Toast.LENGTH_SHORT).show();
                }
            });
}

private void usingFirebaseImages(List<SlideModel> slideLists) {
    for (int i = 0; i < slideLists.size(); i++) {
        String downloadImageUrl = slideLists.get(i).getImageUrl();
        flipImages(downloadImageUrl);
    }
}

public void flipImages(String imageUrl) {
    ImageView imageView = new ImageView(this);
    Picasso.with(SlideShowActivity.this).load(imageUrl).into(imageView);

    viewFlipper.addView(imageView);

    viewFlipper.setFlipInterval(2500);
    viewFlipper.setAutoStart(true);

    viewFlipper.startFlipping();
    viewFlipper.setInAnimation(this, android.R.anim.slide_in_left);
    viewFlipper.setOutAnimation(this, android.R.anim.slide_out_right);

}
}

C) Наконец, в соответствии со структурой вашей базы данных модель должна быть: (скажем, SlideModel.java)

public class SlideModel {
private String imageUrl, name;

public SlideModel() {
}

public SlideModel(String imageUrl, String name) {
    this.imageUrl = imageUrl;
    this.name = name;
}

public String getImageUrl() {
    return imageUrl;
}

public void setImageUrl(String imageUrl) {
    this.imageUrl = imageUrl;
}

public String getName() {
    return name;
}

public void setName(String name) {
    this.name = name;
}
}

Удачи!