Jak dodać separatory/separatory sekcji do ListView?

Question

Obecnie tworzę menu dla mojej aplikacji, używając podklasy DrawerLayout i ArrayAdapter, aby uzyskać coś, co wygląda jak menu szufladowe Facebooka.

Obecnie nie mam żadnych problemów z tworzeniem listy, ale teraz, gdy wygląda dobrze, chciałbym dodać separatory między różnymi opcjami (np. Związane z użytkownikiem i opcjami związanymi z aplikacją) i paskiem wyszukiwania na górze menu.

Kod z moim obecnym ArrayAdaptor podklasy jest następujący:

public class DrawerMenuAdapter extends ArrayAdapter<String>{ 
    private Context context; 
    private String[] values; 
    private int resId; 

    public DrawerMenuAdapter(Context context, int textViewResourceId, String[] values) { 
     super(context, textViewResourceId, values); 
     this.context = context; 
     this.values = values; 
     this.resId = textViewResourceId; 
    } 

    @Override 
    public View getView(int position, View convertView, ViewGroup parent){ 
     LayoutInflater inflater = (LayoutInflater) context 
       .getSystemService(Context.LAYOUT_INFLATER_SERVICE); 
     View rowView = inflater.inflate(this.resId, parent, false); 

     TextView elementText = (TextView)rowView.findViewById(R.id.element_text); 
     ImageView elementImage = (ImageView)rowView.findViewById(R.id.element_icon); 
     String textValue = values[position]; 

     elementText.setText(textValue); 

     //This switch adds the icons to the related elements 
     switch (position){ 
      case 0: 
       elementImage.setImageResource(R.drawable.search); 
       break; 
      case 1: 
       elementImage.setImageResource(R.drawable.facebook_friends); 
       break; 
      case 2: 
       elementImage.setImageResource(R.drawable.flirts_history); 
       break; 
      case 3: 
       elementImage.setImageResource(R.drawable.premium); 
       break; 
      case 4: 
       elementImage.setImageResource(R.drawable.settings); 
       break; 
      case 5: 
       elementImage.setImageResource(R.drawable.share_app); 
       break; 
      case 6: 
       elementImage.setImageResource(R.drawable.cgu); 
       break; 
     } 


     return rowView; 
    } 
} 

Zakładam, że muszę zastąpić funkcję, która zapełnia ListView przez wywołanie funkcji getView, ale nie mogę znaleźć, który go funkcjonować jest.

Answer 1

Jeśli chcesz proste sekcje swojej ListView, przyjrzeć się tej lekcji:

http://cyrilmottier.com/2011/07/05/listview-tips-tricks-2-section-your-listview/

lub tym tutorialu:

http://bartinger.at/listview-with-sectionsseparators/

Drugi nie jest tak szczegółowy, ale prawdopodobnie łatwiejszy do zrozumienia/utrzymany prostszy.

Podstawową ideą jest to, że użytkownik powoduje, że twój ListAdapter ma różne rodzaje widoków. Na przykład dwa różne widoki, w których jeden rodzaj jest faktycznym elementem listy wyświetlającym informacje, a inny rodzaj jest dzielnikiem sekcji.

z samouczka:

ListViews a dokładniej Adaptery mogą obsługiwać kilka rodzajów poglądów. Jeśli spojrzeć na interfejsie sieciowym można zauważyć, że zawiera dwa specyficzne metody:

• getViewTypeCount() która zwraca liczbę typów poglądów Twój AdapterView zarządza. Przez większość czasu ta metoda zwraca 1 ponieważ wszystkie pozycje ListView są podobne. W tym przypadku, wracając 2, ListView będzie obsługiwać dwa rodzaje poglądów: regularne pozycja Odwiedzin a separatorem Odwiedzin
• getItemViewType(int) musi zwracać liczbę całkowitą między 0 (włącznie) i getViewTypeCount() (Exclusive). Podana liczba wyraża typ widoku w danej pozycji. Na przykład, możemy zapewnić zwracane wartości te wynoszą 0 do regularnych poz poglądów i 1 dla separatorów

Answer 2

Dodaję odpowiedź tutaj ponieważ byłem zorientowali inny sposób do tego. Wygląda trochę jak linki @Phil opublikowane.

Najpierw ustawię tablicę znaków menu, które chcę wyświetlić.Napisałem tę tablicę w pliku zasobów XML dla wygody użytkownika.

<?xml version="1.0" encoding="utf-8"?> 
<resources> 
    <string-array 
      name="drawer_menu_options"> 
     <item>Username</item> 
     <item>-sep-Flirter</item> 
     <item>Recherche</item> 
     <item>Amis Facebook</item> 
     <item>Flirts</item> 
     <item>Compte premium</item> 
     <item>-sep-Menu</item> 
     <item>Réglages</item> 
     <item>Inviter des amis</item> 
     <item>CGU</item> 
    </string-array> 
</resources> 

Zauważ, że mam dwa elementy używające prefiksu -sep-. To będą nasze separatory.

Potem przychodzi DrawerMenuAdapter Pokazałem wcześniej, co jest wciąż ArrayAdapter, na którym Dodałem kilka funkcjonalności:

public class DrawerMenuAdapter extends ArrayAdapter<String>{ 
    private Context context; 
    private String[] values; 
    private int resId; 
    private int separatorId = 0; 
    private int userbarId = 0; 

    public DrawerMenuAdapter(Context context, int textViewResourceId, String[] values) { 
     super(context, textViewResourceId, values); 
     this.context = context; 
     this.values = values; 
     this.resId = textViewResourceId; 
    } 

    public void setSeparator(int resId){ 
     separatorId = resId; 
    } 

    public void setUserbarId(int resId){ 
     userbarId = resId; 
    } 

    @Override 
    public View getView(int position, View convertView, ViewGroup parent){ 
     View rowView; 

     LayoutInflater inflater = (LayoutInflater) context 
       .getSystemService(Context.LAYOUT_INFLATER_SERVICE); 

     if(userbarId != 0 && values[position].equals("Username")){ 
      rowView = inflater.inflate(this.userbarId, parent, false); 

     }else if(separatorId != 0 && values[position].startsWith("-sep-")){ 
      rowView = inflater.inflate(this.separatorId, parent, false); 

     }else{ 
      rowView = inflater.inflate(this.resId, parent, false); 
     } 

     TextView elementText = (TextView)rowView.findViewById(R.id.element_text); 
     String textValue = values[position]; 

     /* If the current line is a separator, just display a separator. Otherwise, set the 
     matching picture 
     */ 
     if(textValue.startsWith("-sep-")){ 
      elementText.setText(textValue.substring("-sep-".length())); 

     }else{ 
      if(textValue.equals("Username")){ 
       elementText.setText(context.getSharedPreferences("LovRUserSettings", 0) 
         .getString("firstName", "Username")); 
      }else{ 
       elementText.setText(textValue); 
      } 
      ImageView elementImage = (ImageView)rowView.findViewById(R.id.element_icon); 
      switch (position){ 
       case 2: 
        elementImage.setImageResource(R.drawable.search); 
        break; 
       case 3: 
        elementImage.setImageResource(R.drawable.facebook_friends); 
        break; 
       case 4: 
        elementImage.setImageResource(R.drawable.flirts_history); 
        break; 
       case 5: 
        elementImage.setImageResource(R.drawable.premium); 
        break; 
       case 7: 
        elementImage.setImageResource(R.drawable.settings); 
        break; 
       case 8: 
        elementImage.setImageResource(R.drawable.share_app); 
        break; 
       case 9: 
        elementImage.setImageResource(R.drawable.cgu); 
        break; 
      } 
     } 


     return rowView; 
    } 
} 

w tym kodzie, jest obiekt o nazwie userBar. Naprawdę nie musisz zwracać na to uwagi, ale jeśli jesteś zainteresowany, to jest to inny element menu, używający konkretnego pliku układu zamiast tego, którego używam do zwykłych elementów menu. Jest to sposób na zademonstrowanie, że możesz dodać dowolny układ w dowolnym miejscu, po prostu czytając struny.

Głównym celem jest sposób, w jaki kod wyszukuje separatory, ciągi z prefiksem -sep-. Po znalezieniu prefiks jest usuwany, a układ dopasowujący jest przypisywany do separatora.

Aight, to właśnie znalazłem. Następnie musisz znaleźć własny sposób dodawania odbiorców kliknięć. Miny są zaimplementowane w DrawerLayout.setOnCliclListener, która w zasadzie wykonuje pracę w taki sam sposób, jak mówi dokumentacja Google. Ale można też użyć setOnclickListener do widzenia, jak je dodawać i korzystać z pliku XML, w którym można ustawić własne onClick atrybuty ...

nadzieję, że pomoże =)