Picasso android studio kotlin

Picasso

Как известно, знаменитый художник Пабло Пикассо любил котов. Есть фотография, подтверждающая его любовь.

Художник нарисовал несколько картин с котом. Одна из них.

А также есть библиотека Picasso, предназначенная для асинхронной подгрузки изображений котов из сети, ресурсов или файловой системы, их кэширования и отображения.

Официальная страница библиотеки от авторов, где можно найти ссылки на документацию и примеры.

В Android Studio прописываем зависимость в Gradle (проверяйте номер свежей версии).

Сейчас на сайте есть новая версия с новым пакетом implementation ‘com.squareup.picasso:picasso:2.71828’, которая является промежуточным вариантом для перехода на ветку 3.х. При этом некоторые вызовы методов изменились. Будьте внимательны. Смотрите новую статью с примерами на Kotlin.

Вот как просто загрузить картинку из сети:

Вы указываете адрес картинки (url), заглушку (placeholder), заглушку для ошибки после трёх неудачных попыток загрузки (error) и в методе into() указываете компонент ImageView, в который загружаете изображение.

При загрузке картинка кэшируется и при повторном запросе на скачивание библиотека может достать картинку из кэша, а не скачивать из интернета, что ускоряет работу приложения. Если кэш будет переполнен или удалён пользователем, то картина снова скачается из сети. Очень удобно.

Если вы храните большие картинки в ресурсах или на внешнем накопителе, то рекомендуется использовать отдельный процесс для загрузки. Библиотека уже настроена на работу в асинхронном режиме, поэтому вы можете использовать её и в этих случаях.

Не забывайте про метод библиотеки fit(), который уменьшает размер картинки перед размещением в ImageView. Это полезно для экономии ресурсов, если вам в реальности нужна маленькая картинка, а не оригинал.

Трансформация

У библиотеки есть специальный метод transform() для манипуляций с изображениями. Вам нужно создать собственную реализацию и передать её в метод. Например, на сайте разработчика приведён пример кадрирования изображения, когда создаётся квадратная картинка по наименьшей стороне.

Сначала создаётся отдельный класс с интерфейсом Transformation, который требует реализовать два метода transform() и key().

Для наглядности разместим два компонента ImageView и посмотрим на результат после нажатия на кнопку.

Другой пример трансформации — перекраска изображения. В Android 5.0 появилась возможность перекрашивать значки встроенными средствами. Для старых устройств можно воспользоваться библиотекой (взято отсюда). Создадим новый класс:

Пробуем на этой же картинке.

Круглый аватар

Ещё один пример, позволяющий создавать круглые картинки, которые можно использовать в качестве аватаров.

Разместим на экране ImageView и зададим размер аватара 150 пикселей.

Если задать нулевой радиус, то будут использоваться размеры картинки для вычисления нужных размеров.

Техника, используемая в примере, не совсем эффективна. Для подобных целей рекомендуется использовать шейдеры. Переписанный пример класса.

В этом примере используется пустой конструктор без параметров, который равносилен значению 0 из предыдущего примера. Вы можете доработать пример, добавив возможность указания радиуса, как это реализовано в том примере.

Новые возможности

В статье описаны новые возможности для версии 2.4.

Появилась возможность встроить собственные обработчики запросов, если у вас используется нестандартная схема вместо http, res и т.п.

Появилась возможность управления приоритетами при запросах, чтобы скачать какое-то изображение раньше других.

Чтобы протестировать библиотеку в боевых условиях, я написал приложение Коты Василия Ложкина. Результатом доволен.

Источник

Picasso

A powerful image downloading and caching library for Android

Introduction

Images add much-needed context and visual flair to Android applications. Picasso allows for hassle-free image loading in your application—often in one line of code!

Many common pitfalls of image loading on Android are handled automatically by Picasso:

• Handling ImageView recycling and download cancelation in an adapter.
• Complex image transformations with minimal memory use.
• Automatic memory and disk caching.

Features

Adapter Downloads

Adapter re-use is automatically detected and the previous download canceled.

Image Transformations

Transform images to better fit into layouts and to reduce memory size.

You can also specify custom transformations for more advanced effects.

Pass an instance of this class to the transform method.

Place Holders

Picasso supports both download and error placeholders as optional features.

A request will be retried three times before the error placeholder is shown.

Resource Loading

Resources, assets, files, content providers are all supported as image sources.

Debug Indicators

For development you can enable the display of a colored ribbon which indicates the image source. Call setIndicatorsEnabled(true) on the Picasso instance.

Download

The source code to the Picasso, its samples, and this website is available on GitHub.

Maven

Gradle

Contributing

If you would like to contribute code you can do so through GitHub by forking the repository and sending a pull request.

When submitting code, please make every effort to follow existing conventions and style in order to keep the code as readable as possible. Please also make sure your code compiles by running mvn clean verify .

Before your code can be accepted into the project you must also sign the Individual Contributor License Agreement (CLA).

Источник

Код приложения для Android-приложений с Picasso

Russian (Pусский) translation by Dima (you can also view the original English article)

Picasso — популярная библиотека Android с открытым исходным кодом для загрузки как локальных, так и удаленных изображений. Узнайте, как легко использовать его для обработки потребностей загрузки изображений.

1. Что такое Picasso?

Picasso (имя, вдохновленное известным французским художником Пабло Пикассо) — очень популярная библиотека Android с открытым исходным кодом для загрузки изображений в приложение для Android. Согласно официальным документам, в нем говорится:

. Picasso позволяет без проблем загружать изображения в вашем приложении — часто в одной строке кода!

Обратите внимание, что Picasso использует OkHttp (сетевую библиотеку от одного и того же разработчика) под капотом для загрузки изображений через Интернет.

2. Итак, зачем использовать Пикассо?

Теперь вы узнали, что такое Пикассо, следующий вопрос, который вы можете задать, — зачем его использовать?

Разработка собственных функций загрузки и отображения мультимедиа в Java или Kotlin может быть сложной: вы должны заботиться о кешировании, декодировании, управлении сетевыми соединениями, потоковой обработке, обработке исключений и многом другом. Picasso — это простой в использовании, хорошо спланированный, хорошо документированный,и тщательно протестированная библиотека, которая может сэкономить вам много драгоценного времени — и избавит вас от некоторых головных болей.

Вот некоторые из распространенных ошибок при загрузке изображений на Android, которые рассматриваются вами Пикассо, согласно официальным документам:

• Обработка изображений ImageView и загрузка в адаптере
• сложные преобразования изображений с минимальным использованием памяти
• автоматическая память и кэширование дисков

Добавление изображений в приложение может привести к оживлению вашего приложения Android. Итак, в этом уроке мы узнаем о Picasso 2, создав приложение простой галереи изображений. Он загрузит изображения через Интернет и отобразит их как миниатюры в RecyclerView, а когда пользователь нажмет на изображение, он откроет детальную активность, содержащую большее изображение.

Хорошие художники копируют, великие художники крадут. — Пабло Пикассо

3. Предпосылки

Чтобы иметь возможность следовать этому руководству, вам понадобятся:

• базовое понимание основных API Android и Kotlin
• Android Studio 3.1.1 или выше
• Плагин Kotlin 1.2.30 или новее

Запустите Android Studio и создайте новый проект (вы можете назвать его PicassoDemo ) с пустым действием MainActivity . Обязательно также установите флажок Включить поддержку Kotlin.

4. Объявлять зависимости

После создания нового проекта укажите следующие зависимости в файле build.gradle. На момент написания последней версии Picasso была 2.71828 .

Убедитесь, что вы синхронизируете свой проект после добавления Picasso и артефактов RecyclerView v7.

5. Добавить разрешение Интернета

Поскольку Picasso собирается выполнить сетевой запрос для загрузки изображений через Интернет, мы должны включить разрешение INTERNET в наш AndroidManifest.xml.

Так что сделай это сейчас!

Обратите внимание, что это необходимо, только если вы собираетесь загружать изображения из Интернета. Это не требуется, если вы загружаете изображения только локально на устройство.

6. Создайте макет

Мы начнем с создания нашего RecyclerView внутри файла макета activity_main.xml.

Создание макета настраиваемого элемента

Затем давайте создадим XML-макет (item_image.xml), который будет использоваться для каждого элемента ( ImageView ) в RecyclerView .

Теперь, когда мы создали макеты, необходимые для нашего простого приложения для галереи, следующим шагом является создание адаптера RecyclerView для заполнения данных. Прежде чем мы это сделаем, давайте создадим нашу простую модель данных.

7. Создание модели данных

Мы собираемся определить простую модель данных для нашего RecyclerView . Эта модель реализует Parcelable для высокопроизводительной передачи данных с одного компонента на другой в Android. В нашем случае данные будут перенесены из SunsetGalleryActivity в SunsetPhotoActivity .

Обратите внимание, что эта модель SunsetPhoto имеет только одно поле, называемое url (для демонстрационных целей), но вы можете иметь больше, если хотите. Этот класс реализует Parcelable , что означает, что мы должны переопределить некоторые методы.

Мы можем использовать Android Studio IDEA для создания этих методов для нас, но недостатком этого является поддержание. Как? Каждый раз, когда мы добавляем какие-либо новые поля в этот класс, мы можем забыть явно обновить методы constructor и writeToParcel , что может привести к некоторым ошибкам, если мы не обновим методы.

Теперь, чтобы обойти обновление или запись этих шаблонных методов, Kotlin 1.1.14 ввел аннотацию @Parcelize . Эта аннотация поможет нам создать методы writeToParcel , writeFromParcel и describeContents автоматически под капотом для нас.

Теперь наш класс SunsetPhoto — это всего лишь две строки! Потрясающие!

Не забудьте добавить следующий код в модуль приложения build.gradle :

Кроме того, я включил объект-компаньон (или статический метод в Java) getSunsetPhotos() в классе модели SunsetPhoto , который будет просто возвращать ArrayList из SunsetPhoto при вызове.

8. Создайте адаптер

Мы создадим адаптер для заполнения нашего RecyclerView данными. Мы также реализуем прослушиватель кликов, чтобы открыть детальную активность — SunsetPhotoActivity — передать экземпляр SunsetPhoto в качестве дополнительной цели. Детальная активность покажет крупный план изображения. Мы создадим его в следующем разделе.

Обратите внимание, что мы использовали функцию расширения apply , чтобы поместить объект в дополнение к намерению. Напомним, что функция apply возвращает объект, переданный ему как аргумент (т. е. Объект-получатель).

9. Загрузка изображений с URL-адреса

Нам нужно, чтобы Пикассо выполнял свою работу в этом разделе, а не рисовал нам произведение искусства, а получал изображения из Интернета и показывал их. Мы будем отображать эти изображения индивидуально в своих соответствующих ImageViews внутри нашего метода RecyclerView onBindViewHolder() , когда пользователь прокручивает приложение.

Шаг за шагом, вот как работают звонки в Picasso :

Метод get()

Это возвращает глобальный экземпляр Picasso (экземпляр singleton), инициализированный следующими конфигурациями по умолчанию:

• Кэш LRU составляет 15% доступной оперативной памяти.
• Кэш дискового пространства объемом 2% до 50 МБ, но не менее 5 МБ. Примечание: это доступно только для API 14+.
• Три загружаемых потока для доступа к диску и сети.

Обратите внимание: если эти параметры не соответствуют требованиям вашего приложения, вы можете создать собственный экземпляр Picasso с полным контролем этих конфигураций с помощью Picasso.Builder .

Наконец, вы вызываете метод build() , чтобы вернуть вам экземпляр Picasso с вашими собственными конфигурациями.

Рекомендуется сделать это в приложении Application.onCreate , а затем установить в качестве экземпляра singleton с Picasso.setSingletonInstance в этом методе — убедиться, что экземпляр Picasso является глобальным.

Метод load()

load (String path) запускает запрос изображения с использованием указанного пути. Этот путь может быть удаленным URL, файловым ресурсом, ресурсом контента или ресурсом Android.

• placeholder(int placeholderResId) : идентификатор ресурса локального локатора или способный к использованию, когда изображение загружается, а затем отображается. Он служит хорошим пользовательским интерфейсом для отображения изображения-заполнителя во время загрузки изображения.

Обратите внимание, что Picasso сначала проверяет, находится ли запрошенное изображение в кеше памяти, и если оно есть, оно отображает изображение оттуда (в более позднем разделе мы рассмотрим кэширование в Picasso).

Другие методы

• error(int errorResId) : можно использовать, если запрошенное изображение не может быть загружено, возможно, потому, что веб-сайт не работает.
• noFade() : Picasso всегда исчезает в изображении, которое будет отображаться в ImageView . Если вы не хотите эту анимацию с постепенным увеличением, просто вызовите метод noFade() .
• into(ImageView imageView) : изображение целевого изображения, в которое будет помещено изображение.

Изменение размера и трансформация изображения

Если сервер, на который вы запрашиваете изображение, не дает вам изображения требуемого размера, вы можете легко изменить его размер с помощью resize(int targetWidth, int targetHeight) . Вызов этого метода изменяет размер изображения, а затем отображает его на ImageView . Обратите внимание, что размеры указаны в пикселях (px), а не в dp.

Вы можете передать ресурс размера Android для ширины и высоты, используя метод resizeDimen (int targetWidthResId, int targetHeightResId) . Этот метод преобразует размер изображения в необработанные пиксели, а затем вызывает resize() внутри — передавая преобразованные размеры (в пикселях) в качестве аргументов.

Обратите внимание, что эти методы изменения размера не будут учитывать соотношение сторон. Другими словами, соотношение сторон изображения может быть искажено.

К счастью, Picasso дает нам некоторые полезные методы для решения этой проблемы:

• centerCrop() : равномерно масштабирует изображение (сохраняя соотношение сторон изображения), чтобы изображение заполнило данную область на сколько это возможно. При необходимости изображение будет обрезано горизонтально или вертикально, чтобы сохранить соотношение сторон. Вызов этого метода обрезает изображение внутри границ, заданных параметром resize() .
• centerInside() : масштабирует изображение так, чтобы оба измерения были равны или меньше запрошенных границ. Это будет центрировать изображение внутри границ, заданных параметром resize() .
• onlyScaleDown() : изменение размера изображения только в том случае, если размер оригинального изображения больше заданного размера, указанного в параметре resize() .
• fit() : попытайтесь изменить размер изображения, чтобы оно точно соответствовало целевым рамкам ImageView .

Вращение изображения

Picasso имеет простой API для поворота изображения, а затем отображение этого изображения. Метод rotate (float degrees) поворачивает изображение на указанные градусы.

В приведенном выше примере это повернет изображение на 90 градусов. Метод rotate (float degrees, float pivotX, float pivotY) вращает изображение по заданным градусам вокруг точки поворота.

Здесь мы будем поворачивать изображение на 30 градусов вокруг точки поворота 200, 100 пикселей.

Преобразование

Помимо простого манипулирования изображением путем его вращения, Picasso также дает нам возможность применить пользовательское преобразование к изображению перед его отображением.

Вы просто создаете класс, который реализует интерфейс Transformation Picasso. Затем вам необходимо переопределить два метода:

• Bitmap transform(Bitmap source) : это преобразует исходное растровое изображение в новое растровое изображение.
• String key() : возвращает уникальный ключ для преобразования, используемый для кеширования.

После того, как вы закончите создание своего настраиваемого преобразования, вы просто выполните его, вызвав transform(Transformation transformation) на свой экземпляр Picasso. Обратите внимание, что вы также можете передать список Transformation для transform() .

Здесь я применил преобразование окружности к изображению из библиотеки Android с открытым исходным кодом Picasso Transformations. Эта библиотека имеет множество преобразований, которые вы можете применить к изображению с помощью Picasso, включая преобразования для размытия или серого масштабирования изображения.Проверьте сами, хотите ли вы применить некоторые интересные преобразования к своим изображениям.

10. Инициализация адаптера

Здесь мы просто создаем наш RecyclerView с GridLayoutManager в качестве менеджера компоновки, инициализируем наш адаптер и привязываем его к RecyclerView .

11. Создание детальной активности

Создайте новое действие и назовите его SunsetPhotoActivity . Мы получаем дополнительную версию SunsetPhoto и загружаем изображение внутри onStart() — с Picasso, как и раньше.

Детальный макет

Вот макет для отображения деталей активности. Он просто отображает ImageView , который покажет версию загруженного изображения с полным разрешением.

12. Кэширующий механизм в Picasso

Если вы внимательно наблюдаете, вы заметите, что когда вы пересматриваете ранее загруженное изображение, оно загружается даже быстрее, чем раньше. Что сделало это быстрее? Это механизм кэширования Picasso.

Вот что происходит внутри. После загрузки изображения из Интернета Picasso будет кэшировать его как в памяти, так и на диске, сохраняя повторяющиеся сетевые запросы и позволяя быстрее извлекать изображение. Когда это изображение понадобится снова, Picasso сначала проверит, доступно ли изображение в памяти, и если оно есть, он немедленно вернет его. Если это изображение отсутствует в памяти, Picasso проверит следующий диск, и если он там, он вернет его. Если его там нет, Picasso, наконец, выполнит сетевой запрос для этого изображения и отобразит его.

В общем, вот что происходит (внутри) для запроса изображения: память -> диск -> сеть.

Однако в зависимости от вашего приложения вы можете избежать кэширования — например, если отображаемые изображения могут часто меняться и не перезагружаться.

Итак, как отключить кэширование?

Вы можете избежать кэширования памяти, вызвав memoryPolicy(MemoryPolicy.NO_CACHE) . Это просто пропустит поиск кэша памяти при обработке запроса изображения.

Обратите внимание, что есть еще одно перечисление: MemoryPolicy.NO_STORE . Это полезно, если вы очень уверены, что один раз запросите изображение. Применение этого также не сохраняет изображение в кэше памяти, тем самым не вызывая другие растровые изображения из кеша памяти.

Но имейте в виду, что изображение все равно будет кэшироваться на диске — для предотвращения этого также вы используете networkPolicy(@NonNull NetworkPolicy policy, @NonNull NetworkPolicy. additional) , которая принимает одно или несколько из следующих значений перечисления:

• NetworkPolicy.NO_CACHE : пропускает проверку кэша диска и заставляет загружать через сеть.
• NetworkPolicy.NO_STORE : пропускает сохранение результата в кэш диска.
• NetworkPolicy.OFFLINE : принудительно запрашивает запрос только через кэш диска, пропуская сеть.

Чтобы избежать как кэширования памяти, так и всего диска, просто вызовите оба метода один за другим:

13. Запросить слушателей

В Picasso вы можете реализовать прослушиватель или обратный вызов для контроля состояния запроса, который вы сделали при загрузке изображения. Только один из этих методов будет вызываться, если вы реализуете интерфейс Target в запросе.

• void onBitmapFailed(e: Exception ?, errorDrawable: Drawable?) : срабатывает всякий раз, когда изображение не может быть успешно загружено. Здесь мы можем получить доступ к исключению, которое было выбрано.
• void onBitmapLoaded(Bitmap bitmap, LoadedFrom from) : запускается всякий раз, когда изображение было успешно загружено. Здесь мы получаем Bitmap, чтобы показать пользователя.
• void onPrepareLoad(Drawable placeHolderDrawable) : вызывается непосредственно перед отправкой вашего запроса.

Здесь вы также можете показать, а затем скрыть диалог прогресса, если он у вас есть.

Существует еще один прослушиватель обратной связи, который вы можете реализовать, называется Callback . Этот интерфейс имеет только два метода: onSuccess() и onError(Exception e) . Первый вызывается, когда загрузка запроса изображения прошла успешно, а затем вызывается при возникновении ошибки при обработке запроса.

Возвращаясь к нашему приложению галереи изображений (inside SunsetPhotoActivity) , немного изменим отображение используя Callback , который установит растровое изображение в ImageView , а также изменит цвет фона макета, извлекая темный и яркий цвет нашего изображения используя Android Palette API.

Поэтому включите артефакт палитры в build.gradle вашего модуля приложения:

Давайте теперь реализуем интерфейс Callback в нашем запросе Picasso.

14. Тестирование приложения

Наконец, вы можете запустить приложение! Нажмите на миниатюру, чтобы получить полноразмерную версию изображения.

15. Приоритизация запросов

Если вы хотите одновременно загружать разные изображения на одном экране, вы можете выбрать, какой из них более важен. Другими словами, вы можете сначала загрузить важные изображения.

Вы просто вызываете priority() на свой экземпляр запроса Picasso и передаете в любом из перечислений: Priority.LOW , Priority.NORMAL или Priority.HIGH .

16. Запросы на маркировку

Помечая ваши запросы Picasso, вы можете возобновлять, приостанавливать или отменить запросы, связанные с определенными тегами. В зависимости от вашего варианта использования вы можете пометить свои запросы строкой или объектами, которые должны определять область запроса как Context , Activity или Fragment . Вы можете легко пометить запрос Picasso, вызвав tag(@NonNull Object tag) на одном. Передайте ему экземпляр Object , который служит тегом.

Ниже приведены следующие операции, которые вы можете выполнить с помощью тегов Picasso :

• pauseTag(Object tag) : приостановить все запросы, связанные с данным тегом.
• resumeTag(Object tag) : возобновить приостановленные запросы с заданным тегом.
• cancelTag(Object tag) : отменить любые существующие запросы с заданным тегом.

Хотя пометка ваших запросов дает вам некоторый контроль, вы должны быть очень осторожны при использовании тегов из-за потенциальной утечки памяти. Вот что говорится в официальной документации:

Picasso будет хранить ссылку на тег до тех пор, пока этот тег будет приостановлен и / или будет иметь активные запросы. Следите за потенциальными утечками.

Загрузка из файловой системы

Загружать изображения локально в ваше приложение.

Заключение

Хорошая работа! В этом учебном пособии вы создали полное приложение галереи изображений с Picasso также вы узнали, как работает библиотека, и как вы можете интегрировать его в свой собственный проект.

Вы также узнали, как отображать как локальные, так и удаленные изображения, запросы тегов, приоритеты запросов и способы применения преобразований изображений, например изменение размера. А также видели, как легко включать и отключать кэширование, обработку ошибок и пользовательские запросы.

Чтобы узнать больше о Picasso, вы можете обратиться к официальной документации. Чтобы узнать больше о кодировании для Android, ознакомьтесь с некоторыми нашими другими курсами и учебниками на Envato Tuts +!

Источник