Lista list di stile Gmail

Question

Voglio creare un listview che sia simile in funzionalità all'app Android di Gmail. Con ciò intendo che è possibile selezionare le righe facendo clic su un'immagine a sinistra o visualizzare un messaggio di posta elettronica facendo clic in qualsiasi altro punto della riga. Posso avvicinarmi, ma non è proprio lì.

La mia riga personalizzata consiste in una ImageView sulla sinistra e alcune TextViews sulla destra. Ecco il succo di getView sul mio adattatore.

@Override 
    public View getView(final int position, View convertView, ViewGroup parent) { 
     View row = super.getView(position, convertView, parent); 

     imageView.setOnClickListener(new View.OnClickListener() { 
      @Override 
      public void onClick(View v) { 
       getListView().setItemChecked(position, !getListView().isItemChecked(position)); 
      } 
     }); 

     row.setOnClickListener(new View.OnClickListener() { 
      @Override 
      public void onClick(View v) { 
       Toast.makeText(getActivity(), "" + position, Toast.LENGTH_SHORT).show(); 
      } 
     }); 
    } 

Questo è molto vicino! Ciò che manca è l'evidenziazione della riga sul listener di clic riga.

Answer 1

Devi impostare un choiceMode per il tuo ListView.

myListView.setChoiceMode(ListView.CHOICE_MODE_SINGLE); 
myListView().setSelector(android.R.color.BLUE); 

Answer 2

Ciò che manca è l'evidenziazione della riga sulla riga click ascoltatore.

Suona come è necessario tema riga listview ...

<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item android:state_pressed="true" 
     <shape> 
      <solid android:color="#929292" /> 
     </shape> 
    </item> 

    <item> 
     <shape> 
      <solid android:color="#FFFFFF" /> 
     </shape> 
    </item> 
</selector> 

Da qui: How do I style selected item in Android ListView?

Answer 3

non è che, come un po 'di ListView personalizzato con imagebuttom al posto di casella di controllo?

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="match_parent" 
android:layout_height="wrap_content" 
android:orientation="horizontal" > 

<ImageView 
    android:id="@+id/ivImage" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:src="@drawable/ic_launcher" 
    android:layout_gravity="left" 
    android:contentDescription="@string/app_name" > 
</ImageView> 

<LinearLayout 
    android:id="@+id/linearLayout1" 
    android:layout_width="0dp" 
    android:layout_height="wrap_content" 
    android:layout_marginLeft="5dp" 
    android:orientation="vertical" 
    android:layout_weight="1" > 

    <TextView 
     android:id="@+id/tvDescr" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_margin="5dp" 
     android:text="" 
     android:textSize="20sp" > 
    </TextView> 

    <TextView 
     android:id="@+id/tvPrice" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_marginLeft="5dp" 
     android:text="" > 
    </TextView> 
    </LinearLayout> 


    </LinearLayout> 

Answer 4

Quello che ti serve è impostare listSelector.

Cosa devi fare per creare un listSelector è un file xml simile a quello pubblicato da Karl.

<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item android:state_pressed="true"> 
     <shape> 
      <solid android:color="#929292" /> 
     </shape> 
    </item> 
    <!-- if you need even a disabled state --> 
    <item android:state_enabled="false" android:drawable="@drawable/my_drawable" /> 
    <item> 
     <shape> 
      <solid android:color="#FFFFFF" /> 
     </shape> 
    </item> 
</selector> 

Come si può vedere, i tag voce può anche utilizzare Android: l'attributo drawable nel caso tu abbia un png che si desidera utilizzare per evidenziare una riga. Cerca tutti gli attributi che questo tag ha da offrire e implementa ciò che ti serve.

Infine, per assicurarsi che il ListView utilizza questo selettore, è necessario impostare all'interno del layout xml:

<ListView 
    android:id="@id/android:list" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:choiceMode="multipleChoice" 
    android:listSelector="@drawable/enel_list_selector"/> 

o tramite il codice:

ListView listView = (ListView) <activity|view>.findViewById(android.R.id.list); 
listView.setSelector(R.drawable.<nameOfYourXmlDrawable>); 

Answer 5

Opzione 1: Usa listView di insito choiceMode caratteristica. Sfortunatamente, non l'ho mai implementato. Quindi, non posso darti una risposta dettagliata. Ma puoi dare un suggerimento da here e altre risposte.

Opzione 2: implementalo da solo. Definisci uno array/list o qualsiasi soluzione che mantenga gli indici dell'elemento selezionato del tuo elenco. E poi usalo per filtrare gli sfondi in getView(). Ecco un esempio:

public class TestAdapter extends BaseAdapter { 

List<String> data; 
boolean is_element_selected[]; 

public TestAdapter(List<String> data) { 
    this.data = data; 
    is_element_selected = new boolean[data.size()]; 
} 

public void toggleSelection(int index) { 
    is_element_selected[index] = !is_element_selected[index]; 
    notifyDataSetChanged(); 
} 

@Override 
public View getView(int position, View convertView, ViewGroup parent) { 
    //Initialize your view and stuff 

    if (is_element_selected[position]) 
     convertView.setBackgroundColor(context.getResources().getColor(R.color.blue_item_selector)); 
    else 
     convertView.setBackgroundColor(Color.TRANSPARENT); 

    imageView.setOnClickListener(new View.OnClickListener() { 
      @Override 
      public void onClick(View v) { 
       toggleSelection(position); 
      } 
     }); 

     row.setOnClickListener(new View.OnClickListener() { 
      @Override 
      public void onClick(View v) { 
       //get to detailed view page 
      } 
     }); 

    return convertView; 
} 

Buona fortuna!

Answer 6

Questo collegamento può aiutare a utilizzare Gmail come colpo e più animazioni

github list view aniamtion

Answer 7

Ecco come ho fatto il mio metodo GetView:

public View getView(final int position, View convertView, ViewGroup parent) { 
    ViewHolder holder; 

    LayoutInflater inflater = (LayoutInflater) context.getApplicationContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE); 
    if (convertView == null) { 
     convertView = inflater.inflate(R.layout.list_item, null); 
     holder = new ViewHolder(); 
     holder.title = (TextView) convertView.findViewById(R.id.title); 
     holder.selectBox = (ImageView) convertView.findViewById(R.id.selectBox); 
     convertView.setTag(holder); 
    } 

    holder = (ViewHolder) convertView.getTag(); 

    holder.title.setText(getItem(position).getTitle()); 
    holder.selectBox.setTag("" + position); 
    holder.selectBox.setOnClickListener(new OnClickListener() { 
     @Override 
     public void onClick(View v) { 
      ivFlip = (ImageView) v; 
      ivFlip.clearAnimation(); 
      ivFlip.setAnimation(animation1); 
      ivFlip.startAnimation(animation1); 
      setAnimListners(mailList.get(Integer.parseInt(v.getTag().toString()))); 
     } 

    }); 

    if (mailList.get(position).isChecked()) { 
     holder.selectBox.setImageResource(R.drawable.cb_checked); 
     convertView.setBackgroundColor(context.getResources().getColor(R.color.list_highlight)); 

    } else { 
     holder.selectBox.setImageResource(R.drawable.cb_unchecked); 
     convertView.setBackgroundDrawable(context.getResources().getDrawable(R.drawable.list_selector)); 

    } 

    return convertView; 

} 

private void setAnimListners(final MyListItem curMail) { 
    AnimationListener animListner; 
    animListner = new AnimationListener() { 

     @Override 
     public void onAnimationStart(Animation animation) { 
      if (animation == animation1) { 
       if (curMail.isChecked()) { 
        ivFlip.setImageResource(R.drawable.cb_unchecked); 
       } else { 
        ivFlip.setImageResource(R.drawable.cb_checked); 
       } 
       ivFlip.clearAnimation(); 
       ivFlip.setAnimation(animation2); 
       ivFlip.startAnimation(animation2); 
      } else { 
       curMail.setIsChecked(!curMail.isChecked()); 
       setCount(); 
       setActionMode(); 
      } 
     } 

     // Set selected count 
     private void setCount() { 
      if (curMail.isChecked()) { 
       checkedCount++; 
      } else { 
       if (checkedCount != 0) { 
        checkedCount--; 
       } 
      } 

     } 

     // Show/Hide action mode 
     private void setActionMode() { 
      if (checkedCount > 0) { 
       if (!isActionModeShowing) { 
        mMode = ((MainActivity) context).startActionMode(new MainActivity.AnActionModeOfEpicProportions(context)); 
        isActionModeShowing = true; 
       } 
      } else if (mMode != null) { 
       mMode.finish(); 
       isActionModeShowing = false; 
      } 

      // Set action mode title 
      if (mMode != null) 
       mMode.setTitle(String.valueOf(checkedCount)); 

      notifyDataSetChanged(); 

     } 

     @Override 
     public void onAnimationRepeat(Animation arg0) { 
      // TODO Auto-generated method stub 

     } 

     @Override 
     public void onAnimationEnd(Animation arg0) { 
      // TODO Auto-generated method stub 

     } 
    }; 

    animation1.setAnimationListener(animListner); 
    animation2.setAnimationListener(animListner); 

} 

e ho usato due animazioni:

a) to_middle.xml:

<?xml version="1.0" encoding="utf-8"?> 
<scale xmlns:android="http://schemas.android.com/apk/res/android" 
    android:duration="200" 
    android:fromXScale="1.0" 
    android:fromYScale="1.0" 
    android:pivotX="50%" 
    android:pivotY="50%" 
    android:toXScale="0.0" 
    android:toYScale="1.0" /> 

b) from_middle.xml:

<?xml version="1.0" encoding="utf-8"?> 
<scale xmlns:android="http://schemas.android.com/apk/res/android" 
    android:duration="200" 
    android:fromXScale="1.0" 
    android:fromYScale="1.0" 
    android:pivotX="50%" 
    android:pivotY="50%" 
    android:toXScale="0.0"/> 

Speranza questo link vi aiuterà ulteriormente: http://techiedreams.com/gmail-like-flip-animated-multi-selection-list-view-with-action-mode/