Image du réseau avec Glide trop petit sur Android

Question

J'essaie de télécharger une image du réseau et d'afficher dans le ImageView avec Glide en utilisant l'option scaleType = "centerInside". Pour une raison quelconque, l'image, lorsqu'elle est téléchargée à partir du réseau, semble beaucoup plus petite à l'écran que lorsque la même image est mise dans les ressources ImageView.

Exemple:

se trouvent deux images here. Je dirais que même les images qui ont été définies à partir des ressources semblent plus petites qu'elles ne pourraient l'être en comparaison de ce que je vois sur mon ordinateur portable. Je comprends qu'il y a quelque chose en rapport avec la densité d'écran en jeu, mais comment puis-je rendre ces images de "taille conviviale", par exemple un peu plus grande?

Même un different image de 600x250 px est ridiculement petit sur le téléphone (avec layout_height et layout_width de ImageView mis sur "wrap_content").

code de l'activité:

public class DisplayImagesActivity extends AppCompatActivity { 

    @Override 
    public void onCreate(Bundle savedInstanceState) { 
     super.onCreate(savedInstanceState); 

     setContentView(R.layout.display_image_activity); 
     setSupportActionBar((Toolbar) findViewById(R.id.toolbar)); 
     setTitle("Hello StackOverflow!"); 

     ImageView top_left = (ImageView) findViewById(R.id.top_left); 
     ImageView top_right = (ImageView) findViewById(R.id.top_right); 
     ImageView bottom_left = (ImageView) findViewById(R.id.bottom_left); 
     ImageView bottom_right = (ImageView) findViewById(R.id.bottom_right); 

     String[] urls = new String[] { 
      "http://imgur.com/6jMOdg0.png", 
      "http://imgur.com/AhIziYr.png" 
     }; 

     top_left.setImageResource(R.drawable.top_left); 
     top_right.setImageResource(R.drawable.top_right); 
     Glide.with(this) 
      .load(urls[0]) 
      .signature(new StringSignature(new Date().toString())) 
      .into(bottom_left); 
     Glide.with(this) 
      .load(urls[1]) 
      .signature(new StringSignature(new Date().toString())) 
      .into(bottom_right); 
    } 

    @Override 
    public boolean onOptionsItemSelected(MenuItem item) { 
     switch (item.getItemId()) { 
      case android.R.id.home: 
       this.finish(); 
       return true; 
      default: 
       return super.onOptionsItemSelected(item); 
     } 
    } 
} 

fichier display_image_activity.xml:

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    style="@style/match_parent" 
    android:orientation="vertical"> 

    <include layout="@layout/_toolbar" /> 

    <ScrollView 
     style="@style/match_parent"> 
     <RelativeLayout 
      style="@style/match_parent" 
      android:padding="16dp"> 

      <TextView 
       style="@style/wrap_content" 
       android:id="@+id/text_resources" 
       android:layout_marginBottom="10dp" 
       android:text="From Resources"/> 

      <ImageView 
       android:id="@+id/top_left" 
       android:background="@color/Linen" 
       android:layout_width="150dp" 
       android:layout_height="120dp" 
       android:layout_marginBottom="20dp" 
       android:layout_below="@id/text_resources" 
       android:scaleType="centerInside"/> 

      <ImageView 
       android:id="@+id/top_right" 
       android:background="@color/Linen" 
       android:layout_width="150dp" 
       android:layout_height="120dp" 
       android:layout_toRightOf="@id/top_left" 
       android:layout_toEndOf="@id/top_left" 
       android:layout_below="@id/text_resources" 
       android:layout_marginLeft="20dp" 
       android:layout_marginStart="20dp" 
       android:scaleType="centerInside"/> 

      <TextView 
       style="@style/wrap_content" 
       android:id="@+id/text_network" 
       android:layout_below="@id/top_left" 
       android:layout_marginBottom="10dp" 
       android:text="From Network"/> 

      <ImageView 
       android:id="@+id/bottom_left" 
       android:background="@color/Linen" 
       android:layout_width="150dp" 
       android:layout_height="120dp" 
       android:layout_below="@id/text_network" 
       android:scaleType="centerInside" /> 

      <ImageView 
       android:id="@+id/bottom_right" 
       android:background="@color/Linen" 
       android:layout_width="150dp" 
       android:layout_height="120dp" 
       android:layout_toRightOf="@id/bottom_left" 
       android:layout_toEndOf="@id/bottom_left" 
       android:layout_below="@id/text_network" 
       android:layout_marginLeft="20dp" 
       android:layout_marginStart="20dp" 
       android:scaleType="centerInside" /> 

     </RelativeLayout> 
    </ScrollView> 
</LinearLayout> 

Merci.

Answer 1

Vos images ne peuvent pas être plus grand que ce que vous avez défini:

android:layout_width="150dp" 
android:layout_height="120dp" 

Essayez

android:layout_width="match_parent" 
android:layout_height="wrap_content" 

Answer 2

Votre ImageView s peut être que la taille fixe si vous voulez bien qu'ils doivent être souples avec match_parent/wrap_content.

Je ne sais pas ce que Glide fait à coup sûr, mais il semble que la résolution des images du réseau est inférieure à celle des ressources. Le android:scaleType="centerInside" vous donne le comportement que l'image sera SHRUNK jusqu'à ce que les deux dimensions de l'image tiennent dans le ImageView et que le rapport d'aspect soit maintenu. Si vous voulez que les images se développent pour s'adapter à ImageView, vous voulez probablement android:scaleType="fitCenter" à la place. Vous pouvez également vouloir que android:adjustViewBounds soit vrai/faux selon la façon dont vous voulez qu'il se comporte si vous décidez de rendre les dimensions flexibles.

La documentation scaleType est utile ici: https://developer.android.com/reference/android/widget/ImageView.ScaleType.html https://developer.android.com/reference/android/graphics/Matrix.ScaleToFit.html#CENTER

Answer 3

J'ai fait face au même problème. Glide essaie d'interpréter les besoins de mon application et transforme les images en conséquence, ce qui entraîne des images trop petites dans certains endroits. Dans mon cas le ImageView s utilisent adjustViewBounds="true" et MaxWdt et la hauteur menant à des problèmes

Bien que je ne suis pas près d'être un expert Glide, j'ai trouvé une solution rapide pour moi.

J'ai simplement ajouté un appel mehod .dontTransform(), ce qui dans mon cas est OK puisque j'utilise des miniatures qui ont déjà été mises à l'échelle.

GlideApp.with(context).load(fireStorage).dontTransform().into(imgView); 

(L'utilisation d'un Placeholder aurait probablement aussi ont aidé, mais encore une fois, ce fut pour moi la meilleure façon)