Нативная разработка мобильных приложений

П
оиск
 
в
 
сети
Взаимодействия с конечной точкой поисковой системы в Android и в iOS реа-
лизуются практически одинаково. Для этого нужно выполнить следующие 
шаги:
1) ввести искомую фразу в поле ввода;
2) отправить введенную строку сетевой службе поиска;
3) получить ответ, содержащий результаты поиска;

---

Поиск в сети 

343
4) вывести результаты на экран, например в представление списка или таб-
лицы.
Итак, сначала мы должны добавить в пользовательский интерфейс что-то, 
что запустит процесс поиска. В Android, поскольку отказались от использова
-
ния панели 
ActionBar
, добавим в верхнюю часть 
BrowseContentAc ti vi ty
компонент 
SearchView
. После ввода строки и активизации компонента (щелчком на кнопке 
или нажатием клавиши 
Enter
) отправим введенную строку веб-службе, а за
-
тем, в случае успеха, откроем новый экран (
Ac ti vi ty
) и отобразим в нем полу
-
ченные результаты.
Давайте изменим макет 
res/layout/activity_browse.xml
и добавим в него 
Search­
View
:

xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
android:id="@+id/search_locations"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#FFFFFFFF" />
android:id="@+id/browse_content_recyclerview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFFFFFFF" />

Теперь добавим новые возможности в существующий 
Ac ti vi ty
:
1) добавим новое представление 
SearchView
в манифест;
2) отобразим представление 
SearchView
;
3) добавим инструкции журналирования в метод поиска в локальном про
-
екте;
4) исправим значки.
Java
public class BrowseContentAc ti vi ty extends Ac ti vi ty {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_browse);
SearchView searchView = findViewById(R.id.search_locations);
searchView.setOnQueryTextListener(new SearchView.OnQueryTextListener() {
@Override
public boolean onQueryTextSubmit(String query) {
Log.d("MyApp", "searching on " + query);
return false;

---

344

Сетевые операции в приложении
}
@Override
public boolean onQueryTextChange(String newText) {
return false;
}
});
RecyclerView recyclerView = findViewById(R.id.browse_content_recyclerview);
try {
InputStream stream = getAssets().open("catalog.json");
String json = Files.getStringFromStream(stream);
Books source = new Gson().fromJson(json, Books.class);
BrowseBooksAdapter adapter = new BrowseBooksAdapter(source);
Log.d("MyApp", "books = " + adapter.getItemCount());
recyclerView.setAdapter(adapter);
recyclerView.setLayoutManager(new LinearLayoutManager(this));
} catch (IOException e) {
Log.d("MyApp", "Oops! Something went wrong trying to read our catalog json");
e.printStackTrace();
}
}
}
Kotlin
class BrowseContentAc ti vi ty : Ac ti vi ty() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_browse)
search_locations.setOnQueryTextListener(object : SearchView.OnQueryTextListener {
override fun onQueryTextSubmit(query: String): Boolean {
Log.d("MyApp", "searching on $query")
return false
}
override fun onQueryTextChange(newText: String): Boolean {
return false
}
})
try {
val stream = assets.open("catalog.json")
val json = Files.getStringFromStream(stream)
val books = Gson().fromJson(json, Books::class.java)
Log.d("MyApp", "${books.size}, ${books[0].title}")
browse_content_recyclerview.adapter = BrowseBooksAdapter(books)
browse_content_recyclerview.layoutManager = LinearLayoutManager(this)
} catch (e: IOException) {
Log.d("MyApp", "Oops! Something went wrong trying to read our catalog json")
e.printStackTrace()
}
}
}

---

Поиск в сети 

345
В iOS мы добавим кнопку поиска в верхнюю часть экрана отображения ката
-
лога и реализуем обработчик события щелчка на кнопке, который отображает 
UISearchController
с 
UISearchBar
для ввода искомой строки, которую отправим 
конечной точке службы поиска.
А теперь перейдем к пользовательскому интерфейсу для отображения ре
-
зультатов!
Android
Подготовим простой макет и 
Ac ti vi ty
для отображения результатов поиска:

xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFFFFFFF">
android:id="@+id/search_results_recyclerview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="gone"
android:background="#FFFFFFFF" />
android:id="@+id/search_progress"
android:indeterminate="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center" />

Этот интерфейс обеспечит вывод вращающегося индикатора, чтобы пока
-
зать пользователю, что приложение занято и ожидает получения результатов 
от сервера.
Наш экземпляр 
Ac 
ti vi ty
ожидает получить строку из 
SearchView
для отправки 
веб-службе поиска и действует в зависимости от ситуации.
Давайте сделаем некоторые предположения. Допустим, что URL веб-службы 
имеет вид 
magic://my.app/search
(мы используем схему magic://, чтобы не забыть 
потом изменить URL, – большинство клиентов Java HTTP отвергают эту схему 
и возвращают дружественное описание ошибки) и включает параметр запроса 
GET с именем 
query
. В ответ веб-служба возвращает документ JSON с массивом 
объектов 
Location
или пустой массив, если поиск не дал результатов.
Допустим также, что документ JSON выглядит примерно так:
[
{
"street_address": "123 Eiffel Tower Street",
"city": "Paris",
"country": "France",

---

346

Сетевые операции в приложении
"emoji": "
",
"hours": "8am–7pm"
},
{
"street_address": "86 Libery Boulevard",
"city": "New York",
"country": "America",
"emoji": "
",
"hours": "6am–10pm"
}
]
Соответствующая структура данных выглядит так:
Java
public class Location {
@SerializedName("street_address")
private String mStreetAddress;
@SerializedName("city")
private String mCity;
@SerializedName("country")
private String mCountry;
@SerializedName("emoji")
private String mEmoji;
@SerializedName("hours")
private String mHours;
public String getStreetAddress() {
return mStreetAddress;
}
public void setStreetAddress(String streetAddress) {
mStreetAddress = streetAddress;
}
public String getCity() {
return mCity;
}
public void setCity(String city) {
mCity = city;
}
public String getCountry() {
return mCountry;
}
public void setCountry(String country) {
mCountry = country;
}
public String getEmoji() {
return mEmoji;
}

---

Поиск в сети 

347
public void setEmoji(String emoji) {
mEmoji = emoji;
}
public String getHours() {
return mHours;
}
public void setHours(String hours) {
mHours = hours;
}
}
Kotlin
data class Location(
var streetAddress: String,
var city: String,
var country: String,
var emoji: String,
var hours: String
)
Теперь у нас есть макет, модель и общая стратегия. Осталось только реализо
-
вать логику в коде. Этим мы займемся в следующем разделе.
iOS
В iOS мы используем немного иной, но очень похожий подход. Обычно для за
-
пуска поиска в iOS добавляют кнопку на панель навигации. Откройте 
Main.sto-
ryboard
и выберите сцену приветствия. Из панели