Эта серия из двух частей познакомит вас с основами работы с веб-сервисами RESTful с помощью Android SDK. Попутно вы узнаете, как выполнять поиск по общедоступному API Twitter!
Само собой разумеется, что доступ в Интернет является одним из основных ресурсов, которые вы можете использовать на устройствах Android. Многие популярные сайты и социальные сети используют веб-сервисы для предоставления доступа к своим данным, часто используя архитектурные модели, такие как REST (Transfer State State). Twitter является одним из таких сервисов с различными API для доступа к твитам и временным шкалам. В этой серии из двух частей мы будем использовать API поиска в Twitter для получения последних твитов по поисковому запросу, выбранному пользователем.
В этой первой части мы соберем вводимые пользователем данные и создадим URL-адрес для использования в HTTP-запросе к поисковому URL-адресу в Твиттере для твитов на входном термине. Во второй части мы получим результаты, которые будут отформатированы в формате JSON. Мы проанализируем возвращенный канал твита JSON и отобразим его в простом визуальном интерфейсе.
Этот учебный курс по Android Twitter Search состоит из двух частей:
Шаг 1: Создать новый проект и макет
Создайте новый проект в Eclipse: выберите «Файл»> «Создать»> «Проект», затем выберите «Проект приложения Android» и нажмите «Далее». Введите выбранное вами приложение, проект и название пакета. Вы можете оставить минимальный и целевой уровни API по умолчанию выбранными. Выберите выбранные вами параметры конфигурации. На экране «Создать действие» выберите «Пустое действие». На следующем экране введите «TwitterSearchActivity» в качестве имени действия и позвольте Eclipse сгенерировать для вас файл макета («activity_twitter_search» по умолчанию).
После нажатия кнопки «Готово» Eclipse должен открыть новый файл макета.
Откройте файл Manifest для вашего нового проекта и выберите вкладку «AndroidManifest.xml» для редактирования кода. Добавьте следующий элемент в любом месте внутри элемента Manifest, но вне всех остальных элементов:
|
1
|
<uses-permission android:name=»android.permission.INTERNET»/>
|
Это необходимо для любого приложения, имеющего доступ к интернет-ресурсам.
Шаг 2. Создайте пользовательский интерфейс
Давайте теперь создадим элементы пользовательского интерфейса. Снова откройте основной файл макета Activity и выберите вкладку XML для непосредственного редактирования кода. В зависимости от настроек Eclipse у вас должно быть что-то вроде следующего плана:
|
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
|
<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»
tools:context=».TwitterSearchActivity» >
<TextView
android:layout_width=»wrap_content»
android:layout_height=»wrap_content»
android:layout_centerHorizontal=»true»
android:layout_centerVertical=»true»
android:text=»@string/hello_world»
/>
</RelativeLayout>
|
Если у вас есть что-то другое в вашем файле макета, замените его на этот код для начала.
Мы можем оставить относительный макет таким, какой он есть, но заменить существующее текстовое представление другим, немного другим:
|
1
2
3
4
5
6
7
8
|
<TextView
android:id=»@+id/intro_txt»
android:layout_width=»wrap_content»
android:layout_height=»wrap_content»
android:layout_centerHorizontal=»true»
android:textStyle=»italic»
android:text=»@string/intro»
/>
|
Идентификатор предназначен для размещения других предметов, относящихся к этому. Другие свойства предназначены для простой укладки и позиционирования. Откройте файл «res / values / strings.xml» и добавьте строку, на которую мы ссылались выше:
|
1
|
<string name=»intro»>Enter your Twitter search term</string>
|
Это всего лишь информативный текст. Вернувшись в файл макета, после текстового представления добавьте текст редактирования, чтобы зафиксировать поисковый запрос пользователя:
|
01
02
03
04
05
06
07
08
09
10
11
|
<EditText
android:id=»@+id/search_edit»
android:layout_width=»fill_parent»
android:layout_height=»wrap_content»
android:inputType=»text»
android:hint=»@string/hint»
android:layout_below=»@+id/intro_txt»
android:padding=»10dp»
android:background=»#ffff66″
android:layout_margin=»5dp»
/>
|
Мы позиционируем элемент относительно Текстового представления, которое мы уже добавили. Большинство других атрибутов предназначены для стиля; не стесняйтесь вносить в них изменения по своему желанию. Добавьте строку, упомянутую в качестве подсказки, в ваш файл «strings.xml»:
|
1
|
<string name=»hint»>Search Term</string>
|
После редактирования текста добавьте кнопку, чтобы пользователь мог выполнить поиск:
|
01
02
03
04
05
06
07
08
09
10
|
<Button
android:id=»@+id/search_btn»
android:layout_height=»wrap_content»
android:layout_width=»wrap_content»
android:layout_centerHorizontal=»true»
android:text=»@string/search_label»
android:layout_below=»@+id/search_edit»
android:onClick=»searchTwitter»
android:layout_margin=»5dp»
/>
|
Здесь мы снова применяем атрибуты относительного позиционирования и стиля. Мы также указываем метод для выполнения, когда пользователь нажимает кнопку, используя атрибут onClick — мы добавим этот метод в класс Activity позже. Добавьте указанную строку в ваш файл значений:
|
1
|
<string name=»search_label»>Search</string>
|
Далее мы создадим область, в которой будут отображаться полученные твиты. Мы не знаем, как долго будет длиться этот раздел, когда он будет отображаться на экране, поэтому давайте добавим представление прокрутки, чтобы пользователи могли получить доступ ко всему этому — после кнопки:
|
1
2
3
4
5
6
7
|
<ScrollView
xmlns:android=»http://schemas.android.com/apk/res/android»
android:layout_width=»fill_parent»
android:layout_height=»fill_parent»
android:layout_below=»@+id/search_btn»>
</ScrollView>
|
В представлении прокрутки добавьте окончательный вид текста:
|
01
02
03
04
05
06
07
08
09
10
11
12
|
<TextView
android:id=»@+id/tweet_txt»
android:layout_width=»fill_parent»
android:layout_height=»wrap_content»
android:layout_gravity=»top|center»
android:padding=»10dp»
android:background=»#330000″
android:textColor=»#ffffff»
android:layout_margin=»5dp»
android:text=»@string/placeholder»
android:freezesText=»true»
/>
|
Мы будем использовать атрибут ID для идентификации этого текстового представления в Java, когда будем отображать полученные твиты. Помимо свойств макета, мы также указываем, что текст должен зависнуть, чтобы Android не отказывался от него при изменении ориентации. Добавьте последнюю строку в файл значений строк:
|
1
|
<string name=»placeholder»>—</string>
|
Это наш макет завершен. Вы можете, конечно, изменить макет, если хотите, в этих уроках мы сосредоточены на практике получения твита через Интернет. Вот как приложение будет выглядеть, когда вы запустите его позже:
Шаг 3: Подготовьте класс деятельности
Откройте свой основной класс деятельности. Строка открытия вашего объявления класса должна выглядеть следующим образом:
|
1
|
public class TwitterSearchActivity extends Activity {
|
Eclipse также должен был добавить метод onCreate по умолчанию, а также метод меню опций. Ваш метод onCreate должен установить основной файл макета, над которым мы работали, следующим образом:
|
1
|
setContentView(R.layout.activity_twitter_search);
|
Если какой-либо из перечисленных элементов отсутствует в файле класса, созданном Eclipse, обратитесь к папке загрузки, прилагаемой к этому учебному пособию.
Добавьте следующие операторы импорта в ваш класс, заменив все, что Eclipse уже заполнил:
|
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
|
import java.io.BufferedReader;
import java.io.InputStream;
import java.io.InputStreamReader;
import java.net.URLEncoder;
import org.apache.http.HttpEntity;
import org.apache.http.HttpResponse;
import org.apache.http.StatusLine;
import org.apache.http.client.HttpClient;
import org.apache.http.client.methods.HttpGet;
import org.apache.http.impl.client.DefaultHttpClient;
import org.json.JSONArray;
import org.json.JSONObject;
import android.os.AsyncTask;
import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.view.View;
import android.widget.EditText;
import android.widget.TextView;
|
Как видите, у нас есть импорт для обработки HTTP-запросов и ответов, для обработки входящих данных, для анализа данных JSON и для общих компонентов Android.
Внутри вашего объявления класса добавьте переменную экземпляра, чтобы отслеживать текстовое представление, которое мы создали для отображения извлеченных твитов:
|
1
|
private TextView tweetDisplay;
|
Внутри вашего метода onCreate после существующего кода извлеките ссылку на текстовое представление, сохранив ее в переменной:
|
1
|
tweetDisplay = (TextView)findViewById(R.id.tweet_txt);
|
Теперь мы можем ссылаться на этот элемент пользовательского интерфейса во всем классе. Мы сделаем это при отображении выбранной ленты твитов, а также при отображении сообщений об ошибках для пользователя, если что-то пойдет не так.
Шаг 4. Предоставьте метод Click
Помните, что в файле макета мы добавили в Button атрибут onClick, указав метод с именем «searchTwitter» — давайте реализуем этот метод сейчас. Добавьте его в свой класс после существующих методов:
|
1
2
3
|
public void searchTwitter(View view){
}
|
Поскольку мы перечислили его как атрибут onClick , метод получит ссылку на представление, на которое был выполнен щелчок. Нам на самом деле не нужна кнопка, на которую нажали, нам нужно редактировать текстовое представление. Давайте восстановим текст, введенный пользователем, сохранив его в виде строки:
|
1
2
|
EditText searchTxt = (EditText)findViewById(R.id.search_edit);
String searchTerm = searchTxt.getText().toString();
|
Мы используем идентификатор, который мы дали для редактирования текста в файле макета, чтобы идентифицировать его. Теперь, прежде чем мы продолжим, давайте проверим, что пользователь ввел поисковый термин, чтобы предотвратить любую ненужную обработку:
|
1
2
3
4
5
|
if(searchTerm.length()>0){
}
else
tweetDisplay.setText(«Enter a search query!»);
|
Если пользователь ничего не ввел, мы просто выводим сообщение в текстовом представлении твита, к которому у нас есть ссылки по всему классу.
Шаг 5: Подготовьте и закодируйте URL
Обработка, которую мы собираемся добавить далее, может генерировать исключения, поэтому добавьте блоки try и catch внутри оператора if в методе «searchTwitter»:
|
1
2
3
4
5
6
7
|
try{
}
catch(Exception e){
tweetDisplay.setText(«Whoops — something went wrong!»);
e.printStackTrace();
}
|
Если возникает исключение, мы просто выводим сообщение об ошибке, как если бы пользователь не вводил поисковый запрос.
Чтобы использовать API поиска в Твиттере , вы добавляете поисковый запрос в базовый URL-адрес службы. В случае, если пользователь вводит символы, такие как пробелы, мы будем кодировать их текст. Внутри блока try добавьте следующее:
|
1
|
String encodedSearch = URLEncoder.encode(searchTerm, «UTF-8»);
|
Теперь давайте создадим URL API поиска в Twitter. Это общий формат:
|
1
|
http://search.twitter.com/search.json?q=query
|
Текст «запрос» должен быть заменен текстом, который вы ищете. Чтобы встроить пользовательский текст в этот URL, добавьте следующее:
|
1
|
String searchURL = «http://search.twitter.com/search.json?q=»+encodedSearch;
|
Вы можете попробовать загрузить фид твитов JSON в своем веб-браузере, вставив URL-адрес в адресную строку и используя любой поисковый запрос, который вы хотите в конце, например:
|
1
|
http://search.twitter.com/search.json?q=android
|
Ваш браузер должен отображать результаты JSON, которые нелегко читать, но должны дать вам представление о том, что ваше приложение получит при выполнении запроса.
Вывод
Теперь мы готовы выполнить наш поиск в Twitter. В следующем уроке мы создадим класс AsyncTask внутри основного класса Activity. Этот класс будет обрабатывать выборку твита с использованием объектов HTTP-запросов и ответов в фоновом потоке, а затем отображать результаты в пользовательском интерфейсе. Мы будем использовать библиотеки обработки Java JSON для анализа твита и представления его в макете, который мы создали выше.