2015-08-27 4 views
4

Я успешно реализовал разделы в виде ресайклера, как показано на скриншоте с двумя разными типами представлений. Как реализовать липкий заголовок в представлении recycler. Я хочу, чтобы «А» придерживался вершины, пока пользователь не прокручивается вверх, и в этом случае следующий элемент, который будет придерживаться вершины, будет «В». Как это сделать?Липкий заголовок/элемент в recyclerview

Recycler View

+0

В GitHub уже есть несколько реализаций липкого заголовка. Например https://github.com/timehop/sticky-headers-recyclerview – fisher3421

+1

Я хотел бы сделать это сам, поэтому, если бы вы могли указать классы, которые мне нужно посмотреть в проекте github, это было бы здорово или дать краткое представление о том, как это нужно сделать. –

+1

Возможный дубликат [Как сделать липкие заголовки в RecyclerView? (Без внешней библиотеки)] (http://stackoverflow.com/questions/32949971/how-can-i-make-sticky-headers-in-recyclerview-without-external-lib) – tir38

ответ

2

Вы определенно хотите использовать библиотеку для этого. Emil Sjölander's StickyListHeaders - хороший выбор (я использовал его в нескольких проектах), но есть и другие библиотеки.

Не зная специфику вашего кода, здесь грубый набросок того, как вы могли бы сделать это с StickyListHeaders:

  • Создать макет для ваших статей и заголовков (вы, наверное, уже есть что). Предположим, что они называются item_cheese.xml и item_header.xml.

  • Замените ListView на StickyListHeadersListView в вашем файле макета.

  • Создайте пользовательский адаптер для вашей коллекции сыров (возможно, у вас это уже есть) и сделайте его реализованным StickyListHeadersAdapter.

Интерфейс добавляет только два метода:

public interface StickyListHeadersAdapter extends ListAdapter { 
    View getHeaderView(int position, View view, ViewGroup parent); 
    long getHeaderId(int position); 
} 

Полная реализация адаптера будет выглядеть следующим образом. Он использует ViewHolders для обоих элементов и заголовков (переработать взгляды, как вы спросили):

public class CheeseAdapter extends BaseAdapter implements StickyListHeadersAdapter { 

    private List<String> cheeses; 
    private final LayoutInflater inflater; 

    public CheeseAdapter(Context context, List<String> cheeses) { 
     // Assuming cheeses are already alphabetically sorted at this point 
     this.cheeses = cheeses; 
     this.inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE); 
    } 

    @Override 
    public int getCount() { 
     return (cheeses != null) ? cheeses.size() : 0; 
    } 

    @Override 
    public Object getItem(int position) { 
     return cheeses.get(position); 
    } 

    @Override 
    public long getItemId(int position) { 
     return position; 
    } 

    @Override 
    public View getView(int position, View view, ViewGroup parent) { 
     CheeseViewHolder holder; 
     if (view != null) 
      holder = (CheeseViewHolder) view.getTag(); 
     else { 
      view = inflater.inflate(R.layout.item_cheese, parent, false); 
      holder = new CheeseViewHolder(view); 
      view.setTag(holder); 
     } 
     holder.decorate(cheeses.get(position)); 
     return view; 
    } 

    @Override 
    public long getHeaderId(int position) { 
     // Return the first char of each item as its header ID 
     return cheeses.get(position).charAt(0); 
    } 

    @Override 
    public View getHeaderView(int position, View view, ViewGroup parent) { 
     HeaderViewHolder holder; 
     if (view != null) 
      holder = (HeaderViewHolder) view.getTag(); 
     else { 
      view = inflater.inflate(R.layout.item_header, parent, false); 
      holder = new HeaderViewHolder(view); 
      view.setTag(holder); 
     } 
     holder.decorate(cheeses.get(position)); 
     return view; 
    } 

    public class CheeseViewHolder { 

     TextView tvCheeseName; 

     public CheeseViewHolder(View view) { 
      tvCheeseName = (TextView) view.findViewById(R.id.tvCheeseName); 
     } 

     public void decorate(String cheeseName) { 
      if (cheeseName == null) return; 
      tvCheeseName.setText(cheeseName); 
     } 
    } 

    public class HeaderViewHolder { 

     TextView tvHeader; 

     public CheeseViewHolder(View view) { 
      tvHeader = (TextView) view.findViewById(R.id.tvHeader); 
     } 

     public void decorate(String cheeseName) { 
      if (cheeseName == null || cheeseName.isEmpty()) return; 
      tvHeader.setText(cheeseName.toUpperCase().charAt(0)); 
     } 
    } 
} 
  • Используйте пользовательский адаптер в вашей деятельности или фрагмента. ScrollView будет иметь алфавитные разделы с липкими заголовками и будет вести себя just as advertised.

Простой как это.

Смежные вопросы