Модернизация в Glide

#android #kotlin #imageview #retrofit #android-glide

#Android #kotlin #просмотр изображений #модернизация #android-glide

Вопрос:

Я использую Retrofit и Glide для простого изображения и TextView. В моем фрагменте «Описание» я хочу отобразить изображение из api в ImageView прямо под TextView. Мои изображения RecyclerView работают отлично, но как мне отобразить одно изображение из retrofit / api в этот класс описания.

Я добавил

         val imageView:ImageView = view!!.findViewById(R.id.item_image)
  

Но я потерялся после этого.

Это фрагмент с textview, в котором я хочу поместить ImageView под текстовым описанием

 class DescriptionFragment : Fragment() {

    companion object {
        fun newInstance() = DescriptionFragment()
    }

    override fun onCreateView(
        inflater: LayoutInflater, container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View {



        return inflater.inflate(R.layout.main_fragment, container, false)
    }


    override fun onActivityCreated(savedInstanceState: Bundle?) {
        super.onActivityCreated(savedInstanceState)

        val textView:TextView = view!!.findViewById(R.id.message)
        val imageView:ImageView = view!!.findViewById(R.id.item_image)


        // Get the arguments from the caller fragment/activity
        val description = arguments?.getString("description")
        description?.let {
            textView.text = "Description : n$description"
        }

    }
}
  

Это XML, в который я хотел бы загрузить изображение

 <?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@ id/description"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".ui.main.DescriptionFragment">

    <ImageView
        android:id="@ id/item_image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="8dp"
        app:layout_constraintBottom_toTopOf="@ id/textView"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@ id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="41dp"
        android:text="@string/full_repo_description"
        app:layout_constraintBottom_toTopOf="@ id/message"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.503"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="1.0" />

    <TextView
        android:id="@ id/message"
        android:layout_width="wrap_content"
        android:layout_height="100dp"
        android:layout_margin="36dp"
        android:text="DescriptionFragment"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>
  

Это класс данных, из которого я получаю avatar_url

 
data class owner(var avatar_url:String);
data class Items(var id: String, var name: String, var full_name: String,var description: String,var owner: owner)
  

Это мой текущий класс recycler, который работает правильно

 class RecyclerAdapter(private val context: Context) : RecyclerView.Adapter<RecyclerAdapter.MyViewHolder>() {

    var itemList: List<Items> = listOf()

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): MyViewHolder {
        val view = LayoutInflater.from(parent.context).inflate(R.layout.card_layout, parent, false)
        return MyViewHolder(view)
    }

    override fun getItemCount(): Int {
        return itemList.size
    }

    override fun onBindViewHolder(holder: MyViewHolder, position: Int) {
        holder.repoId.text = itemList[position].id
        holder.repoName.text = itemList[position].name
        holder.repoFullName.text = itemList[position].full_name

        Glide.with(context).load(itemList[position].owner.avatar_url)
            .apply(RequestOptions().centerCrop())
            .into(holder.repoImage)

        holder.itemView.setOnClickListener {

            val intent = Intent(context, DescriptionActivity::class.java)
            // To pass any data to next activity
            intent.putExtra("description", itemList[position].description)
            // start your next activity
            context.startActivity(intent)

            //  Toast.makeText(context,itemList.get(position).id,Toast.LENGTH_SHORT).show()

        }

    }

    fun setItemsList(itemList: List<Items>) {
        this.itemList = itemList;
        notifyDataSetChanged()
    }

    class MyViewHolder(itemView: View?) : RecyclerView.ViewHolder(itemView!!) {

        val repoId: TextView = itemView!!.findViewById(R.id.item_id)
        val repoName: TextView = itemView!!.findViewById(R.id.item_name)
        val repoFullName: TextView = itemView!!.findViewById(R.id.item_fullname)
        val repoImage: ImageView = itemView!!.findViewById(R.id.item_image)


    }

}
  

И это мой текущий MainActivity

 class MainActivity : AppCompatActivity() {

    lateinit var recyclerView: RecyclerView
    lateinit var recyclerAdapter: RecyclerAdapter

    
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        recyclerView = findViewById(R.id.recyclerview)
        recyclerAdapter = RecyclerAdapter(this)
        recyclerview.layoutManager = LinearLayoutManager(this)
        recyclerView.adapter = recyclerAdapter


        val apiInterface = ApiInterface.create().getItems()

        apiInterface.enqueue(object : Callback<List<Items>> {
            override fun onResponse(call: Call<List<Items>>?, response: Response<List<Items>>?) {

                if (response?.body() != null) {
                    Log.d("myTest", response.body().toString());
                    recyclerAdapter.setItemsList(response.body()!!)
                }
            }

            override fun onFailure(call: Call<List<Items>>?, t: Throwable?) {

            }
        })

    }

}
  

И способ, которым я получаю свой URL-адрес с помощью модернизации

 interface ApiInterface {

    @GET("repos")
    fun getItems() : Call<List<Items>>

    companion object {

        var BASE_URL = "https://api.github.com/orgs/square/"

        fun create() : ApiInterface {

            val retrofit = Retrofit.Builder()
                .addConverterFactory(GsonConverterFactory.create())
                .baseUrl(BASE_URL)
                .build()
            return retrofit.create(ApiInterface::class.java)

        }
    }
}
  

Ответ №1:

Я настоятельно рекомендую использовать привязку данных и добавить адаптер привязки для загрузки вашего изображения с помощью Glide

[ОБНОВЛЕНИЕ 2] Рассмотрите возможность использования размера с фиксированным значением для Imageview (ширина и высота), когда вы хотите динамически отображать изображения (в данном случае, загружаемые из сети)

[ ОБНОВИТЬ ]

Внимательно изучите свой класс RecyclerAdapter. Вы должны поместить ImageUrl в свое намерение, используя этот фрагмент кода:

             intent.putExtra("imageUrl", itemList[position].owner.avatar_url)
  

затем в вашем описании {Фрагмент / Активность} вы должны получить этот URL-адрес и позволить glide сделать все остальное:

 val imageUrl = arguments?.getString("imageUrl")
imageUrl?.let { loadImageViaUrl(imageview, it) }
  

и определите loadImageViaUrl, как показано ниже :

 private fun loadImageViaUrl(view: ImageView, url: String) {
val options = RequestOptions()
    .placeholder(R.drawable.network_image_placeholder) // use any image as placeholder

Glide.with(view.context)
    .setDefaultRequestOptions(options)
    .load(url)
    .into(view)
  

}

Это самый простой способ использования библиотеки Glide.

Комментарии:

1. Я обновил свои классы с помощью макетов и классов, приведенных выше

2. @Brummerly Почему у вас есть DescriptionActivity и DescriptionFragment одновременно? какова цель каждого из них? Удалось ли вам получить описание и отобразить его в текстовом представлении (в DescriptionFragment)? если это так, то у вас единственная проблема в том, что изображение не отображается, да?

3. Да, описание работает отлично, это просто изображение, с которым у меня проблемы

4. @Brummerly, я обновил свой ответ, если у вас все еще есть проблемы с загрузкой изображения, просто дайте мне знать 🙂 чтобы я мог помочь вам с этим.

5. @Brummerly: еще одна вещь, вы делаете хорошо… но ваш код может быть переработан и быть более читаемым 🙂 , я рекомендую вам прочитать несколько статей о <Android Clean Architecture> Это помогает вам писать поддерживаемые коды и значительно снижает сложность 🙂