java - 在全屏android中使用recyclerview幻灯片图像

Question

我已经创建了墙纸应用程序，我正在从 recyclerview 的 firebase 数据库中加载图像。当我单击 recyclerview item(image) 时，该项目的图像 url 发送到下一个活动，然后使用 glide 将该 url 加载到 imageView 中。

现在我想把它改成Image-Slider 之类的东西。通过单击 recyclerView 项目，我想全屏显示该图像，并且还想从左或右滑动（下一个或上一个）。但我不知道该怎么做。

这是我的代码。

        recyclerView.setHasFixedSize(true);
        recyclerView.setLayoutManager(new GridLayoutManager(getContext(), 3));
        adapter = new FeaturedAdapter(list);
        recyclerView.setAdapter(adapter);

        databaseReference = FirebaseDatabase.getInstance().getReference().child("Wallpaper All");
        Query query = databaseReference.orderByChild("dark").equalTo(true);
        query.addListenerForSingleValueEvent(new ValueEventListener() {
            @Override
            public void onDataChange(@NonNull DataSnapshot dataSnapshot) {

                list.clear();
                for (DataSnapshot dataSnapshot1 : dataSnapshot.getChildren()) {

                    FeaturedModel model = dataSnapshot1.getValue(FeaturedModel.class);
                    list.add(model);
                    
                }

                adapter.notifyDataSetChanged();

            }

            @Override
            public void onCancelled(@NonNull DatabaseError databaseError) {

                Log.e("TAG_DATABASE_ERROR", databaseError.getMessage());

            }
        });

FeaturedAdapter.java

public class FeaturedAdapter extends RecyclerView.Adapter<FeaturedAdapter.ViewHolder> {

    private List<FeaturedModel> featuredModels;

    public FeaturedAdapter(List<FeaturedModel> featuredModels) {
        this.featuredModels = featuredModels;
    }

    @NonNull
    @Override
    public ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {

        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.custom_image, parent, false);

        return new ViewHolder(view);
    }

    @Override
    public void onBindViewHolder(@NonNull ViewHolder holder, int position) {

        holder.setData(featuredModels.get(position).getImageLink()
                , position,
                featuredModels.get(position).isPremium());

    }

    @Override
    public int getItemCount() {
        return featuredModels.size();
    }

    class ViewHolder extends RecyclerView.ViewHolder {

        private ImageView imageView;
        private ImageView premiumImage;

        public ViewHolder(@NonNull View itemView) {
            super(itemView);

            imageView = itemView.findViewById(R.id.imageview);
            premiumImage = itemView.findViewById(R.id.premium);

        }

        private void setData(final String url, final int position, boolean premium) {

            Glide.with(itemView.getContext().getApplicationContext()).load(url).into(imageView);

            if (premium) {

                premiumImage.setVisibility(View.VISIBLE);

                itemView.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        Intent setIntent = new Intent(itemView.getContext(), PremiumViewActivity.class);
                        //setIntent.putExtra("title", url);
                        setIntent.putExtra("images", featuredModels.get(getAdapterPosition()).getImageLink());
                        setIntent.putExtra("id", featuredModels.get(position).getId());
                        itemView.getContext().startActivity(setIntent);

                    }
                });


            } else {

                premiumImage.setVisibility(View.GONE);

                itemView.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        Intent setIntent = new Intent(itemView.getContext(), ViewActivity.class);
                        //setIntent.putExtra("title", url);
                        setIntent.putExtra("images", featuredModels.get(getAdapterPosition()).getImageLink());
                        setIntent.putExtra("id", featuredModels.get(position).getId());
                        itemView.getContext().startActivity(setIntent);

                    }
                });

            }

        }

    }

}

查看活动

Random rnd = new Random();
        int color = Color.argb(255, rnd.nextInt(256), rnd.nextInt(256), rnd.nextInt(256));

        relativeLayout.setBackgroundColor(color);

        Glide.with(this)
                .load(getIntent().getStringExtra("images"))
                .timeout(6000)
                .listener(new RequestListener<Drawable>() {
                    @Override
                    public boolean onLoadFailed(@Nullable GlideException e, Object model, Target<Drawable> target, boolean isFirstResource) {
                        relativeLayout.setBackgroundColor(Color.TRANSPARENT);
                        return false;
                    }

                    @Override
                    public boolean onResourceReady(Drawable resource, Object model, Target<Drawable> target, DataSource dataSource, boolean isFirstResource) {
                        relativeLayout.setBackgroundColor(Color.TRANSPARENT);
                        return false;
                    }
                })
                .into(imageView);
setBackgroundWall.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                setBackgroundImage();

            }
        });

}

 private void setBackgroundImage() {

        Bitmap bitmap = ((BitmapDrawable) imageView.getDrawable()).getBitmap();

        WallpaperManager manager = WallpaperManager.getInstance(getApplicationContext());
        try {
            manager.setBitmap(bitmap);
            Toasty.success(getApplicationContext(), "Set Wallpaper Successfully", Toast.LENGTH_SHORT, true).show();

        } catch (IOException e) {
            Toasty.warning(this, "Wallpaper not load yet!", Toast.LENGTH_SHORT, true).show();
        }
        

    }

活动视图.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".activity.PremiumViewActivity">

    <ImageView
        android:id="@+id/viewImage"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:adjustViewBounds="true"
        android:contentDescription="@null"
        android:scaleType="centerCrop"
        android:src="#00BCD4"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintStart_toStartOf="parent" />

    <com.airbnb.lottie.LottieAnimationView
        android:id="@+id/lottieSuccess"
        android:layout_width="180dp"
        android:layout_height="180dp"
        android:visibility="gone"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:lottie_fileName="checked.json" />

    <RelativeLayout
        android:id="@+id/wallpaper_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:padding="16dp"
        android:visibility="gone"
        app:layout_constraintBottom_toBottomOf="parent">

        <ImageButton
            android:id="@+id/saveImage"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:layout_alignParentStart="true"
            android:layout_alignParentBottom="true"
            android:layout_marginStart="20dp"
            android:background="@drawable/set_as_wallpaper_btn"
            android:contentDescription="@null"
            android:src="@drawable/save" />

        <Button
            android:id="@+id/setWallpaper"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentEnd="true"
            android:layout_alignParentBottom="true"
            android:layout_marginStart="4dp"
            android:layout_marginEnd="8dp"
            android:background="@drawable/set_as_wallpaper_btn"
            android:minWidth="230dp"
            android:text="Set as wallpaper"
            android:textColor="#000"
            android:textStyle="bold" />

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentTop="true"
            android:layout_alignParentEnd="true"
            android:orientation="horizontal">

            <CheckBox
                android:id="@+id/favoritesBtn_checkbox"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="6dp"
                android:button="@drawable/favourite_checkbox_selector" />

            <ImageButton
                android:id="@+id/shareBtn"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="6dp"
                android:background="@drawable/share"
                android:contentDescription="@null" />


        </LinearLayout>


    </RelativeLayout>

    <RelativeLayout
        android:id="@+id/ads_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:padding="12dp"
        android:visibility="visible"
        app:layout_constraintBottom_toBottomOf="parent">

        <Button
            android:id="@+id/watch_ads"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginStart="20dp"
            android:layout_marginEnd="20dp"
            android:background="@drawable/set_as_wallpaper_btn"
            android:drawableStart="@drawable/advertizing"
            android:paddingStart="50dp"
            android:paddingEnd="50dp"
            android:stateListAnimator="@null"
            android:text="Watch Video Ad"
            android:textColor="#000"
            android:textStyle="bold" />

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@id/watch_ads">

            <Button
                android:id="@+id/unlock_withCoins"
                android:layout_width="match_parent"
                android:layout_height="50dp"
                android:layout_marginStart="20dp"
                android:layout_marginTop="15dp"
                android:layout_marginEnd="20dp"
                android:background="@drawable/set_as_wallpaper_btn"
                android:drawableStart="@drawable/diamond"
                android:paddingStart="50dp"
                android:paddingEnd="50dp"
                android:stateListAnimator="@null"
                android:text="Unlock with diamonds"
                android:textColor="#000"
                android:textStyle="bold" />

            <TextView
                android:id="@+id/diamonds_tv"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="50dp"
                android:gravity="center"
                android:text="Total Diamonds: 0"
                android:textSize="10sp"
                android:textStyle="bold" />

        </RelativeLayout>


    </RelativeLayout>


</androidx.constraintlayout.widget.ConstraintLayout>

custom_image.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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="wrap_content">

    <androidx.cardview.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:layout_centerHorizontal="true"
        android:background="#fff"
        app:cardCornerRadius="10dp"
        app:cardUseCompatPadding="true">

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <ImageView
                android:id="@+id/imageview"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:contentDescription="@null"
                android:scaleType="centerCrop"
                android:src="@color/colorPrimary" />

            <ImageView
                android:id="@+id/premium"
                android:contentDescription="@null"
                android:layout_width="24dp"
                android:layout_height="24dp"
                android:layout_alignParentTop="true"
                android:layout_alignParentEnd="true"
                android:layout_margin="10dp"
                app:srcCompat="@drawable/diamond" />

        </RelativeLayout>


    </androidx.cardview.widget.CardView>

</RelativeLayout>

Structure

MainActivity
    |
    | //Click button to open
    |
FragActivity
    |
    | //FrameLayout
    |
 Fragment
    |
    | //here is the recyclerView
    | //Open new Activity to view image 
    
ViewActivity

屏幕录制

Answer 1

这可以通过使用ViewPager或ViewPager2在Android中解决

首先创建一个适配器

ImageSwiperAdapter2.java

public class ImageSwiperAdapter2 extends RecyclerView.Adapter<ImageSwiperAdapter2.ImageSwiper> {

    private List<FeaturedModel> list;
    private Context context;

    public ImageSwiperAdapter2(List<FeaturedModel> list, Context context) {
        this.list = list;
        this.context = context;
    }

    @NonNull
    @Override
    public ImageSwiper onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {

        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.slidingimages,
                parent, false);

        return new ImageSwiper(view);
    }

    @Override
    public void onBindViewHolder(@NonNull final ImageSwiper holder, int position) {

        Random rnd = new Random();
        int color = Color.argb(255, rnd.nextInt(256), rnd.nextInt(256), rnd.nextInt(256));
        holder.relativeLayout.setBackgroundColor(color);

        Glide.with(context.getApplicationContext())
                .load(list.get(position).getImageLink())
                .listener(new RequestListener<Drawable>() {
                    @Override
                    public boolean onLoadFailed(@Nullable GlideException e, Object model, Target<Drawable> target, boolean isFirstResource) {
                        holder.relativeLayout.setBackgroundColor(Color.TRANSPARENT);
                        return false;
                    }

                    @Override
                    public boolean onResourceReady(Drawable resource, Object model, Target<Drawable> target, DataSource dataSource, boolean isFirstResource) {
                        holder.relativeLayout.setBackgroundColor(Color.TRANSPARENT);

                        return false;
                    }
                })
                .into(holder.imageView);


    }

    @Override
    public int getItemCount() {
        return list.size();
    }

    class ImageSwiper extends RecyclerView.ViewHolder {


        private ImageView imageView;
        

        public ImageSwiper(@NonNull View itemView) {
            super(itemView);

            imageView = itemView.findViewById(R.id.imageView);
          

        }


    }
}

在 ViewActivity/SwiperActivity.java

public class SwiperActivity extends AppCompatActivity {

    private ViewPager2 viewPager;
    private List<FeaturedModel> list;
    private ImageSwiperAdapter2 adapter2;


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

        viewPager = findViewById(R.id.view_pager);
        
        final int pos = getIntent().getIntExtra("pos", 0);

        Singleton singleton = Singleton.getInstance();

        list = new ArrayList<>();
        list = singleton.getListSin();

        adapter2 = new ImageSwiperAdapter2(list, this);

        viewPager.setAdapter(adapter2);
        viewPager.setCurrentItem(pos);

        viewPager.registerOnPageChangeCallback(new ViewPager2.OnPageChangeCallback() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
                super.onPageScrolled(position, positionOffset, positionOffsetPixels);
            }

            @Override
            public void onPageSelected(int position) {
                super.onPageSelected(position);

                Toast.makeText(SwiperActivity.this, "Selected: " + position, Toast.LENGTH_SHORT).show();

            }

            @Override
            public void onPageScrollStateChanged(int state) {
                super.onPageScrollStateChanged(state);
            }
        });

    }

}

您可以在 中传递list和单击的项目位置FeaturedAdapter。

在你的FeaturedAdapter's setData方法中

private void setData(final String url, final int position, boolean premium) {
          Glide.with(itemView.getContext().getApplicationContext()).load(url).into(imageView);

            final Singleton a = Singleton.getInstance();
            a.setListSin(featuredModels);

            if (premium) {

                premiumImage.setVisibility(View.VISIBLE);

                itemView.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {

                        Intent setIntent = new Intent(itemView.getContext(), SwiperActivity.class);
                        
                        setIntent.putExtra("pos", position);
                        itemView.getContext().startActivity(setIntent);
                        CustomIntent.customType(itemView.getContext(), "fadein-to-fadeout");



                    }
                });


            } else {

                premiumImage.setVisibility(View.GONE);

                itemView.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        
                        Intent setIntent = new Intent(itemView.getContext(), SwiperActivity.class);
                        setIntent.putExtra("pos", position);
                        itemView.getContext().startActivity(setIntent);
                        CustomIntent.customType(itemView.getContext(), "fadein-to-fadeout");

                    }
                });

            }

        }

滑动图像.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:adjustViewBounds="true"
        android:contentDescription="@null"
        android:scaleType="centerCrop" />

    
</RelativeLayout>

activity_swiper.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".SwiperActivity">

    <androidx.viewpager2.widget.ViewPager2
        android:orientation="horizontal"
        android:id="@+id/view_pager"
        android:layoutDirection="inherit"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</RelativeLayout>
    

Answer 2

由于 ViewActivity 必须显示所有图像（滑动时），它必须包含带有图像 url 集的适配器。在 ViewActivity 中使用 RecyclerView 并附加适配器，而不是使用 ImageView。在您的代码中，执行以下操作以使回收器视图水平并添加幻灯片功能。

    recyclerView = view.findViewById(R.id.recycler_view);
    recyclerView.setHasFixedSize(true);
    recyclerView.setLayoutManager(new LinearLayoutManager(getApplicationContext(),LinearLayoutManager.HORIZONTAL,false));
    SnapHelper snapHelper = new PagerSnapHelper();
    snapHelper.attachToRecyclerView(recyclerView);

Answer 3

几天前，我一直在寻找显示可滑动图像视图的类似要求。这种情况可以ViewPager在Android中使用来解决。您可以使用以下教程来构建这样的幻灯片图像视图ViewPager

Java 资源

1. 博客教程
2. 视频教程

科特林资源

1. 视频教程