Android Imitation micro-letter contact Letter Sorting effect _android

Source: Internet
Author: User

Examples of this article for you to share the Android contact letter sorting code for your reference, the specific content as follows

To realize the idea: first of all, the layout, the whole is a relative layout, the bottom is a listview,listview above is a custom view (the right display letter), the top is a textview (screen in the middle of the box).

First of all, say the right custom view, the letter is drawn to view above, first calculate the height of the view, and then divided by the length of the array of letters to get the height of each character, each letter is the same width, so here directly set 30sp;

ListView shows the names of 108 Liangshan heroes;

The project uses a Pinyin4j.jar to convert each name to pinyin, and then use Charat (0) to obtain the first letter of Pinyin;

Each item of ListView is a linear layout of two TextView, the TV above shows the first letter of pinyin, the TV below shows the name, and the adapter determines whether the current entry and previous entry have the same phonetic initials. If the same TV is hidden above the current item;

Then set a custom listener on the custom view, and when you click on the custom view, judge the letter by the height, and then set the position ListView to jump according to the letter;

First look at the layout:

<relativelayout xmlns:android= "http://schemas.android.com/apk/res/android" xmlns:tools= "http:// Schemas.android.com/tools "android:layout_width=" match_parent "android:layout_height=" match_parent "> <Li 
    Stview android:id= "@+id/listview" android:layout_width= "match_parent" android:layout_height= "Match_parent" Android:cachecolorhint= "@android: Color/transparent" > </ListView> <com.wxcontacts.www.view.quicki 
    Ndexbar android:id= "@+id/quickindexbar" android:layout_width= "30DP" android:layout_height= "Match_parent" Android:layout_alignparentright= "true"/> <!--default hide, displays--> <textview and when you click Custom View Roid:visibility= "Gone" android:id= "@+id/tv_hint" android:gravity= "center" android:layout_centerinparent= "tr UE "Android:layout_width=" 60DP "android:layout_height=" 60DP "android:background=" @drawable/bg_text "an droid:text= "A" android:textsize= "24SP"/> </RelativeLayout> 
 

Don't worry about looking at the Mainactivity code First look at the code for the Custom view:

Custom View public class Quickindexbar extends view{//brushes private Paint Paint; String[] lettres={"↑", "A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", " 
 
  W "," X "," Y "," Z "," ↓ "}; 
  Custom view's wide-high private int viewhight; 
  private int viewwidth; 
 
  The height of each text (the text height equals the view height divided by the number of text) private int cellheight; 
 
  The height of the text is private float textHeight; 
 
  private int currentindex=-1; 
   
  Public Onletterchangelisten Onletterchangelisten; 
  Public Onletterchangelisten Getonletterchangelisten () {return onletterchangelisten; } public void Setonletterchangelistener (Onletterchangelisten onletterchangelisten) {This.onletterchangelis 
  Ten=onletterchangelisten; 
    }//Custom one-letter-changed listener public interface onletterchangelisten{void Onletterchange (String letters); 
  void Onresert (); 
  {This (context,null) is public quickindexbar; Public Quickindexbar, AttribUteset attrs) {This (context, attrs,0); 
    Public Quickindexbar (context, AttributeSet attrs, int defstyle) {Super (context, attrs, Defstyle); 
    Paint=new paint (); 
    Sets the font color; the default is black; we use Black//paint.setcolor (color.white) here; 
    Set Font size paint.settextsize (20); 
    Anti-aliasing Paint.setantialias (true); 
    Gets the font width height, because each font width is different, so the width must be put in the loop to do//first get the properties of the font fontmetrics fontmetrics = Paint.getfontmetrics (); 
  Lower boundary-upper boundary textHeight = (float) math.ceil (fontmetrics.descent-fontmetrics.ascent); 
    } @Override protected void OnDraw (Canvas Canvas) {Super.ondraw (Canvas); 
    Gets the width//Gettextwh () of the text; 
     
    The height of each text; cellheight=viewhight/lettres.length; 
       
      Draw the letters through loops for (int x=0;x<lettres.length;x++) {String text=lettres[x]; 
      Paint gives us a way to measure the width of a font float textWidth = paint.measuretext (text); if (currentindex==x) {///when clicking on a letter Paint.setcolor color.GRAY); 
      }else{Paint.setcolor (Color.Black); /* * Parameter 1: The content parameter 23 to draw: Position parameter 4: Brush * Parameter 23 The position of the picture refers to the lower left corner coordinates of the letter */CANVAS.DRAWT 
    Ext (text,viewwidth/2-textwidth/2,cellheight/2+textheight/2+cellheight*x,paint); The width of the view is @Override protected void onsizechanged (int w, int h, int oldw, int oldh) {Supe 
    R.onsizechanged (W, H, OLDW, OLDH); 
    Viewhight =getmeasuredheight (); 
  Viewwidth =getmeasuredwidth (); @Override public boolean ontouchevent (Motionevent event) {switch (event.getaction ()) {case M Otionevent.action_down://Calculate the current click of the letter, width does not consider, because the width is the same, calculate the height, depending on the height of your click or move to calculate what you are currently clicking on the letter float Downy=event.get 
      Y (); 
      Currentindex = (int) downy/cellheight; 
          if (currentindex<0 | | currentindex>lettres.length-1) {}else{if (onletterchangelisten!=null) { 
       Onletterchangelisten.onletterchange (Lettres[currentindex]); }//Redraw, equivalent to OnDraw () method invalidate (); 
    Break 
      Case MotionEvent.ACTION_MOVE:float movey=event.gety (); 
      Currentindex = (int) movey/cellheight; 
          if (currentindex<0 | | currentindex>lettres.length-1) {}else{if (onletterchangelisten!=null) { 
        Onletterchangelisten.onletterchange (Lettres[currentindex]); 
      }//Redraw invalidate (); 
    Break 
      Case Motionevent.action_up:currentindex=-1; 
      if (onletterchangelisten!=null) {Onletterchangelisten.onresert (); 
 
    } break; 
    Default:break; 
  return true; 
 } 
 
}

Now I've got a picture for you to calculate the XY coordinates of the letters:


Finally, the Mainactivity code:

public class Mainactivity extends activity {private Com.wxcontacts.www.view.QuickIndexBar Quickindexbar; 
  Private ListView Mlistview; 
   
  When clicked the custom view the screen displays a square in the middle, displays the current click the letter, the default is hidden, when clicks only then displays the private TextView tvhint; 
  Private list 

SOURCE Download: Http://xiazai.jb51.net/201611/yuanma/AndroidWXcontact (jb51.net). rar

The above is the entire content of this article, I hope to help you learn, but also hope that we support the cloud habitat community.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.