时间戳

首页 > 解决方案 > Recycleview 自定义布局约束正在改变每个膨胀的视图导致问题

android - Recycleview 自定义布局约束正在改变每个膨胀的视图导致问题

问题描述

我有一个 recyclerview 夸大从 json 获取的数据。

我面临的问题是设计问题 - 有时文本正确对齐并显示图像，有时文本太长，导致我认为无法显示图像。

这是我的 XML：

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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:layout_width="match_parent"
    android:layout_height="wrap_content">

    <android.support.constraint.ConstraintLayout
        android:layout_width="395dp"
        android:layout_height="170dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:layout_marginEnd="8dp"
        android:background="#335634"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <de.hdodenhof.circleimageview.CircleImageView
            android:id="@+id/heroImage"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginStart="8dp"
            android:src="@mipmap/ic_launcher"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <TextView
            android:id="@+id/heroTitle"
            android:layout_width="200dp"
            android:layout_height="wrap_content"
            android:layout_marginTop="16dp"
            android:layout_marginEnd="16dp"
            android:autoSizeMaxTextSize="25dp"
            android:autoSizeMinTextSize="15dp"
            android:text="Hero Title"
            android:textSize="25dp"
            android:textStyle="bold"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <TextView
            android:id="@+id/heroDescription"
            android:layout_width="200dp"
            android:breakStrategy="simple"
            android:layout_height="wrap_content"
            android:layout_marginStart="36dp"
            android:layout_marginTop="24dp"
            android:layout_marginEnd="16dp"
            android:autoSizeMaxTextSize="25dp"
            android:autoSizeMinTextSize="15dp"
            android:text="TextView"
            android:textAlignment="center"
            android:textSize="18dp"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toEndOf="@+id/heroImage"
            app:layout_constraintTop_toBottomOf="@+id/heroTitle" />

    </android.support.constraint.ConstraintLayout>
</android.support.constraint.ConstraintLayout>

这是我的适配器：

public class HeroesAdapter extends RecyclerView.Adapter<HeroesAdapter.HeroesViewHolder> {

    private List<Hero> heroList;

    public HeroesAdapter(List<Hero> heroList) {
        this.heroList = heroList;
    }


    @NonNull
    @Override
    public HeroesViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {

        View rowView = LayoutInflater.from(parent.getContext()).inflate(R.layout.hero_cell, parent, false);
        return new HeroesViewHolder(rowView);
    }

    @Override
    public void onBindViewHolder(@NonNull HeroesViewHolder holder, int position) {

        Hero currentHero = heroList.get(position);
        String str = String.join(",", currentHero.abilities);

        holder.heroTitle.setText(currentHero.title);
        holder.heroAbilties.setText(str);
        Picasso.get().load(currentHero.image).resize(500,500).into(holder.heroesImage);

    }

    @Override
    public int getItemCount() {
        return heroList.size();
    }

    public static class HeroesViewHolder extends RecyclerView.ViewHolder {

        ImageView heroesImage;
        TextView heroTitle;
        TextView heroAbilties;


        public HeroesViewHolder(@NonNull View itemView) {
            super(itemView);
            heroesImage = itemView.findViewById(R.id.heroImage);
            heroTitle = itemView.findViewById(R.id.heroTitle);
            heroAbilties = itemView.findViewById(R.id.heroDescription);
        }
    }
}

这是我得到的结果，这是想要的结果。

我面临的问题是：

  1. 使每一行都有一个干净的设计，并且对所有人都一样。

  2. 有时显示图像，有时不显示。

  3. 底部视图是“一半在屏幕内”和一半在屏幕外。

标签： androidandroid-recyclerviewandroid-constraintlayout

解决方案

通过使用 LinearLayout，你可以设计你的 hero_cell 来给你想要的输出。就像我现在做的那样。

    <?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:orientation="horizontal"
    android:padding="10dp"
    android:background="#335634"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">


    <de.hdodenhof.circleimageview.CircleImageView
        android:id="@+id/heroImage"
        android:layout_width="80dp"
        android:layout_height="wrap_content"
        android:src="@drawable/logo"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
    <LinearLayout
        android:background="#335634"
        android:layout_marginLeft="20dp"
        android:orientation="vertical"
        android:layout_gravity="center_vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <TextView
            android:id="@+id/heroTitle"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:autoSizeMaxTextSize="25dp"
            android:autoSizeMinTextSize="15dp"
            android:text="Hero Title"
            android:textSize="25dp"
            android:textStyle="bold"
            />

        <TextView
            android:id="@+id/heroDescription"
            android:layout_width="match_parent"
            android:breakStrategy="simple"
            android:layout_height="wrap_content"
            android:autoSizeMaxTextSize="25dp"
            android:autoSizeMinTextSize="15dp"
            android:text="TextView"
            android:textSize="18dp" />
    </LinearLayout>

推荐阅读