Загрузка изображений асинхронно в Android ListView
1. Введение
Поскольку мобильные устройства ограничены с памятью, мы должны следовать некоторые рекомендации для обеспечения наилучшей производительности и удобство работы пользователей. Среди множества наилучшей практики один держит, что приоритетом является принять долго работает тяжелых операций вне основного потока.
Любые долго выполняющиеся задачи или тяжелых операций обычно выполняется в другом потоке, чтобы убедиться, что ваш основной поток выполняет минимальный объем работ. Примером типичного долго выполняющихся задач может быть сетевых операций, чтение файлов формы памяти, анимация и т.д.
В этом учебнике мы создадим простое ListView в Android, который выполняет асинхронную загрузку данных из Интернета с помощью AsyncTask. Как вы можете видеть на скриншоте ниже, ListView содержит эскизы изображений на каждой строке, мы будет загружать изображения асинхронно форме сервера.
Если вы ищете асинхронную загрузку данных с сервера, мы рекомендуем вам прочитать через Android сети учебник.
2. что такое Android AsyncTask
AsyncTask позволяет реализовывать многопоточность без получить ваши руки грязные в нити. AsyncTask является простым в использовании, и это позволяет выполнение фоновой операции в выделенном потоке и передачи результатов обратно в поток UI. Если вы делаете что-то изолированные связанных с UI, например загрузка данных для представления списка, идти вперед и использовать AsyncTask. Ниже приведены некоторые из основных характеристик AsyncTask
Асинхронная задача определяется 3 универсальных типов, называется Params, прогресс и результат и 4 шага, называется onPreExecute и onPostExecute, doInBackground, onProgressUpdate.
В onPreExecute можно определить код, который необходимо выполнить перед фоновой обработки начинается.
Метод doInBackground() содержит код, который должен выполняться в фоновом режиме, здесь в doInBackground мы можем отправить результаты на несколько раз, чтобы поток событий методом publishProgress(), чтобы уведомить завершения фоновой обработки мы может просто возвращать результаты.
Метод onProgressUpdate() получает обновления хода выполнения из метода doInBackground, который публикуется через метод publishProgress, и этот метод может использовать этот прогресс обновление для обновления потока событий
Метод onPostExecute() обрабатывает результаты, возвращаемые методом doInBackground.
Если задачи async, не с помощью любых типов, то оно может быть помечено как тип Void.
Выполняющаяся задача async может быть отменено, вызвав метод cancel().
Универсальные типы, используемые в AsyncTask
Params, тип параметров, отправленных в задачи после выполнения
Прогресс, тип единиц прогресс опубликованы во время вычисления фона.
Результат, тип результата вычисления фона.
3. Загрузка изображения с помощью AsyncTask
Мы научились основам AsyncTask. Препятствуйте нам Взгляните на как использовать его практически для асинхронной загрузки изображения с веб. Для достижения этой цели давайте создавать новый класс и назовите его как ImageDownloaderTask.
В следующем фрагменте кода ожидает URL-адрес изображения, как параметр и инициировать загрузку образа загрузки запроса. Когда загрузка закончится, он отображает растровое изображение на просмотр изображения.
4. Загрузка изображения с веб-
Обратите внимание, что на предыдущем шаге мы вызов метода downloadBitmap(), но не объявил еще. Давайте создадим объявить метод downloadBitmap, который заботится о загрузки изображения и возвращение растрового изображения. Здесь мы используем HttpURLConnection для загрузки потока из заданных url. Узнайте больше о HttpURLConnection от нашего android сети учебник.
5. Создание пользовательских ListView
Теперь, когда мы понимаем основы AsyncTask, давайте приступим с создания настраиваемого списка представления в android. В центре внимания этого учебника пытались загрузки изображения. Если вы не знакомы с создания настраиваемого списка в android, вы можете прочитать наш учебник Android ListView.
5.1. Добавление ListView деятельности макет
Для простоты нашей деятельности макет содержит простое ListView, который охватывает общая доступная ширина и высота устройства. Создайте новый файл activity_main.xml в каталоге макета.
5.2. Создание списка Просмотр активности
Давайте теперь создать новый класс деятельность MainActivity.java в каталоге src проекта и вставьте следующий код. Мы завершим эту деятельность в разделе 3.5
public class MainActivity extends Activity {5.3. Создание списка строк макета
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
}
Теперь давайте сосредоточиться на структуру для строки элемента списка. Как вы можете заметить, образуют на скриншоте выше, мы будем использовать RelativeLayout для создания простого списка строк. Крит новый файл list_row_layout.xml в каталоге макета и вставьте следующие блоки кода.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:minHeight="50dp"
android:padding="8dp">
<ImageView
android:id="@+id/thumbImage"
android:layout_width="70dp"
android:layout_height="70dp"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginRight="10dp"
android:background="@drawable/placeholder" />
<TextView
android:id="@+id/title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_toRightOf="@id/thumbImage"
android:minLines="2"
android:paddingTop="5dp"
android:textStyle="bold" />
<TextView
android:id="@+id/reporter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/title"
android:layout_marginTop="5dp"
android:layout_toRightOf="@id/thumbImage" />
<TextView
android:id="@+id/date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="@+id/reporter"
android:layout_alignParentRight="true" />
</RelativeLayout>
5.4. Создание настраиваемого списка адаптер
Адаптер является акты как мост между источником и адаптер представления данных например, ListView и GridView. Адаптер выполняет итерацию набора данных от начала до конца и создавать представления для каждого элемента в списке.
Создайте новый класс с именем CustomListAdapter и расширить его от BaseAdapter. Посетите здесь, чтобы узнать больше о android адаптеры.
public class CustomListAdapter extends BaseAdapter {
private ArrayList listData;
private LayoutInflater layoutInflater;
public CustomListAdapter(Context context, ArrayList listData) {
this.listData = listData;
layoutInflater = LayoutInflater.from(context);
}
@Override
public int getCount() {
return listData.size();
}
@Override
public Object getItem(int position) {
return listData.get(position);
}
@Override
public long getItemId(int position) {
return position;
}
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder holder;
if (convertView == null) {
convertView = layoutInflater.inflate(R.layout.list_row_layout, null);
holder = new ViewHolder();
holder.headlineView = (TextView) convertView.findViewById(R.id.title);
holder.reporterNameView = (TextView) convertView.findViewById(R.id.reporter);
holder.reportedDateView = (TextView) convertView.findViewById(R.id.date);
holder.imageView = (ImageView) convertView.findViewById(R.id.thumbImage);
convertView.setTag(holder);
} else {
holder = (ViewHolder) convertView.getTag();
}
NewsItem newsItem = (NewsItem) listData.get(position);
holder.headlineView.setText(newsItem.getHeadline());
holder.reporterNameView.setText("By, " + newsItem.getReporterName());
holder.reportedDateView.setText(newsItem.getDate());
if (holder.imageView != null) {
new ImageDownloaderTask(holder.imageView).execute(newsItem.getUrl());
}
return convertView;
}
static class ViewHolder {
TextView headlineView;
TextView reporterNameView;
TextView reportedDateView;
ImageView imageView;
}
}
5.5. Использование адаптера представление списка
Теперь у нас есть список представления и адаптера класс готов. Давайте приступим к завершения класса MainActivity. В следующем фрагменте кода используется для инициализации представления списка и назначьте настраиваемый адаптер.
public class MainActivity extends Activity {
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ArrayList<ListItem> listData = getListData();
final ListView listView = (ListView) findViewById(R.id.custom_list);
listView.setAdapter(new CustomListAdapter(this, listData));
listView.setOnItemClickListener(new OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> a, View v, int position, long id) {
ListItem newsData = (ListItem) listView.getItemAtPosition(position);
Toast.makeText(MainActivity.this, "Selected :" + " " + newsData, Toast.LENGTH_LONG).show();
}
});
}
private ArrayList<ListItem> getListData() {
ArrayList<ListItem> listMockData = new ArrayList<ListItem>();
String[] images = getResources().getStringArray(R.array.images_array);
String[] headlines = getResources().getStringArray(R.array.headline_array);
for (int i = 0; i < images.length; i++) {
ListItem newsData = new ListItem();
newsData.setUrl(images[i]);
newsData.setHeadline(headlines[i]);
newsData.setReporterName("Pankaj Gupta");
newsData.setDate("May 26, 2013, 13:35");
listMockData.add(newsData);
}
return listMockData;
}
Обратите внимание, что метод getListData() в деятельности используется для создания некоторых Макетные списка данных для представления списка. Для простоты в этом примере, мы используем массивов строк, определенный в файле ресурсов strings.xml. Но в реальном времени вы могли бы загрузить данные с сервера или получить его от любых других источников.
Добавьте следующие объявления массива строк в файл string.xml.
.png)

















