AutoCompleteTextView 和 Google Places 显示在 ListView 中,就像 Uber 一样 [英] AutoCompleteTextView with Google Places shown in ListView just like Uber

查看:19
本文介绍了AutoCompleteTextView 和 Google Places 显示在 ListView 中,就像 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

谷歌示例项目链接

推荐答案

您可以通过使用 EditTextListView 而不是 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:

这是您的布局文件(带有 ListViewEditText )

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屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆