J'écris une application pour afficher les scores de la LNH et souhaiterions que chaque équipe de la RecyclERView ait son logo à côté de celui-ci. Il y a une URL que je puisse demander avec une pièce d'identité d'une équipe qui retournera une image Hi-Res du logo de l'équipe. J'essaie de le faire pour que je puisse charger les images dans ma viewModel et les définir dans la vue, car je fais des choses comme le nom de l'équipe, le score actuel, etc.
J'ai essayé d'utiliser Picasso pour cette , mais cela nécessite un contexte que le point de vue n'a pas et que la viewModel ne peut pas accéder directement à l'image d'image pour pouvoir le changer. Alors, comment puis-je charger les images et les exposer avec une liaison de données ou quelque chose d'autre, pour permettre à la vue de les afficher? P>
Voici ma principale pièce: P>
<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto">
<data>
<variable
name="viewModel"
type="com.example.nhlstats.ui.game.GameViewModel" />
</data>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:id="@+id/awayTeam"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_marginTop="12dp">
<ImageView
android:id="@+id/awayTeamLogo"
android:layout_height="36dp"
android:layout_width="0dp"
android:layout_weight="1"
tools:src="@drawable/ic_launcher_background"/>
<TextView
android:id="@+id/awayTeamName"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:layout_gravity="center_vertical"
android:text="@{viewModel.awayTeamName}"
tools:text="CHI Blackhawks"/>
<TextView
android:id="@+id/awayScore"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="center_vertical"
android:text="@{viewModel.awayTeamScore}"
tools:text="0"/>
<TextView
android:id="@+id/gameTime"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="center_vertical"
android:text="@{viewModel.timeRemaining}"
tools:text="14:26 3rd"/>
</LinearLayout>
<LinearLayout
android:id="@+id/homeTeam"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:layout_marginBottom="24dp">
<ImageView
android:id="@+id/homeTeamLogo"
android:layout_height="36dp"
android:layout_width="0dp"
android:layout_weight="1"
tools:src="@drawable/ic_launcher_background"/>
<TextView
android:id="@+id/homeTeamName"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:layout_gravity="center_vertical"
android:text="@{viewModel.homeTeamName}"
tools:text="CAR Hurricanes"/>
<TextView
android:id="@+id/homeScore"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="2"
android:text="@{viewModel.homeTeamScore}"
tools:text="4"/>
</LinearLayout>
</LinearLayout>
</layout>
3 Réponses :
I Guest Vous créerez Votre GameviewModel Code> Pour chaque élémentView, alors lors de la liaison du titulaire de la vue: GameviewModel Code> Classe P> viewModel.awayLogoUrl.observe(this, Observer {
it?.let { url ->
//Show image into itemView using Picasso or Glide
Glide.with(itemView.context).load(url).into(binding.awayTeamLogo)
}
})
viewModel.homeLogoUrl.observe(this, Observer {
it?.let { url ->
//Show image into itemView using Picasso or Glide
Glide.with(itemView.context).load(url).into(binding.homeTeamLogo)
}
})
Merci pour l'exemple, c'est utile. Cela fonctionnerait bien si j'avais une vision image unique, mais comme je l'ai mentionné, j'essaie de le faire pour un recyclerview. Chaque élément de rangée a deux images (différentes) et il y a une quantité indéterminée de lignes. Comment pourrais-je définir les différentes images pour chaque ligne en utilisant quelque chose comme ça?
Pouvez-vous ajouter la classe d'adaptateur à votre message. Il est plus facile de vous montrer où se montrer les codes.
Pour les composants d'architecture Android Voir le modèle,
Ce n'est pas une bonne pratique de transmettre votre contexte d'activité à la vue de l'activité comme une fuite de mémoire. Je ne supporte pas à cela. P>
Vous pouvez créer un observateur d'URL de l'image dans la viewModel et l'observer dans votre classe d'affichage (activité ou fragment), comme celui-ci (comme Duy Khanh Nguyen em> répondit): - P> mais si vous voulez aller avec sinon, vous pouvez simplement utiliser un contexte d'application fort> fourni par le AndroidViewModel code>, vous devez prolonger AndroidViewModel Code> Ce qui est simplement un ViewModel code> qui inclut une référence application code>. Je suis votre cas dans votre baseviewmodel code>. Exemple: - P> class BaseViewModel(application: Application) : AndroidViewModel(application) {
val context = getApplication<Application>().applicationContext
//... ViewModel methods
}
Utilisation de la liaison de données Vous devez créer un adaptateur de liaison personnalisé comme ci-dessous:
<androidx.appcompat.widget.AppCompatImageView
android:layout_height="36dp"
android:layout_width="0dp"
android:layout_weight="1"
app:imageUri="@{viewmodel.teamLogoUri}"/>
Vous pouvez créer une variable LiveData pour l'URL dans ViewModel et l'observer dans l'élément
hey @ cpgreen2 Fabrication de demandes de réseau à Vewmodel n'est pas bonne pratique, crée une classe de référentiel pour faire le travail Suivez Guide
@Duy Khan Nguyen Comment observerait l'URL d'obtenir l'image à apparaître dans l'imageView?
Vous pouvez vérifier ma réponse ci-dessous