如何只实现一个圆形进度条，直到图像被滑动加载
Posted
技术标签:
【中文标题】如何只实现一个圆形进度条，直到图像被滑动加载【英文标题】：How to implement only one circular progress bar until images are loaded with glide 【发布时间】：2021-08-24 06:49:15 【问题描述】：您好，我只想实现一个圆形进度动画，直到从滑行加载图像，但是在占位符中实现动画后，它为每个单独的图像提供动画，并且图像更改为占位符图像大小，我没有想要
我希望布局的中心应该只有一个圆形进度动画，直到图像被加载到回收器视图中
Post_Item_Container.xml
<com.google.android.material.imageview.ShapeableImageView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/imageView"
android:layout_
android:layout_
android:layout_marginStart="6dp"
android:layout_marginTop="11dp"
android:layout_marginEnd="6dp"
android:contentDescription="@string/todo"
app:shapeAppearanceOverlay="@style/RoundedCorner" />
Fragment_Search.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/search_fragment"
android:layout_
android:layout_
android:background="@color/black">
<androidx.appcompat.widget.SearchView
android:id="@+id/search_view"
android:layout_
android:layout_
android:layout_alignParentTop="true"
android:layout_marginStart="15dp"
android:layout_marginTop="15dp"
android:layout_marginEnd="15dp"
android:layout_marginBottom="15dp"
android:background="@color/grey"
android:overScrollMode="never" />
<androidx.core.widget.NestedScrollView
android:layout_
android:layout_
android:layout_below="@+id/search_view"
android:overScrollMode="never">
<LinearLayout
android:id="@+id/linearLayout1"
android:layout_
android:layout_
android:gravity="center"
android:orientation="vertical">
<TextView
android:id="@+id/listText"
android:layout_
android:layout_
android:layout_margin="20dp"
android:paddingStart="40dp"
android:paddingEnd="0dp"
android:text="@string/today_s_most_liked_posts"
android:textColor="@color/white"
android:textSize="25sp"
android:textStyle="italic" />
<ProgressBar
android:layout_
android:layout_
android:drawable="@drawable/hu3fv"
android:layout_marginTop="240dp"
android:gravity="center_vertical|center_horizontal"/>
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/postRecyclerView"
android:layout_
android:layout_
android:orientation="vertical"
android:overScrollMode="never"/>
</LinearLayout>
</androidx.core.widget.NestedScrollView>
</RelativeLayout>
Search_Fragment.java
public class Search_Fragment extends Fragment
private final DatabaseReference databaseReference = FirebaseDatabase.getInstance().getReference("uploads");
public List<Upload> mUploads;
PostAdapter_Search postsAdapter;
RecyclerView postRecyclerView;
ProgressBar progressBar;
@Nullable
@Override
public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState)
View view = inflater.inflate(R.layout.fragment_search, container, false);
requireActivity().setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT);
postRecyclerView = view.findViewById(R.id.postRecyclerView);
progressBar = view.findViewById(R.id.progressBar);
postRecyclerView.setLayoutManager(
new StaggeredGridLayoutManager(2, StaggeredGridLayoutManager.VERTICAL)
);
getData();
progressBar.setVisibility(View.VISIBLE);
mUploads = new ArrayList<>();
postsAdapter = new PostAdapter_Search(getContext(), mUploads);
postRecyclerView.setAdapter(postsAdapter);
return view;
private void getData()
databaseReference.addValueEventListener(new ValueEventListener()
@Override
public void onDataChange(@NonNull DataSnapshot snapshot)
if (snapshot.exists())
mUploads.clear();
for (DataSnapshot dataSnapshot : snapshot.getChildren())
progressBar.setVisibility(View.GONE);
postRecyclerView.setVisibility(View.VISIBLE);
Upload upload = dataSnapshot.getValue(Upload.class);
upload.setmKey(dataSnapshot.getKey());
mUploads.add(upload);
//notify the adapter
postsAdapter.notifyDataSetChanged();
@Override
public void onCancelled(@NonNull DatabaseError error)
);
【问题讨论】：
***.com/questions/35305875/… 但这对我没有帮助，我之前访问过这个问题 问题是因为你的ShapeableImageView 的高度是wrap_content，所以设置ColorDrawable 是行不通的。而是将自定义可绘制对象添加到您的应用程序并使用它。这是同一fonts.google.com/…的链接
甚至尝试过这个，但是图像大小变成了我再次不想要的图标大小，我希望高度应该是 wrap_content 无论如何我试图让它像 pintrest 跨度>
有没有什么方法可以在图片加载到recycler视图后收取height和width参数，如果可以的话可以解决我的问题我想是的，如果可以的话我会在 XML 中给图像固定大小，然后正确显示微光效果，当加载图像时，图像高度和宽度参数从固定更改为匹配父级并在 java 文件中包装内容
【参考方案1】：
因为您使用的是 RecyclerView 并且因为您在 onBindViewHolder 方法中执行此操作
@Override
public void onBindViewHolder(@NonNull PostViewHolder holder, int position)
Upload uploadCurrent = mUploads.get(position);
Glide.with(mcontext)
.load(uploadCurrent.getmImageUrl())
.diskCacheStrategy(DiskCacheStrategy.DATA)
.placeholder(R.drawable.hu3fv)
.dontAnimate()
.into(holder.imageView);
在某种程度上，您将其应用于您的所有 RecyclerView 项目，因此它正在重复，因为这就是 RecyclerView 的目的。
如果您想要一个单独的 CircularProgressBar，您需要将其添加到您的 Fragment 或 Activity 布局中，具体取决于您使用的是这样的内容
<ProgressBar
android:id="@+id/progressBar"
android:layout_
android:layout_
android:padding="24dp"
android:visibility="visible" />
数据加载到RecyclerView后，您可以根据需要设置其大小并隐藏/显示其可见性
我了解您希望在 Glide 图像加载时显示 ProgressBar，但不建议这样做，因为您需要在每张图像完成加载后进行某种回调。
【讨论】：
请告诉我该怎么做 @Player91 看这里有两个不同的东西。如果您只想为 Glide 图像加载显示一个ProgressBar，那么我不建议您这样做，因为一旦图像完成加载，您将需要 Glide 的某种回调，同样，当您再次滚动时，ProgressBar 需要显示。相反，要么像你已经在做的那样保持单独的ProgessBar，或者只是保持一个在一起，直到时间数据加载到RecyclerView
兄弟如果能提供资源，将非常有帮助
是的，我会帮助你，但你能否确认这是否适合你@Player91 正如我所说的那样，这些是不同的事情。你想要的是这个one circular progress animation in the center of the layout until the images are loaded in the recycler view，正如我所说，不推荐这样做，因为如上所述，你需要解决各种问题。
那么您可以添加一些您的活动或片段的代码，无论您使用的是@Player91，简而言之，您需要在活动或片段的XML 布局中添加ProgessBar，正如我所说的。 以上是关于如何只实现一个圆形进度条，直到图像被滑动加载的主要内容，如果未能解决你的问题，请参考以下文章