Android UI编程之自定义控件初步(下)——CustomEditText
生活随笔
收集整理的這篇文章主要介紹了
Android UI编程之自定义控件初步(下)——CustomEditText
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
概述:
? ? 基于對上一篇博客《Android UI編程之自定義控件初步(上)——ImageButton》的學習,我們對自定義控件也有了一個初步的認識。那現在我們可以再試著對EditText進行一些自定義的學習。以下有兩種方式的自定義UI編程分享給大家。由于在上一篇博客中,有對自定義控件的一些詳細地說明,在本篇博客中,如果你還有一些沒搞懂的地方,可以參見上一篇博客《Android UI編程之自定義控件初步(上)——ImageButton》進行學習。
示例:帶刪除按鈕的輸入框
效果圖展示:
?
基本雛形搭建:
? ? 大家可以從上面的效果圖上看到兩個東西:左側的EditText和右側的圖片(這里是一個Button)。我們在EditText中的輸入為空的時候,不顯示右側的清除按鈕。一旦EditText中輸入了內容的時候,右側的清除按鈕就會顯示出來。
外觀設計和功能添加:
1.外觀設計
在我們選好了骨架之后,剩下的就是穿衣服了。現在我們來看看怎么給它穿衣服。以下是示例代碼:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"android:orientation="horizontal" ><EditTextandroid:id="@+id/input_edittext"android:layout_width="match_parent"android:layout_height="wrap_content"android:layout_centerVertical="true"android:layout_marginLeft="10dp"android:layout_marginTop="5dp"android:layout_marginBottom="5dp"android:background="@null"android:layout_toLeftOf="@+id/clear_button"android:ems="10" ></EditText><Buttonandroid:id="@+id/clear_button"android:layout_width="30dp"android:layout_height="30dp"android:layout_centerVertical="true"android:background="@drawable/clear_button"android:layout_marginRight="10dp"android:layout_alignParentRight="true"android:visibility="invisible" /></RelativeLayout>
2.功能添加
功能的添加是要在Java代碼中去實現的,因為Java代碼可以動態去調節功能,而在xml代碼中卻寫不出動態調節功能的效果。Java代碼中實現各功能如下:
監聽文本框功能:
public void addTextChangedListener() {mInput.addTextChangedListener(new TextWatcher() {@Overridepublic void onTextChanged(CharSequence s, int start, int before, int count) {int len = mInput.getText().toString().length();if (len > 0) {mClear.setVisibility(View.VISIBLE);} else {mClear.setVisibility(View.INVISIBLE);}}@Overridepublic void beforeTextChanged(CharSequence s, int start, int count,int after) {}@Overridepublic void afterTextChanged(Editable s) {}});}
清除文本功能:
private void setClearEvent() {mClear.setOnClickListener(new OnClickListener() {@Overridepublic void onClick(View v) {mInput.setText("");}});}
使用分析:
1.xml代碼中的使用
代碼如下:
<com.demo.customview.clearedittext.widgets.ClearEditTextandroid:id="@+id/activity_main_clear_edittext"android:layout_width="fill_parent"android:layout_height="wrap_content"android:layout_marginTop="10dp" />
2.Java代碼中的使用
ClearEditText clearEditText = (ClearEditText) findViewById(R.id.activity_main_clear_edittext); clearEditText.setHint("輸入文本進行測試"); clearEditText.addTextChangedListener();
示例:在EditText插入表情
效果圖展示:
自定義類實現:
這邊就不去長篇累牘介紹了。因為內容很單。Java實現代碼如下:
public class SmiliesEditText extends EditText {public SmiliesEditText(Context context) {super(context);}public SmiliesEditText(Context context, AttributeSet attrs) {super(context, attrs);}@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);}@Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {super.onMeasure(widthMeasureSpec, heightMeasureSpec);}public void insertIcon(int id) {// SpannableString連續的字符串,長度不可變,同時可以附加一些object;可變的話使用SpannableStringBuilder,參考sdk文檔SpannableString ss = new SpannableString(getText().toString() + "[smile]");// 得到要顯示圖片的資源Drawable d = getResources().getDrawable(id);// 設置高度d.setBounds(0, 0, d.getIntrinsicWidth(), d.getIntrinsicHeight());// 跨度底部應與周圍文本的基線對齊ImageSpan span = new ImageSpan(d, ImageSpan.ALIGN_BASELINE);// 附加圖片ss.setSpan(span, getText().length(),getText().length() + "[smile]".length(),Spannable.SPAN_INCLUSIVE_EXCLUSIVE);setText(ss);} }
使用分析:
1.xml代碼中的使用
<com.demo.customview.clearedittext.widgets.SmiliesEditTextandroid:id="@+id/activity_main_similies_edittext"android:layout_width="fill_parent"android:layout_height="wrap_content"android:layout_below="@+id/activity_main_clear_edittext"android:singleLine="true"android:text="Hello smile"android:hint="你可以輸入表情哦"android:textSize="14sp"android:layout_marginTop="20dp" />
2.Java代碼中的使用
SmiliesEditText et=(SmiliesEditText)findViewById(R.id.activity_main_similies_edittext);et.insertIcon(R.drawable.smile);System.out.println(et.getText().toString());
源代碼下載:
http://download.csdn.net/detail/u013761665/8410583
總結
以上是生活随笔為你收集整理的Android UI编程之自定义控件初步(下)——CustomEditText的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: Android UI编程之自定义控件初步
- 下一篇: Android挂载以点号(.)开头的文件