AutoCompleteTextView - Android Widgets Example |
AutoCompleteTextView - Android Widgets สำหรับ AutoCompleteTextView เป็น Widget ที่จะช่วยให้การกรอกหรือ Input ข้อมูลของผู้ใช้นั้นสะดวกยิ่งขึ้น โดยเมื่อผู้ใช้กรอกข้อมูลหรือข้อความลงไปใน Input Text ก็จะแสดงรายการที่เกี่ยวข้องเพื่อให้ผู้ใช้ได้เลือกรายการนั้น ๆ
XML Syntax
<AutoCompleteTextView
android:id="@+id/autoCompleteTextView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:completionThreshold="1">
Example 1 การใช้ AutoCompleteTextView กับ String ที่เป็น Array
ออกแบบหน้าจอ GraphicalLayout ด้วย Widget ตามรูป
activity_main.xml (XML 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" >
<Button
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="135dp"
android:text="Button" />
<AutoCompleteTextView
android:id="@+id/autoCompleteTextView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="40dp"
android:ems="10"
android:completionThreshold="1"
android:text="" >
<requestFocus />
</AutoCompleteTextView>
</RelativeLayout>
MainActivity.java (Java Code)
package com.myapp;
import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.view.View;
import android.widget.AutoCompleteTextView;
import android.widget.Button;
import android.widget.Toast;
import android.widget.ArrayAdapter;
public class MainActivity extends Activity {
private static final String[] COUNTRIES = new String[] {
"Belgium", "France", "Italy", "Germany", "Spain", "Thailand", "Taiwan"
};
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// autoCompleteTextView1
final AutoCompleteTextView autocomplete1 = (AutoCompleteTextView)findViewById(R.id.autoCompleteTextView1);
ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
android.R.layout.simple_dropdown_item_1line, COUNTRIES);
autocomplete1.setAdapter(adapter);
// button1
final Button btn1 = (Button)findViewById(R.id.button1);
btn1.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
Toast.makeText(MainActivity.this,
String.valueOf("Your Input : " + autocomplete1.getText().toString()),
Toast.LENGTH_SHORT).show();
}
});
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.activity_main, menu);
return true;
}
}
Screenshot
แสดงการทำงานของ Auto Complete เมื่อพิมพ์ข้อมูลลงใน Keyboard และผู้ใช้สามารถเลือกรายการที่แสดงนั้น ๆ ได้
ตัวอย่างการอ่านค่าจาก EditText และแสดงผลที่ makeText
Example 2 การใช้ AutoCompleteTextView กับ Event ต่าง ๆ ของ AutoCompleteTextView
MainActivity.java (Java Code)
package com.myapp;
import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.view.View;
import android.widget.AutoCompleteTextView;
import android.widget.Button;
import android.widget.Toast;
import android.widget.ArrayAdapter;
import android.text.TextWatcher;
import android.text.Editable;
public class MainActivity extends Activity {
private static final String[] COUNTRIES = new String[] {
"Belgium", "France", "Italy", "Germany", "Spain", "Thailand", "Taiwan"
};
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// autoCompleteTextView1
final AutoCompleteTextView autocomplete1 = (AutoCompleteTextView)findViewById(R.id.autoCompleteTextView1);
ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
android.R.layout.simple_dropdown_item_1line, COUNTRIES);
autocomplete1.setAdapter(adapter);
autocomplete1.addTextChangedListener(new TextWatcher() {
public void afterTextChanged(Editable s) {
// TODO Auto-generated method stub
Toast.makeText(MainActivity.this,
String.valueOf("afterTextChanged : " + s.toString()),
Toast.LENGTH_SHORT).show();
}
public void beforeTextChanged(CharSequence s, int start, int count, int after) {
// TODO Auto-generated method stub
Toast.makeText(MainActivity.this,
String.valueOf("beforeTextChanged : " + s.toString()),
Toast.LENGTH_SHORT).show();
}
public void onTextChanged(CharSequence s, int start, int before, int count) {
// TODO Auto-generated method stub
Toast.makeText(MainActivity.this,
String.valueOf("onTextChanged : " + s.toString()),
Toast.LENGTH_SHORT).show();
}
});
// button1
final Button btn1 = (Button)findViewById(R.id.button1);
btn1.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
Toast.makeText(MainActivity.this,
String.valueOf("Your Input : " + autocomplete1.getText().toString()),
Toast.LENGTH_SHORT).show();
}
});
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.activity_main, menu);
return true;
}
}
Screenshot
จะเห็นว่าในขณะที่กำลังเลือก Auto Complete จะมีเหตุการณ์ต่าง ๆ เกิดขึ้น
Example 3 การใช้ AutoCompleteTextView กับ ข้อมูลที่เป็น Array ที่อยู่ในไฟล์ strings.xml (/res/values/strings.xml)
โครงสร้างของไฟล์ strings.xml
ที่อยู่ของไฟล์ strings.xml
strings.xml
<resources>
<string name="app_name">MyApp</string>
<string name="hello_world">Hello world!</string>
<string name="menu_settings">Settings</string>
<string name="title_activity_main">My App V 1.0</string>
<string-array name="country_array">
<item>Belgium</item>
<item>France</item>
<item>Italy</item>
<item>Germany</item>
<item>Spain</item>
<item>Thailand</item>
<item>Taiwan</item>
</string-array>
</resources>
MainActivity.java (Java Code)
package com.myapp;
import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.view.View;
import android.widget.AutoCompleteTextView;
import android.widget.Button;
import android.widget.Toast;
import android.widget.ArrayAdapter;
import android.text.TextWatcher;
import android.text.Editable;
public class MainActivity extends Activity {
private static final String[] COUNTRIES = new String[] {
"Belgium", "France", "Italy", "Germany", "Spain", "Thailand", "Taiwan"
};
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// autoCompleteTextView1
final AutoCompleteTextView autocomplete1 = (AutoCompleteTextView)findViewById(R.id.autoCompleteTextView1);
ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
android.R.layout.simple_dropdown_item_1line, COUNTRIES);
autocomplete1.setAdapter(adapter);
autocomplete1.addTextChangedListener(new TextWatcher() {
public void afterTextChanged(Editable s) {
// TODO Auto-generated method stub
Toast.makeText(MainActivity.this,
String.valueOf("afterTextChanged : " + s.toString()),
Toast.LENGTH_SHORT).show();
}
public void beforeTextChanged(CharSequence s, int start, int count, int after) {
// TODO Auto-generated method stub
Toast.makeText(MainActivity.this,
String.valueOf("beforeTextChanged : " + s.toString()),
Toast.LENGTH_SHORT).show();
}
public void onTextChanged(CharSequence s, int start, int before, int count) {
// TODO Auto-generated method stub
Toast.makeText(MainActivity.this,
String.valueOf("onTextChanged : " + s.toString()),
Toast.LENGTH_SHORT).show();
}
});
// button1
final Button btn1 = (Button)findViewById(R.id.button1);
btn1.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
Toast.makeText(MainActivity.this,
String.valueOf("Your Input : " + autocomplete1.getText().toString()),
Toast.LENGTH_SHORT).show();
}
});
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.activity_main, menu);
return true;
}
}
Screenshot
รายการที่ได้จาก Array ที่มาจาก strings.xml
Example 4 การใช้ AutoCompleteTextView กับ ArrayList
MainActivity.java (Java Code)
package com.myapp;
import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.view.View;
import android.widget.AutoCompleteTextView;
import android.widget.Button;
import android.widget.Toast;
import android.widget.ArrayAdapter;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends Activity {
List<String> arrList = new ArrayList<String>();
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// autoCompleteTextView1
final AutoCompleteTextView autocomplete1 = (AutoCompleteTextView)findViewById(R.id.autoCompleteTextView1);
arrList.add("Belgium");
arrList.add("France");
arrList.add("Italy");
arrList.add("Germany");
arrList.add("Spain");
arrList.add("Thailand");
arrList.add("Taiwan");
ArrayAdapter<String> adapter = new ArrayAdapter<String>(MainActivity.this,
android.R.layout.simple_spinner_item,
arrList);
autocomplete1.setAdapter(adapter);
// button1
final Button btn1 = (Button)findViewById(R.id.button1);
btn1.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
Toast.makeText(MainActivity.this,
String.valueOf("Your Input : " + autocomplete1.getText().toString()),
Toast.LENGTH_SHORT).show();
}
});
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.activity_main, menu);
return true;
}
}
Screenshot
รายการที่ได้จาก Array ที่มาจาก ArrayList
Property & Method (Others Related) |
|
ช่วยกันสนับสนุนรักษาเว็บไซต์ความรู้แห่งนี้ไว้ด้วยการสนับสนุน Source Code 2.0 ของทีมงานไทยครีเอท
|
|
|
By : |
ThaiCreate.Com Team (บทความเป็นลิขสิทธิ์ของเว็บไทยครีเอทห้ามนำเผยแพร่ ณ เว็บไซต์อื่น ๆ) |
|
Score Rating : |
|
|
|
Create/Update Date : |
2012-07-01 16:04:40 /
2012-07-07 17:00:43 |
|
Download : |
No files |
|
Sponsored Links / Related |
|
|
|
|
|
|
|