5

Los datos los obtengo de mi bd firebase, estoy obteniendo 4 campos de cada documento los necesito ubicar de la siguiente manera:

así como se ve en la imagen

Pienso que la mejor manera para ubicarlos lado a lado es identificando si el id del ítem es impar inflarlo con el diseño del itemlayout izquierdo y si es par asignarle el diseño con el itemlayout derecho:

 public class AvistAdapter extends RecyclerView.Adapter<AvistAdapter.ViewHolder> {

    /*SimpleDateFormat dateFormatter = new SimpleDateFormat("d 'de' MMMM 'de' yyyy");
    String timestamp = dateFormatter.format(dateFormatter);*/

    public List<ReporteEspecie> reporteEspecie;

    public AvistAdapter(List<ReporteEspecie>reporteEspecie){
        this.reporteEspecie = reporteEspecie;
    }

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

        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_layout_right,parent,false);
        return new ViewHolder(view);
    }


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


        holder.TxtTitulo.setText(reporteEspecie.get(position).getEspecie());
        holder.TxtDetalle.setText(reporteEspecie.get(position).getDireccion());
        holder.TxtDetalle2.setText(reporteEspecie.get(position).getFechaYhora().toString());

    }

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

    public class ViewHolder extends RecyclerView.ViewHolder{
        View mView;

        public TextView TxtTitulo;
        public TextView TxtDetalle;
        public TextView TxtDetalle2;

        public ViewHolder(View itemView) {
            super(itemView);
            mView = itemView;

            TxtTitulo = (TextView) mView.findViewById(R.id.txtTitulo);
            TxtDetalle = (TextView) mView.findViewById(R.id.txtDetalle);
            TxtDetalle2 = (TextView) mView.findViewById(R.id.txtDetalle2);

        }

    }

}

Así llevo mis itemlayout´s:

itemlayout izquierdo

itemlayout derecho

public class EspeciesActivity extends RegistrosActivity {

private static final String TAG = "FireLog";
private RecyclerView mMainList;
private FirebaseFirestore mFirestore;
private AvistAdapter avistAdapter;
private List<ReporteEspecie> reportesEspecies;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_especies);

    reportesEspecies = new ArrayList<>();
    avistAdapter = new AvistAdapter(reportesEspecies);

    mMainList = (RecyclerView) findViewById(R.id.main_list);
    mMainList.setHasFixedSize(true);
    mMainList.setLayoutManager(new LinearLayoutManager(this));
    mMainList.setAdapter(avistAdapter);

    mFirestore = FirebaseFirestore.getInstance();

    mFirestore.collection("reportes").addSnapshotListener(new EventListener<QuerySnapshot>() {
        @Override
        public void onEvent(QuerySnapshot documentSnapshots,FirebaseFirestoreException e) {
            if(e !=null){
                Log.d(TAG, "Error: "+e.getMessage());
            }
            for (DocumentChange doc : documentSnapshots.getDocumentChanges()){

                if(doc.getType()== DocumentChange.Type.ADDED){

                    ReporteEspecie reporteEspecie = doc.getDocument().toObject(ReporteEspecie.class);
                    reportesEspecies.add(reporteEspecie);

                    avistAdapter.notifyDataSetChanged();


                }
            }
        }
    });

}

}

item_layout_right.xml:

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">

    <android.support.constraint.ConstraintLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">

        <ImageView
            android:id="@+id/fondoReporte"
            android:layout_width="248dp"
            android:layout_height="60dp"
            android:background="@drawable/contenedorregistros"
            tools:layout_editor_absoluteX="-3dp"
            tools:layout_editor_absoluteY="27dp" />
    </android.support.constraint.ConstraintLayout>


    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp"
        android:paddingLeft="10dp"
        android:text="Especie: "
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:textSize="15sp"
        android:textStyle="bold" />

    <TextView
        android:id="@+id/txtTitulo"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp"
        android:paddingLeft="70dp"
        android:text="Ave "
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:textSize="15sp" />

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="30dp"
        android:layout_marginTop="25dp"
        android:orientation="horizontal">

        <TextView
            android:id="@+id/textView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="12dp"
            android:paddingLeft="32dp"
            android:text="Dirección: "
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textSize="10sp"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/txtDetalle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="12dp"
            android:text="Av Siempre Viva"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textSize="10sp" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="30dp"
        android:layout_marginTop="55dp"
        android:orientation="horizontal">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingLeft="32dp"
            android:text="Fecha: "
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textSize="10sp"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/txtDetalle2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Viernes 01 Marzo "
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textSize="10sp" />
    </LinearLayout>

    <android.support.constraint.ConstraintLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">


        <ImageView
            android:id="@+id/imgPhoto"
            android:layout_width="86dp"
            android:layout_height="96dp"
            android:src="@drawable/anfibioactivo"
            tools:layout_editor_absoluteX="184dp"
            tools:layout_editor_absoluteY="0dp" />

        <ImageButton
            android:layout_width="109dp"
            android:layout_height="20dp"
            android:background="@drawable/btregistro"
            android:onClick="completarR"
            android:textSize="6sp"
            tools:layout_editor_absoluteX="60dp"
            tools:layout_editor_absoluteY="76dp" />
    </android.support.constraint.ConstraintLayout>
</RelativeLayout>

item_layout_left.xml:

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">

    <android.support.constraint.ConstraintLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">

        <ImageView
            android:id="@+id/fondoReporte"
            android:layout_width="229dp"
            android:layout_height="60dp"
            android:background="@drawable/contenedorregistros"
            tools:layout_editor_absoluteX="54dp"
            tools:layout_editor_absoluteY="32dp" />
    </android.support.constraint.ConstraintLayout>


    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:paddingLeft="80dp"
        android:text="Especie: "
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:textSize="15sp"
        android:textStyle="bold" />

    <TextView
        android:id="@+id/txtTitulo"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:paddingLeft="139dp"
        android:text="Ave "
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:textSize="15sp" />

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="60dp"
        android:layout_marginTop="30dp"
        android:orientation="horizontal">

        <TextView
            android:id="@+id/textView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="12dp"
            android:paddingLeft="32dp"
            android:text="Dirección: "
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textSize="10sp"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/txtDetalle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="12dp"
            android:text="Av Siempre Viva"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textSize="10sp" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="60dp"
        android:layout_marginTop="60dp"
        android:orientation="horizontal">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingLeft="32dp"
            android:text="Fecha: "
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textSize="10sp"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/txtDetalle2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Viernes 01 Marzo "
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textSize="10sp" />
    </LinearLayout>

    <android.support.constraint.ConstraintLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">


        <ImageView
            android:id="@+id/imgPhoto"
            android:layout_width="86dp"
            android:layout_height="96dp"
            android:src="@drawable/aveactiva"
            tools:layout_editor_absoluteX="0dp"
            tools:layout_editor_absoluteY="7dp" />

        <ImageButton
            android:layout_width="109dp"
            android:layout_height="20dp"
            android:background="@drawable/btregistro"
            android:onClick="completarR"
            android:textSize="6sp"
            tools:layout_editor_absoluteX="116dp"
            tools:layout_editor_absoluteY="81dp" />
    </android.support.constraint.ConstraintLayout>
</RelativeLayout>

1
  • La primera imagen es un prototipo de como debe de quedar mi listView Commented el 12 mar. 2019 a las 13:50

2 respuestas 2

3

Puedes usar diferentes tipos de Layouts en un mismo RecyclerView. De hecho, el adapter puede tener diferentes tipos de celdas y usar una u otra según los datos que vayas a mostrar.

public class AvistAdapter extends RecyclerView.Adapter<AvistAdapter.ViewHolder> {
    private const int LEFT_CELL = 0;
    private const int RIGHT_CELL = 1;


    /*SimpleDateFormat dateFormatter = new SimpleDateFormat("d 'de' MMMM 'de' yyyy");
    String timestamp = dateFormatter.format(dateFormatter);*/

    public List<ReporteEspecie> reporteEspecie;

    public AvistAdapter(List<ReporteEspecie>reporteEspecie){
        this.reporteEspecie = reporteEspecie;
    }

    @Override
    public int getItemViewType(int position) {
        if(position % 2 == 0){
            return LEFT_CELL;
        }
        else {
            return RIGHT_CELL;
        }
    }

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

        View view;
        if(RIGHT_CELL == viewType)
            view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_layout_right,parent,false);
        else
            view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_layout_left,parent,false);
        return new ViewHolder(view);
    }


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


        holder.TxtTitulo.setText(reporteEspecie.get(position).getEspecie());
        holder.TxtDetalle.setText(reporteEspecie.get(position).getDireccion());
        holder.TxtDetalle2.setText(reporteEspecie.get(position).getFechaYhora().toString());

    }

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

    public class ViewHolder extends RecyclerView.ViewHolder{
        View mView;

        public TextView TxtTitulo;
        public TextView TxtDetalle;
        public TextView TxtDetalle2;

        public ViewHolder(View itemView) {
            super(itemView);
            mView = itemView;

            TxtTitulo = (TextView) mView.findViewById(R.id.txtTitulo);
            TxtDetalle = (TextView) mView.findViewById(R.id.txtDetalle);
            TxtDetalle2 = (TextView) mView.findViewById(R.id.txtDetalle2);

        }

    }

}

He sobreescrito la función getItemViewType(int position) de tu adapter para indicarle que tipo de celda usar para cada posición (esto le permite reutilizar las celdas apropiadamente) y, en función del tipo de celda, inflado el RecyclerView con un layout u otro.

6
  • no se exactamente donde me genera error, gracias por tu respuesta!! Solo se cierra inesperadamente... :( Commented el 12 mar. 2019 a las 15:42
  • E/AndroidRuntime: FATAL EXCEPTION: main Process: com.example.usuario.app.myroodent, PID: 32652 java.lang.IllegalArgumentException: itemView may not be null at android.support.v7.widget.RecyclerView$ViewHolder.<init>(RecyclerView.java:10833) at com.example.usuario.app.myroodent.AvistAdapter$ViewHolder.<init>(AvistAdapter.java:68) at com.example.usuario.app.myroodent.AvistAdapter.onCreateViewHolder(AvistAdapter.java:42) at com.example.usuario.app.myroodent.AvistAdapter.onCreateViewHolder(AvistAdapter.java:13) Commented el 12 mar. 2019 a las 16:53
  • me habia olvidado de asignar la vista a la variable, ya he modificado la respuesta :)
    – SaraVF
    Commented el 12 mar. 2019 a las 17:01
  • Sabes como puedo solucionar este conflicto Process: com.example.usuario.app.myroodent, PID: 9028 java.lang.RuntimeException: Could not deserialize object. Failed to convert value of type java.lang.Long to String (found in field 'id') at com.example.usuario.app.myroodent.EspeciesActivity$1.onEvent(EspeciesActivity.java:57) at com.example.usuario.app.myroodent.EspeciesActivity$1.onEvent(EspeciesActivity.java:47) Me dice que el error se encuentra en mi actividad EspeciesActivity.java ya la anexe a mi publicación Agradezco cualquier colaboración o recomendación Commented el 12 mar. 2019 a las 17:18
  • según pone en el error, en la parte " Failed to convert value of type java.lang.Long to String (found in field 'id')" estás intentando asignar un Long a un campo que debería ser un String. Fijate que también te marca la línea donde la aplicación deja de funcionar: EspeciesActivity.java:57. Examina esa línea de código y asegurate que los tipos de las variables son los correctos
    – SaraVF
    Commented el 12 mar. 2019 a las 17:28
2

Bien, para hacer esto vas a necesitar 2 viewHolders, recordemos que los viewHolders son los que inflan el layout con la plantilla que vas a usar para poner los datos.

Entonces deberias tener dos layouts, uno para

R.layout.item_layout_right

y otro para

R.layout.item_layout_left

Ahora, estos son dos viewTypes distintos, los cuales deberias inflar dependiendo una condicion (si es ave o anfibio)

Definimos los dos viewTypes

public static final int VIEW_TYPE_AVE = 1;
public static final int VIEW_TYPE_ANFIBIO = 2;

En tu onCreateViewHolder() vamos a poner una condición que decida cual vista inflar dependiendo al elemento

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

    View v;
    if(viewType == VIEW_TYPE_AVE) {
    v = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_layout_left,parent,false);

   return new AveViewHolder(v);

 } else {
    v = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_layout_right,parent,false);

  return new AnfibioHolder(v);
  }

    }

Ahora, antes de poner los datos en el onBindViewHolder dependiendo si es un ave o un anfibio vamos a tener que calcular el tipo de item. Esto lo hacemos con getItemViewType()

@Override
    public int getItemViewType(int position) {

   if(tuArrayList.get(position).getNombre().equals(...)) {
    return VIEW_TYPE_AVE;
} else {
    return VIEW_TYPE_ANFIBIO;
  }
}

.equals(...) deberia fijarse si es un ave o un anfibio dependiendo lo que haya en el array, podes poner por ejemplo .equals("ave"). Recorda que getNombre() es una suposicion de como tendras guardado el valor del nombre, pero ahi reemplazas solo para que se de cuenta si es anfibio o ave

Y por ultimo para inflar los datos dependiendo si es ave (izquierda) o anfibio (derecha) en tu onBindViewHolder() elegis cual de los dos inflar dependiendo lo que el viewType nos devolvio

@Override
    public void onBindViewHolder(final RecyclerView.ViewHolder holder, final int position) {
        switch (holder.getItemViewType()) {
            case 1:
                 AveViewHolder  aveViewHolder= (AveViewHolder)holder;
                ...
                break;

            case 2:
                AnfibioViewHolder anfibioViewHolder = (AnfibioViewHolder )holder;
                ...
                break;
        }
    }

Recorda que getItemViewType() devuelve un entero, este entero lo definimos al principio

public static final int VIEW_TYPE_AVE = 1;
public static final int VIEW_TYPE_ANFIBIO = 2;

Entonces, comparando cual de los dos es nos va a devolver si es un anfibio o ave, y si es uno de los dos va a inflar el elemento correspondiendte en el onCreateViewHolder() y lo va a poblar dependiendo cual es en el onBindViewHolder()

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.