Skip to content

Glide Compose image displays incomplete/truncated - only shows top portion #5686

Description

@chengjiamei
Image

Description
When using Glide Compose to load images, the images sometimes display incompletely or truncated, showing only the top portion. The issue occurs particularly with:

  1. Images loaded immediately after capture or from MediaStore
  2. Large images being loaded
  3. Images in lists/composable with dynamic sizing

Environment

  • Glide Version: 4.16.0
  • Glide Compose Version: 1.0.0-beta08

Reproduction Steps

  1. Load an image using GlideImage composable
  2. The image displays only partially (usually top portion)
  3. Full image only appears after navigating away and back to the screen

Code Example

import com.bumptech.glide.compose.GlideImage
import com.bumptech.glide.integration.compose.GlideSubcomposition
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.layout.ContentScale
@Composable
fun ImageLoader(url: String) {
    Box(modifier = Modifier.fillMaxSize()) {
        GlideImage(
            model = url,
            contentDescription = null,
            modifier = Modifier.fillMaxSize(),
            contentScale = ContentScale.Fit
        )
    }
}
// 尝试过以下配置,问题仍然存在
@Composable
fun ImageLoaderWithConfig(url: String) {
    Box(
        modifier = Modifier
            .fillMaxSize()
            .height(400.dp) // 尝试固定高度
            .width(300.dp)  // 尝试固定宽度
    ) {
        GlideImage(
            model = url,
            contentDescription = null,
            modifier = Modifier.fillMaxSize(),
            contentScale = ContentScale.Crop,
            // 尝试以下选项
            // loading = placeholder,
            // failure = errorPlaceholder
        )
    }
}
**Expected Behavior**
The entire image should be displayed completely and consistently without needing to navigate away and back.

**Actual Behavior**
The image displays only partially/truncated, typically showing only the top 30-50% of the image.

**Workarounds Tried**Adding explicit size constraints (width/height) to modifier
✗ Using ContentScale.Crop instead of ContentScale.FitAdding delay (1-2 seconds) before loading - helps but not a solution
✗ Clearing Glide cache before loading
✗ Using different content scales (Fill, Inside, Crop)
✗ Wrapping in Box with specific dimensions


**Additional Notes**
Issue occurs consistently with large images (>2MB)
Works correctly when using traditional Glide with ImageView
Problem is intermittent but reproducible (~60-70% of the time)
Happens more frequently on lower-end devices
Issue persists across multiple Glide Compose versions (tested with 1.0.0-beta06, 1.0.0-beta07, 1.0.0-beta08)
Related Issues
Issue #391: Glide loads only half of image
Issue #426: Download pictures appear incomplete
Issue #419: Potential problem with OKHTTP integration
Temporary Solution
Currently using a workaround with delay:

LaunchedEffect(url) {
    delay(1500) // Wait 1.5 seconds
    loadImage(url)
}

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions