Android UI組件之自定義控件實現IP地址控件

　　趁着時間挺充裕，就多寫幾篇博客。每一篇都是學習中的教訓。今天在做東西的時候突然想到之前在MFC的時候都會有一個IP地址控件，可能是PC端用的比較多，但是在移動端好像基本沒什么用處，但是偶爾也會有項目要用到，畢竟還是有些項目不需要接入互聯網，只需要接入企業的內部網絡。這個時候為了程序的通用性，我想到的第一個就是在程序中去配置一個網絡環境，並將它保存到本地中，這樣以后程序每次加載直接去本地中獲取值。既然沒有已有的控件，那么久自定義好了。存儲在本地首先想到的就是sqlite和SharedPreferences，很明顯這么點小東西還是用SharedPreferences又快又方便。那么按照老套路，先來規划一下程序的流程。

　　既然要實現IP地址控件，那么首先就要考慮平常使用的習慣，通常我們輸入IP地址，可以通過"."進入下一個編輯區域，也可以通過鼠標來直接跳到下一個區域，同時IP地址對數值的大小也有要求。必須是0-255之間。有了這個考慮就大概知道要處理什么事件。接下來就是開始實現。

　　自定義IP地址控件ipedittext.xml，這里采用了四個EditText加三個TextView來實現控件。通過android:layout_weight屬性讓四個控件均勻的排列。

<?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:layout_marginTop="10dp" 
    android:layout_marginLeft="10dp"
    android:layout_marginRight="10dp"
    android:paddingTop="10dp"
    android:paddingBottom="10dp"
    android:orientation="horizontal"
    android:background="@drawable/record_list_file_bg" >
    <EditText
        android:id="@+id/firstIPfield"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:gravity="center"
        android:inputType="numberDecimal"
        />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="."/>
    <EditText
        android:id="@+id/secondIPfield"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:gravity="center"
        android:inputType="numberDecimal"
        />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="."/>
    <EditText
        android:id="@+id/thirdIPfield"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:gravity="center"
        android:inputType="numberDecimal"
        />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="."/>
    <EditText
        android:id="@+id/fourthIPfield"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:gravity="center"
        android:inputType="numberDecimal"
        />

</LinearLayout>

　　有了自定義的控件，接着就是實現自定義控件類IPEditText.java。

import android.content.Context;
import android.text.Editable;
import android.text.TextUtils;
import android.text.TextWatcher;
import android.util.AttributeSet;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.EditText;
import android.widget.LinearLayout;
import android.widget.Toast;

public class IPEditText extends LinearLayout {
    private EditText firstIPEdit;
    private EditText secondIPEdit;
    private EditText thirdIPEdit;
    private EditText fourthIPEdit;
    
    private String firstIP;
    private String secondIP;
    private String thirdIP;
    private String fourthIP;
    
    public IPEditText(Context context, AttributeSet attrs) {
        super(context, attrs);
        // TODO Auto-generated constructor stub
        View view = LayoutInflater.from(context).inflate(R.layout.ipedittext, this);
        
        firstIPEdit = (EditText) view.findViewById(R.id.firstIPfield);
        secondIPEdit = (EditText) view.findViewById(R.id.secondIPfield);
        thirdIPEdit = (EditText) view.findViewById(R.id.thirdIPfield);
        fourthIPEdit = (EditText) view.findViewById(R.id.fourthIPfield);
        
        setIPEditTextListener(context);
    }
    
    public void setIPEditTextListener(final Context context){
        //設置第一個字段的事件監聽
        firstIPEdit.addTextChangedListener(new TextWatcher() {
            @Override
            public void onTextChanged(CharSequence s, int start, int before, int count) {
                // TODO Auto-generated method stub
                Log.i("test",s.toString());
                if(null!=s && s.length()>0){
                    if(s.length() > 2 || s.toString().trim().contains(".")){
                        if(s.toString().trim().contains(".")){
                            firstIP = s.toString().trim().substring(0,s.length()-1);
                        }else{
                            firstIP = s.toString().trim();
                        }
                        if (Integer.parseInt(firstIP) > 255) {
                            Toast.makeText(context, "IP大小在0-255之間",
                                    Toast.LENGTH_LONG).show();
                            return;
                        }
                        secondIPEdit.setFocusable(true);
                        secondIPEdit.requestFocus();
                    }
                    else
                    {
                        firstIP = s.toString().trim();
                    }
                }
            }
            @Override
            public void beforeTextChanged(CharSequence s, int start, int count,
                    int after) {
                // TODO Auto-generated method stub
            }
            @Override
            public void afterTextChanged(Editable s) {
                // TODO Auto-generated method stub
                firstIPEdit.removeTextChangedListener(this);
                firstIPEdit.setText(firstIP);
                firstIPEdit.setSelection(firstIP.length());
                firstIPEdit.addTextChangedListener(this);
            }
        });
        //設置第二個IP字段的事件監聽
        secondIPEdit.addTextChangedListener(new TextWatcher() {
            @Override
            public void onTextChanged(CharSequence s, int start, int before, int count) {
                // TODO Auto-generated method stub
                if(null!=s && s.length()>0){
                    if(s.length() > 2 || s.toString().trim().contains(".")){
                        if(s.toString().trim().contains(".")){
                            secondIP = s.toString().trim().substring(0,s.length()-1);
                            
                        }else{
                            secondIP = s.toString().trim();
                        }
                        if (Integer.parseInt(secondIP) > 255) {
                            Toast.makeText(context, "IP大小在0-255之間",
                                    Toast.LENGTH_LONG).show();
                            return;
                        }
                        thirdIPEdit.setFocusable(true);
                        thirdIPEdit.requestFocus();
                    }
                    else
                    {
                        secondIP = s.toString().trim();
                    }
                    
                }
            }    
            @Override
            public void beforeTextChanged(CharSequence s, int start, int count,
                    int after) {
                // TODO Auto-generated method stub
                
            }

            @Override
            public void afterTextChanged(Editable s) {
                // TODO Auto-generated method stub
                secondIPEdit.removeTextChangedListener(this);
                secondIPEdit.setText(secondIP);
                secondIPEdit.setSelection(secondIP.length());
                secondIPEdit.addTextChangedListener(this);
            }
        });
        //設置第三個IP字段的事件監聽
        thirdIPEdit.addTextChangedListener(new TextWatcher() {
            
            @Override
            public void onTextChanged(CharSequence s, int start, int before, int count) {
                // TODO Auto-generated method stub
            
                if(null!=s && s.length()>0){
                    if(s.length() > 2 || s.toString().trim().contains(".")){
                        if(s.toString().trim().contains(".")){
                            thirdIP = s.toString().trim().substring(0,s.length()-1);
                            
                        }else{
                            thirdIP = s.toString().trim();
                        }
                        if (Integer.parseInt(thirdIP) > 255) {
                            Toast.makeText(context, "IP大小在0-255之間",
                                    Toast.LENGTH_LONG).show();
                            return;
                        }
                        fourthIPEdit.setFocusable(true);
                        fourthIPEdit.requestFocus();
                    }else{
                        thirdIP = s.toString().trim();
                    }
                    
                }
            }
            @Override
            public void beforeTextChanged(CharSequence s, int start, int count,
                    int after) {
                // TODO Auto-generated method stub
                
            }
            
            @Override
            public void afterTextChanged(Editable s) {
                // TODO Auto-generated method stub
                thirdIPEdit.removeTextChangedListener(this);
                thirdIPEdit.setText(thirdIP);
                thirdIPEdit.setSelection(thirdIP.length());
                thirdIPEdit.addTextChangedListener(this);
                
            }
        });
        //設置第四個IP字段的事件監聽
        fourthIPEdit.addTextChangedListener(new TextWatcher() {
            
            @Override
            public void onTextChanged(CharSequence s, int start, int before, int count) {
                // TODO Auto-generated method stub
                if(null!=s && s.length()>0){
                    fourthIP = s.toString().trim();
                    if (Integer.parseInt(fourthIP) > 255) {
                        Toast.makeText(context, "請輸入合法的ip地址", Toast.LENGTH_LONG)
                                .show();
                        return;
                    }
                }
            }
            
            @Override
            public void beforeTextChanged(CharSequence s, int start, int count,
                    int after) {
                // TODO Auto-generated method stub
                
            }
            
            @Override
            public void afterTextChanged(Editable s) {
                // TODO Auto-generated method stub
                
            }
        });
    }
    
    public String getText(Context context) {
        if (TextUtils.isEmpty(firstIP) || TextUtils.isEmpty(secondIP)
                || TextUtils.isEmpty(thirdIP) || TextUtils.isEmpty(fourthIP)) {
            Toast.makeText(context, "請輸入完整的IP", Toast.LENGTH_LONG).show();
        }
        return firstIP + "." + secondIP + "." + thirdIP + "." + fourthIP;
    }
}

　　代碼有點多，那是因為前面三個控件的邏輯比較多，搞定一個另外兩個修改一下就好了，最后一個EditText比較簡單。簡單的說明一下事件處理。通過在EditText上添加addTextChangedListener函數來這是一個監聽器，觀察控件內容的變化。參數是一個TextWatcher接口,實現他的三個方法就能夠對控件內值得變化進行一個處理。

　　對於控件中內容發生變化時，首先我們要判斷新增的字符是不是"."，和長度有沒有超過3位，若果是其中的任意一種，就可以處理值並跳轉到下一個EditText控件。如果都不是，那就可以直接獲取控件的內容並設置顯示。邏輯還是比較簡單的。那么就這么簡單的結束了嗎？肯定不是。

　　貼出來的代碼肯定都是功能完善的代碼，但是最初的代碼肯定不是這樣。對於頭腦比較簡單的我來說，在最初認為，既然EditText中的內容改變了，那我直接獲取改變后的值然后立即通過EditText.setText來設置不就行了嗎？所以最初afterTextChanged()中的firstIPEdit.setText(firstIP);其實是放在onTextChanged()中的。然后就出現了紅色的error和不幸的程序崩潰了。查看了一下logcat日志，報的錯誤是stackoverflow(棧溢出)，發現原來是函數堆棧溢出，進入了一個函數調用的死循環，這里用循環不恰當，准確的說是連鎖調用，導致最終棧溢出，為什么？當一次改動發生后，判斷值是合法有效的，然后調用EditText.setText(),因為setText()會去改變控件的內容，而控件此時正在被TextWatch監視着，於是又進入onTextChanged,然后再一次判斷，再一次合法，再一次設置內容，再一次判斷，於是程序一直向前走，函數堆棧越來越大最終溢出。

　　現在知道是因為什么溢出的就來看看這個TextWatcher,既然能夠通過addTextChangedListener添加一個TextWatcher進行監聽，那么也應該可以remove掉，但是在TextWatcher這個實例的函數中remove它自己能成功嗎？於是再一次去SDK中看看remove函數是怎么工作的。發現removeTextChangedListener和我們想的不太一樣，他並不是在remove的時候就釋放掉那個對象，而只是暫時把他從監視Textview類型(EditText是繼承TextView)的對象中的一個隊列中移除。函數介紹如下:　

public void removeTextChangedListener (TextWatcher watcher)

Added in API level 1
Removes the specified TextWatcher from the list of those whose methods are called whenever this TextView's text changes.

　　於是來嘗試將setText函數移動到afterTextChanged()函數中並加上removeTextChangedListener和addTextChangedListener。程序果然沒有崩掉，但是奇怪的事情發生了。光標居然沒有在后面反倒跑到內容前面，並且值得大小也不是123，而是321，在logcat中也能看出來:

　　　　02-04 12:54:56.861: I/test(573): 1
　　　　02-04 12:54:59.392: I/test(573): 21
　　　　02-04 12:55:01.591: I/test(573): 321

　　那么為什么會這樣呢，原來在有內容的情況下EditText中的光標會在最前面，每一次輸入都是往光標后輸入，這樣就會每輸入一次在光標后添加上字符之后，光標又跑到最前面。在網上搜索一下，發現可以通過EditText.setSelection()函數解決，於是嘗試之，果然奏效。程序正常。

　　接下來就是寫入SharedPreferences中，對於SharedPreferences的操作比較簡單，首先是通過上下文環境去得到一個SharedPreferences文件的對象，然后通過獲取這個對象的editor來對它進行操作。這里為了方便就先把另外兩個參數寫死。因為我的事件監聽的類是單獨寫在一個包里的，所以上下文環境需要獲取，如果是在同一個類里的話就不用我這么麻煩。記住一定要commit。

case R.id.config:
            mAvtivity = MainActivity.get();
            Context context = mAvtivity;
            SharedPreferences sp = context.getSharedPreferences("config", Context.MODE_PRIVATE);
            Editor editor = sp.edit();
            editor.putString("server_ip", mAvtivity.getmIPEditText().getText(mAvtivity).toString());
            editor.putInt("server_port", 8080);
            editor.putBoolean("isserver", true);
            editor.commit();

　　結果如下圖，成功保存，這樣程序以后只需要在網絡處理的類中去讀取IP就可以了，端口和網站地址同上。

　　最后一句話，保存的SharedPreferences文件本質上是一個XML文件，在/data/data/PACKAGE_NAME/shared_prefs/下，可以通過DDMS中的快捷功能把它從模擬器中拖出來。

　　今天就到這吧。該去鍛煉了。也祝大家都能有個好身體。