我试图用wrap_content的高度实现闪光效果,但图像没有加载,我知道为什么它没有加载图像,因为imageView有wrap_content,闪光也有wrap_content,但我希望高度应该是wrap_content并且没有固定。
在 shimmer 中实现固定高度(例如 200dp)后,它可以工作,但之后图像不会加载
我想让它像Pinterest一样根据图像调整高度
XML 文件
post_item_container_search.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/imagePostSearch"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="6dp"
android:layout_marginTop="11dp"
android:layout_marginEnd="6dp"
android:contentDescription="@string/todo"
app:shapeAppearanceOverlay="@style/RoundedCorner" />
post_item_containe_shimmer.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/imageShimmer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="11dp"
android:layout_marginTop="11dp"
android:background="#E7E7E7"
android:contentDescription="@string/todo"
app:shapeAppearanceOverlay="@style/RoundedCorner" />
这就是将 minHeight 添加到两者或实际 imageView 中后的样子
默认情况下,wrapcontent 没有任何大小,因此它是 0dp,您需要定义 50dp 或其他闪烁高度,这样只有您才能看到闪烁。
可以参考这个博客 或者尝试使用这个
post_item_container_search.xml
<com.google.android.material.imageview.ShapeableImageView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/imagePostSearch"
android:layout_width="200dp"
android:layout_height="200dp"
android:scaleType="fitCenter"
android:layout_marginStart="6dp"
android:layout_marginTop="11dp"
android:layout_marginEnd="6dp"
android:contentDescription="@string/todo"
app:shapeAppearanceOverlay="@style/RoundedCorner" />
在 shimmer 中实现固定高度(例如 200dp)后,它可以工作,但之后图像不会加载
在这种情况下,您可能应该首先为
ImageView
设置绝对宽度/高度。稍后,如果您确实需要,可以将其设置回WARP_CONTENT
。但首先您需要视图的估计/绝对宽度/高度。
int height = bitmap.getHeight();
int width = bitmap.getWidth();
ShapeableImageView siv = findViewById(R.id.imagePostSearch);
ViewGroup.LayoutParams params = siv.getLayoutParams();
params.height = height;
params.width = width;
//To set it back to warp content or match parent:
params.height = ViewGroup.LayoutParams.WRAP_CONTENT;
params.width = ViewGroup.LayoutParams.MATCH_PARENT;
请保留
android:minHeight
作为ImageView
,因为它会给你一个最小高度,而且android:height
可以是wrap_content
,所以如果图像大于minHeight
它会增长。
例如,
<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/imageShimmer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="100dp"
android:layout_marginStart="11dp"
android:layout_marginTop="11dp"
android:background="#E7E7E7"
android:contentDescription="@string/todo"
app:shapeAppearanceOverlay="@style/RoundedCorner" />
您可以为具有固定高度的微光创建一个虚拟视图,使其可见并显示它直到图像加载,一旦图像加载,使虚拟视图可见性消失。
//XML
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<shimmerView //You can use your own
android:id="@+id/dummyShimmerView"
android:layout_width="100dp"
android:layout_height="100dp"/>
<ImageView
android:id="@+id/postImageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone"/>
</RelativeLayout>
//dummyShimmerView visibility is visible byDefault
Glide.with(context)
.load(url)
.listener(object : RequestListener<Drawable> {
override fun onLoadFailed(e: GlideException?, model: Any?, target: Target<Drawable>?, isFirstResource: Boolean): Boolean {
//TODO: something on exception
}
override fun onResourceReady(resource: Drawable?, model: Any?, target: Target<Drawable>?, dataSource: DataSource?, isFirstResource: Boolean): Boolean {
Log.d(TAG, "OnResourceReady")
dummyShimmerView.visibility = View.GONE
postImageView.visibility = View.VISIBLE
return false
}
})
.into(imgView)