Научитесь составлять список с помощью RecyclerView

Определение

Во-первых, прежде чем мы будем использовать этот компонент, мы должны знать, что такое RecyclerView? и зачем нам это нужно? И какова цель внедрения этого компонента в наше приложение. Что такое RecyclerView? Как указано в документации по Android, RecyclerView аналогичен ListView, но с дополнительными функциями, хорошим подходом к отображению списка и дополнительными преимуществами для отображения большого объема данных. Почему мы должны использовать RecyclerView вместо использования ListView?, честно говоря, зависит от вас, в некоторых случаях в нашем приложении просто нужен ListView, потому что данные для списка, отображаемые в приложении, небольшие, просто набор текста из списка, и реализация проста таким образом, но RecyclerView более современный и гибкий, и для реализации нам нужна концепция понимания RecyclerView. Вот схема:

Набор данных

Все типы данных, которые мы можем показать в RecyclerView, такие как:

Текст
Изображение
Икона

Данные могут поступать откуда угодно, например:

Локальная база данных
Прямые данные программным способом
запрос ответа от API

Адаптер

Адаптер предназначен для того, чтобы помочь правильно работать с интерфейсом, не совместимым для правильной работы. В представлении RecyclerView адаптер является “мостом” для данных и интерфейса. Адаптер является носителем между данными и интерфейсом, он может принимать или принимать данные.

Просмотр вторичной переработки

Как объяснялось в предыдущей статье, RecyclerView – это компонент для создания списка в приложении с гибкой и хорошей производительностью. Менеджер компоновки помещает элемент в приложение для управления элементами повторного использования, если элемент не виден пользователем.

Добавьте зависимость и Реализуйте компонент

Для начинающих ребят, которые все еще изучают основы, я постараюсь объяснить, чему я научился. Надеюсь, читатель понимает эту реализацию, в противном случае вы можете глубоко понять, используя codelabs от Google. Для зависимости вы просто добавляете реализацию "android.recyclerview:recyclerview:1.1.0 в свой файл build.gradlew. и для реализации в вашем макете вы просто добавляете, используя этот код:

для android: layout_width и android: layout_height зависит от вашего случая, который является вашим дизайном или вашим родительским компонентом. После вызова основного компонента recyclerview нам нужно создать другой макет для элемента, например, мы создаем элемент со значком слева и названием элемента справа, код выглядит так:

Создайте адаптер и модель

В учебнике codelabs вы можете напрямую вставлять данные без использования модели, но для хорошего дизайна и простоты понимания и обслуживания в будущем мы создадим класс адаптера и модели, конечно, в другом файле. Вот пример модели, которую я использовал в этой статье:

public class MenuModel {
    private String menuName;
    private int iconName;

    // constructor
    public MenuModel(String menuNameParam, int iconNameParam) {
        menuName = menuNameParam;
        iconName = iconNameParam;
    }

    // getter
    public String getMenuName() {
        return menuName;
    }

    // setter
    public void setMenuName(String menuNameParam) {
       this.menuName = menuNameParam;
    }

    // getter
    public int getIconName() {
        return iconName;
    }

    // setter
    public void setIconName(int iconNameParam) {
        this.iconName = iconNameParam;
    }
 }

Подождите, почему вы используете Java? не используете Котлин? Почему?, Я думаю, что это личный язык программирования Java, который имеет много ссылок в Интернете, и если вы хотите использовать Kotlin, я рекомендую понять Java в Android, а затем попытаться реализовать его способом Kotlin. В любом случае, адаптер кода выглядит так:

    public class MenuAdapter extends RecyclerView.Adapter {

    // storing data in adapter
    private final LinkedList containMenuList; // hold data in list
    private LayoutInflater mInflater; // read layout item

    class MenuViewHolder extends RecyclerView.ViewHolder implements View.OnClickListener {
        // define variable
        public final TextView menuTextItemView; // for display data by TextView
        public final ImageView menuImageItemView; // for display data by ImageView
        final ModelAdapter mAdapter;

        // constructor
        public MenuViewHolder(View itemView, MenuAdapter adapter) {
            super(itemView);
            menuTextItemView = itemView.findViewById(R.id.menu_item); // menu text
            menuImageItemView = itemView.findViewById(R.id.menu_icon); // menu icon
            this.mAdapter = adapter;
            // connect onClickListener
            itemView.setOnClickListener(this);
        }
        @Override
        public void onClick(View view) {
            // when item click do something...
        }
     }

     // constructor  
     // fill constructor with inflater variable, and set LinkedList to passed data  
     public MenuAdapter(Context context, LinkedList paramMenuMenuList) {  
         mInflater = LayoutInflater.from(context);  
         this.menuMenuList = paramMenuMenuList;  
     }

     // recyclerview method  
     // after fill constructor adapter, then fill recyclerview method  
     @Override  
     public MenuAdapter.MenuViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {  
         View menuItemView = mInflater.inflate(R.layout.item_menu, parent, false);  // item layout
         return new MenuViewHolder(menuItemView, this);  
     }

     @Override  
     public void onBindViewHolder(MenuAdapter.MenuViewHolder holder, int position) {  
         // get the data model based on position  
         MenuModel menu = containMenuList.get(position);  
         // set item views  
         holder.menuTextItemView.setText(menu.getMenuName());
         holder.menuImageItemView.setImageResource(menu.getIconName());  
     }

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

Внедрите адаптер и модель в основной класс

Для этого мы должны предположить, что в классе адаптера есть методы держателя, а класс модели имеет класс получения и установки, включая конструктор, после этого мы объявляем переменную в нашем классе следующим образом:

    // initialize list/array for recyclerview
    private final LinkedList containMenuList = new LinkedList<>();
    // call member variable from adapter
    private RecyclerView mRecyclerView;
    private MenuAdapter mAdapter;

А затем реализуйте основную функцию вот так, в этом я использую фрагмент вместо действия:

    // define root view for inflate, and call findViewById
    View rootView = inflater.inflate(R.layout.fragment_menu, container, false);

    // implement recyclerview
    // insert data into list
    containMenuList.add(new MenuModel("History", R.drawable.ic_history));
    containMenuList.add(new MenuModel("Download", R.drawable.ic_download));
    containMenuList.add(new MenuModel("My List", R.drawable.ic_list));

    // define adapter
    // Get a handle to the RecyclerView.
    mRecyclerView = rootView.findViewById(R.id.main_menu);
    // Create an adapter and supply the data to be displayed.
    mAdapter = new AccountAdapter(getActivity(), containMenuList);
    // Connect the adapter with the RecyclerView.
    mRecyclerView.setAdapter(mAdapter);
    // Give the RecyclerView a default layout manager.
    mRecyclerView.setLayoutManager(new LinearLayoutManager(getActivity()));
    // add divider
    mRecyclerView.addItemDecoration(new DividerItemDecoration(getActivity(), DividerItemDecoration.VERTICAL));

Вывод

Recyclerview полезен для отображения списка, способ создания списка сильно отличается от других, таких как react-native и flutter, но производительность устройства намного выше. Ну, это долгий путь для меня, в любом случае, это мой первый пост на этом сайте, и я сожалею, если в моей статье есть плохой язык, потому что английский не является моим основным языком. Спасибо вам и, надеюсь, вы, ребята, продолжаете учиться и не забывайте оставаться здоровыми.

Оригинал: “https://dev.to/rifqi31/learn-to-make-list-using-recyclerview-4oea”