Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to create an alphabetical scrollbar displaying all the letter in android?

My purpose is to obtain something like that :
http://appsreviews.com/wp-content/uploads/2010/08/Cures-A-Z-App-for-iPhone.jpg

But the only examples i can find are lists like that :
android - listview fastscroll with alphabet like on iPhone contacts activity

Obviously, I don't want a list like the contacts which displays the letters when you fastscroll. I know how to do this.

Any pointer would be welcome. (I tried this but no success)

Below, the full solution as suggest by FunkTheMonk (thanks a lot) :

Define the listview as usual. Define a RelativeLayout containing the ListView and on the right, a LinearLayout with all the letters. For a better solution, the list of letters could be generated dynamically to only display the letters in the list. Then in the onClick method, add the behaviour to scroll the list :

xml

<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"     android:layout_width="match_parent" android:layout_height="match_parent">      <ListView android:id="@android:id/list" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_marginRight="28dip" />      <LinearLayout android:orientation="vertical"         android:layout_width="28dip" android:layout_height="wrap_content"         android:layout_alignParentRight="true" android:background="@android:color/transparent" >          <TextView android:id="@+id/A" android:text="A" android:tag="A"             style="@style/alphabetTextView"/>         <TextView android:id="@+id/B" android:text="B" android:tag="B"             style="@style/alphabetTextView" />         <TextView android:id="@+id/C" android:text="C" android:tag="C"             style="@style/alphabetTextView" />         <TextView android:id="@+id/D" android:text="D" android:tag="D"             style="@style/alphabetTextView" />         <TextView android:id="@+id/E" android:text="E" android:tag="E"             style="@style/alphabetTextView" />         <TextView android:id="@+id/F" android:text="F" android:tag="F"             style="@style/alphabetTextView" />         <TextView android:id="@+id/G" android:text="G" android:tag="G"             style="@style/alphabetTextView" />         <TextView android:id="@+id/H" android:text="H" android:tag="H"             style="@style/alphabetTextView" />         <TextView android:id="@+id/I" android:text="I" android:tag="I"             style="@style/alphabetTextView" />         <TextView android:id="@+id/J" android:text="J" android:tag="J"             style="@style/alphabetTextView" />         <TextView android:id="@+id/K" android:text="K" android:tag="K"             style="@style/alphabetTextView" />         <TextView android:id="@+id/L" android:text="L" android:tag="L"             style="@style/alphabetTextView" />         <TextView android:id="@+id/M" android:text="M" android:tag="M"             style="@style/alphabetTextView" />         <TextView android:id="@+id/N" android:text="N" android:tag="N"             style="@style/alphabetTextView" />         <TextView android:id="@+id/O" android:text="O" android:tag="O"             style="@style/alphabetTextView" />         <TextView android:id="@+id/P" android:text="P" android:tag="P"             style="@style/alphabetTextView" />         <TextView android:id="@+id/Q" android:text="Q" android:tag="Q"             style="@style/alphabetTextView" />         <TextView android:id="@+id/R" android:text="R" android:tag="R"             style="@style/alphabetTextView" />         <TextView android:id="@+id/S" android:text="S" android:tag="S"             style="@style/alphabetTextView" />         <TextView android:id="@+id/T" android:text="T" android:tag="T"             style="@style/alphabetTextView" />         <TextView android:id="@+id/U" android:text="U" android:tag="U"             style="@style/alphabetTextView" />         <TextView android:id="@+id/V" android:text="V" android:tag="V"             style="@style/alphabetTextView" />         <TextView android:id="@+id/W" android:text="W" android:tag="W"             style="@style/alphabetTextView" />         <TextView android:id="@+id/X" android:text="X" android:tag="X"             style="@style/alphabetTextView" />         <TextView android:id="@+id/Y" android:text="Y" android:tag="Y"             style="@style/alphabetTextView" />         <TextView android:id="@+id/Z" android:text="Z" android:tag="Z"             style="@style/alphabetTextView" />      </LinearLayout> </RelativeLayout> 

Java

@Override public void onClick(View v) {     String firstLetter = (String) v.getTag();     int index = 0;     if (stringList != null) {         for (String string : stringList) {             if (string.startsWith(firstLetter)) {                 index = stringList.indexOf(string);                 break;             }         }     }     lv.setSelectionFromTop(index, 0); } 
like image 614
Sephy Avatar asked Nov 19 '11 07:11

Sephy


People also ask

How do I put contacts into alphabets?

If some of the alphabet letters are missing when using our fast scroll bar, scroll the bar from the top all the way to the bottom -- exit Contacts+ -- enter your phone's settings -- apps -- Contacts+ -- force stop -- enter Contacts+ again and the issue should be resolved.

Does ListView have scroll?

10 Answers. Show activity on this post. Never put ListView in ScrollView . ListView itself is scrollable.

What is scrollbar Android?

In Android, a ScrollView is a view group that is used to make vertically scrollable views. A scroll view contains a single direct child only. In order to place multiple views in the scroll view, one needs to make a view group(like LinearLayout) as a direct child and then we can define many views inside it.


1 Answers

This is an iPhone feature, Android uses fast scroll. I'd recommend that you use the platform alternative rather than try to enforce common functionality.

If you must, you'll have to implement this yourself. Put your list view in a RelativeLayout and put A-Z TextViews in a vertical LinearLayout that is set to layout_alignParentRight="true". Set the TextView's tag to A-Z appropiately and set onClick="quickScroll" on all of them.

Implement in your Activity:

public void quickScroll(View v) {     String alphabet = (String)v.getTag();     //find the index of the separator row view     list.setSelectionFromTop(index, 0); } 

This will scroll to the selected letter onClick, but I believe you can scroll your finger over the alphabet on iPhone and it'll update the list? You'll have to implement an onTouchListener rather than onClickListener for that.

like image 198
FunkTheMonk Avatar answered Sep 21 '22 05:09

FunkTheMonk