AutoCompleteTextView 和 Google Places 显示在 ListView 中,就像 Uber 一样 [英] AutoCompleteTextView with Google Places shown in ListView just like Uber
问题描述
我需要制作与此类似的屏幕.我认为它有 autocompletetextview 和 listview 来显示返回的结果.此处使用 Google Place API 来自动建议地点,并相应地更新列表视图适配器.请任何形式的帮助表示赞赏.提前致谢.
I need to make screen similar to this. I think it has autocompletetextview and listview to display returned results. Google Place API is used here to auto suggest places and listview adapter is updated accordingly. Please any kind of help is appreciated. Thanks in advance.
也在 AutoComplete 上检查了 android 示例项目的位置.但它没有任何列表视图来显示结果.相反,它在 autocompletetextview 微调器中显示结果.我们可以对该项目进行的任何修改
Checked android sample project on AutoComplete for places too. But it is not having any listview to display results. Instead it shows results in autocompletetextview spinner. Any modification we can do with that project
推荐答案
您可以通过使用 EditText
和 ListView
而不是 AutoCompleteTextView代码>.在
EditText
中输入字符,根据这些字符通过调用GooglePlacesAutomplete
网络服务过滤ListView
中的结果.代码如下:
You can achieve this exactly by using EditText
and ListView
, and not AutoCompleteTextView
. Characters are entered in the EditText
on the basis of which the results in the ListView
are filtered by calling the GooglePlacesAutomplete
webservice. The following is the code:
这是您的布局文件(带有 ListView
的 EditText
)
This is your layoout file ( EditText
with ListView
)
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffffff"
tools:context="com.example.siddarthshikhar.liftsharesample.EnterLocationActivity">
<EditText
android:paddingLeft="@dimen/activity_horizontal_margin"
android:layout_width="250dp"
android:layout_height="35dp"
android:textColorHint="#ffffff"
android:id="@+id/edEnterLocation"
android:textColor="#ffffff"
android:textSize="@dimen/abc_text_size_medium_material"
android:layout_alignParentLeft="true"
android:backgroundTint="#00000000"
android:gravity="start|center">
<requestFocus />
</EditText>
<ListView android:id="@+id/listView1" android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/filterLayout"/>
</RelativeLayout>
在您相应的 Activity 中,访问此 EditText 并应用 Filterable.为此,您必须使用 GooglePlacesAutompleteAdapter
.
In your corresponding Activity, access this EditText and apply Filterable. You have to use GooglePlacesAutompleteAdapter
for this.
以下是 GooglePlacesAutompleteAdapter
:
public class GooglePlacesAutocompleteAdapter extends ArrayAdapter implements Filterable {
private static final String LOG_TAG = "Google Places Autocomplete";
private static final String PLACES_API_BASE = "https://maps.googleapis.com/maps/api/place";
private static final String TYPE_AUTOCOMPLETE = "/autocomplete";
private static final String OUT_JSON = "/json";
private static final String API_KEY = "your_api_key";
private ArrayList<String> resultList;
private Context context = null;
public GooglePlacesAutocompleteAdapter(Context context, int textViewResourceId) {
super(context, textViewResourceId);
this.context = context;
}
@Override
public int getCount() {
if(resultList != null)
return resultList.size();
else
return 0;
}
@Override
public String getItem(int index) {
return resultList.get(index);
}
public ArrayList<String> autocomplete(String input) {
ArrayList<String> resultList = null;
ArrayList<String> descriptionList = null;
HttpURLConnection conn = null;
StringBuilder jsonResults = new StringBuilder();
try {
StringBuilder sb = new StringBuilder(PLACES_API_BASE + TYPE_AUTOCOMPLETE + OUT_JSON);
sb.append("?key=" + API_KEY);
sb.append("&components=country:in");
sb.append("&input=" + URLEncoder.encode(input, "utf8"));
URL url = new URL(sb.toString());
conn = (HttpURLConnection) url.openConnection();
InputStreamReader in = new InputStreamReader(conn.getInputStream());
// Load the results into a StringBuilder
int read;
char[] buff = new char[1024];
while ((read = in.read(buff)) != -1) {
jsonResults.append(buff, 0, read);
}
} catch (MalformedURLException e) {
Log.e(LOG_TAG, "Error processing Places API URL", e);
return resultList;
} catch (IOException e) {
Log.e(LOG_TAG, "Error connecting to Places API", e);
return resultList;
} finally {
if (conn != null) {
conn.disconnect();
}
}
try {
// Create a JSON object hierarchy from the results
Log.d("yo",jsonResults.toString());
JSONObject jsonObj = new JSONObject(jsonResults.toString());
JSONArray predsJsonArray = jsonObj.getJSONArray("predictions");
// Extract the Place descriptions from the results
resultList = new ArrayList(predsJsonArray.length());
descriptionList = new ArrayList(predsJsonArray.length());
for (int i = 0; i < predsJsonArray.length(); i++) {
resultList.add(predsJsonArray.getJSONObject(i).toString());
descriptionList.add(predsJsonArray.getJSONObject(i).getString("description"));
}
saveArray(resultList.toArray(new String[resultList.size()]), "predictionsArray", getContext());
} catch (JSONException e) {
Log.e(LOG_TAG, "Cannot process JSON results", e);
}
return descriptionList;
}
@Override
public Filter getFilter() {
Filter filter = new Filter() {
@Override
protected FilterResults performFiltering(CharSequence constraint) {
FilterResults filterResults = new FilterResults();
if (constraint != null) {
// Retrieve the autocomplete results.
resultList = autocomplete(constraint.toString());
// Assign the data to the FilterResults
filterResults.values = resultList;
filterResults.count = resultList.size();
}
return filterResults;
}
@Override
protected void publishResults(CharSequence constraint, FilterResults results) {
if (results != null && results.count > 0) {
setImageVisibility();
notifyDataSetChanged();
} else {
notifyDataSetInvalidated();
}
}
};
return filter;
}
}
访问适配器并将getFilter()
应用到相应Activity
中的EditText
.以下是要添加到与您之前创建的布局相对应的 Activity 中:
Access the adapter and apply getFilter()
to the EditText
in the corresponding Activity
. The following is to be added in your Activity corresponding to your layout created earlier:
dataAdapter = new GooglePlacesAutocompleteAdapter(EnterLocationActivity.this, R.layout.adapter_google_places_autocomplete){
listView = (ListView) findViewById(R.id.listView1);
// Assign adapter to ListView
listView.setAdapter(dataAdapter);
//enables filtering for the contents of the given ListView
listView.setTextFilterEnabled(true);
etEnterLocation.addTextChangedListener(new TextWatcher() {
public void afterTextChanged(Editable s) {
}
public void beforeTextChanged(CharSequence s, int start, int count, int after) {
}
public void onTextChanged(CharSequence s, int start, int before, int count) {
dataAdapter.getFilter().filter(s.toString());
}
});
这应该能让你继续前进.您可以根据需要修改布局.这基本上是在 ListView
中加载自动完成数据.
This should get you going. You can modify your layout as you want. This basically loads the autocomplete data in a ListView
.
这篇关于AutoCompleteTextView 和 Google Places 显示在 ListView 中,就像 Uber 一样的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!