Dev
0 subscribers

Туториал по RecyclerView. Как создать RecyclerView для android на java

Туториал по RecyclerView. Как создать RecyclerView для android на java

Чтобы создать список элементов как на фото особого труда не требуется. Не буду писать много воды, приступим сразу.

Язык программирования - java.

Создадим новый проект.

В mainactivity.xml добавим RecyclerView

<?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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
>

<
androidx.recyclerview.widget.RecyclerView
android:id="@+id/rec_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="parent"
/>
</
androidx.constraintlayout.widget.ConstraintLayout>

В MainActivity.java создадим лист с данными и передами его адаптеру, который будет отвечать за вывод данных на экран

public class MainActivity extends AppCompatActivity {
ArrayList<ItemData>
dataArrayList;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.
activity_main);

RecyclerView recyclerView = findViewById(R.id.
rec_view);

recyclerView.setLayoutManager(
new LinearLayoutManager
(
this // контекст
, RecyclerView.VERTICAL, // ориентация
false)); //reverseLayout

// Инициализируем лист
dataArrayList = new ArrayList<>();

// наполняем лист данными, передавая данные в другой метод
getAllData("Яна", "Я приду завтра", R.drawable.img);
getAllData(
"Влад", "Не знаю", R.drawable.img_1);
getAllData(
"Ксюша", "Привет", R.drawable.img_2);
getAllData(
"Амир", "Пока", R.drawable.img_3);
getAllData(
"Вика", "До скорого", R.drawable.img_4);

//создаем адаптер и передаем лист с данными через конструктор
recyclerView.setAdapter(new Adapter(dataArrayList));
}

private void getAllData(String name, String message, int image) {
// принимаем данные и наполняем лист

// можно было и не создавать класс ItemData, а передавать данные сразу в класс адаптера, но так удобнее и меньше шансов ошибиться
ItemData itemData = new ItemData();
itemData.setName(name);
itemData.setMessage(message);
itemData.setImage(image);
dataArrayList.add(itemData);
}
}

ItemData.java

public class ItemData {
String
message, name;
int image;

public String getMessage() {
return message;
}

public void setMessage(String message) {
this.message = message;
}

public String getName() {
return name;
}

public void setName(String name) {
this.name = name;
}

public int getImage() {
return image;
}

public void setImage(int image) {
this.image = image;
}
}

вот так будет выглядеть каждый отдельный элемент в RecyclerView

item.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"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
>

<!-- вместо обычного ImageView можно создать ShapeableImageView, чтобы -->
<!-- картинки были круглыми
-->
<com.google.android.material.imageview.ShapeableImageView
android:id="@+id/image"
android:layout_width="110dp"
android:layout_height="110dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:shapeAppearanceOverlay="@style/imageViewRounded"
/>

<
TextView
android:id="@+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintStart_toEndOf="@id/image"
app:layout_constraintTop_toTopOf="parent"
android:textSize="16sp"
android:layout_margin="10dp"
android:textStyle="bold"
/>

<
TextView
android:id="@+id/message"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintStart_toEndOf="@id/image"
app:layout_constraintTop_toBottomOf="@id/name"
android:layout_margin="10dp"
android:textSize="14sp"
/>
</
androidx.constraintlayout.widget.ConstraintLayout>

Чтобы фото было круглым в styles.xml или themes.xml нужно добавить

<style name="imageViewRounded">
<
item name="cornerFamily">rounded</item>
<
item name="cornerSize">51%</item>
</
style>

Сам адаптер, который и будет отвечать за вывод данных на экран

public class Adapter extends RecyclerView.Adapter<Adapter.ItemViewHolder> {
ArrayList<ItemData>
itemData;

// передаем лист через конструктор
public Adapter(ArrayList<ItemData> itemData) {
this.itemData = itemData;
}

@NonNull
@Override
public ItemViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
View layoutInflater = LayoutInflater.
from(parent.getContext())
.inflate(R.layout.
item, parent, false);
return new ItemViewHolder(layoutInflater);
}

@Override
public void onBindViewHolder(@NonNull ItemViewHolder holder, int position) {
ItemData item =
itemData.get(position);

// подставляем нужную картинку и имя и смс в каждый элемент списка
holder.image.setBackgroundResource(item.getImage());
holder.
name.setText(item.getName());
holder.
message.setText(item.getMessage());
}

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

class ItemViewHolder extends RecyclerView.ViewHolder {
TextView
name, message;
ImageView
image;

ItemViewHolder(View itemView) {
super(itemView);
name = itemView.findViewById(R.id.name);
message = itemView.findViewById(R.id.message);
image = itemView.findViewById(R.id.image);
}
}
}

#recyclerView

#java

#android

#android studio

#программирование

#андроид

#джава