Làm cách nào để thêm bộ tách phân đoạn/bộ chia vào một ListView?

Question

Tôi hiện đang tạo một menu cho ứng dụng của mình, sử dụng lớp con DrawerLayout và lớp con ArrayAdapter để đạt được thứ gì đó giống như trình đơn ngăn kéo của Facebook.

Hiện tại tôi không có vấn đề gì trong việc tạo danh sách, nhưng bây giờ có vẻ tốt, tôi muốn thêm dấu phân tách giữa các loại tùy chọn khác nhau (ví dụ: tùy chọn liên quan đến người dùng và ứng dụng) và thanh tìm kiếm ở đầu thực đơn.

Mã của lớp con ArrayAdaptor hiện tại của tôi là như sau:

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; 
    } 
} 

tôi cho rằng tôi phải ghi đè lên các chức năng thao tác trên ListView bằng cách gọi hàm getView, nhưng tôi không thể tìm thấy trong đó hoạt nó Là.

Answer 1

Nếu bạn muốn phần đơn giản trong ListView bạn, hãy xem hướng dẫn này:

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

hoặc hướng dẫn này:

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

Phần thứ hai không chi tiết, nhưng có thể dễ hiểu hơn/đơn giản hơn.

Ý tưởng cơ bản là bạn làm cho ListAdapter của bạn có các loại chế độ xem khác nhau. Ví dụ hai Chế độ xem khác nhau trong đó một loại là mục danh sách thực tế hiển thị thông tin và loại Chế độ xem khác là Bộ chia mục.

Từ hướng dẫn:

ListViews và đặc biệt hơn Adapters có thể xử lý một số loại xem. Nếu bạn có một cái nhìn tại giao diện Adaptor bạn sẽ thấy nó có chứa hai phương pháp cụ thể:

• getViewTypeCount() mà trả về số loại chế độ xem AdapterView của bạn quản lý. Hầu hết thời gian phương thức này trả về 1 vì tất cả các mục của ListView giống nhau. Trong trường hợp này, bằng cách trả lại 2, ListView sẽ xử lý hai loại chế độ xem: mục xem thường và Views tách
• getItemViewType(int) phải trả lại một số nguyên giữa 0 (bao gồm) và getViewTypeCount() (không bao gồm). Số đã cho thể hiện loại của Chế độ xem tại vị trí đã cho. Ví dụ, chúng ta có thể đảm bảo giá trị trả về là 0 cho mục xem thường xuyên và 1 cho tách

Answer 2

tôi thêm một câu trả lời ở đây kể từ khi tôi đã tìm một cách khác để điều này. Nó trông giống như các liên kết @Phil được đăng.

Đầu tiên tôi đặt một chuỗi chuỗi của menu tôi muốn hiển thị.Tôi đã viết mảng này trong một tệp tài nguyên XML để thuận tiện cho cá nhân.

<?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> 

Lưu ý rằng tôi có hai phần tử sử dụng tiền tố -sep-. Đây sẽ là dấu phân cách của chúng ta.

Rồi đến các DrawerMenuAdapter tôi đã thể hiện trước đó, mà vẫn là một ArrayAdapter, mà tôi đã thêm một số chức năng:

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; 
    } 
} 

Trong mã này, có một đối tượng gọi userBar. Bạn không thực sự cần phải chú ý đến điều này nhưng nếu bạn quan tâm, đó là một phần tử menu khác, sử dụng một tệp bố cục cụ thể thay vì tệp tôi sử dụng cho các phần tử menu thông thường. Đó là một cách để chứng minh rằng bạn có thể thêm bất kỳ loại bố trí cụ thể bất cứ nơi nào bạn muốn, chỉ bằng cách đọc các chuỗi của bạn.

Điểm chính ở đây là cách mã tìm kiếm dấu phân tách, các chuỗi có tiền tố -sep-. Khi đã tìm thấy một, tiền tố sẽ bị xóa và bố cục phù hợp được gán cho dấu phân cách.

Aight, đó là những gì tôi đã tìm thấy. Sau này, bạn sẽ phải tìm cách riêng của bạn để thêm người nghe nhấp chuột. Các mỏ được thực hiện trong các DrawerLayout.setOnCliclListener mà về cơ bản thực hiện công việc theo cùng một cách chính xác tài liệu của Google nói. Nhưng bạn cũng có thể sử dụng setOnclickListener để xem của bạn khi bạn thêm chúng, và sử dụng một tập tin XML, nơi bạn có thể thiết lập riêng onClick thuộc tính của bạn ...

Hy vọng nó sẽ giúp =)