Android sdk image size

ImageView

Общая информация

Компонент ImageView предназначен для отображения изображений. Находится в разделе Widgets.

Для загрузки изображения в XML-файле используется атрибут android:src, в последнее время чаще используется атрибут app:srcCompat.

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

• setImageResource(int resId) — загружает изображение по идентификатору ресурса
• setImageBitmap(Bitmap bitmap) — загружает растровое изображение
• setImageDrawable(Drawable drawable) — загружает готовое изображение
• setImageURI(Uri uri) — загружает изображение по его URI

Метод setImageResource()

Сначала нужно получить ссылку на ImageView, а затем используется идентификатор изображения из ресурсов:

Метод setImageBitmap()

Используется класс BitmapFactory для чтения ресурса изображения в объект Bitmap, а затем в ImageView указывается полученный Bitmap. Могут быть и другие варианты.

Метод setImageDrawable()

Если у вас есть готовое изображение, например, на SD-карте, то его можно использовать в качестве объекта Drawable.

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

Метод setImageURI()

Берётся URI файла изображения и используется в качестве источника изображения. Этот способ годится для работы с локальными изображениями.

Загружаем Drawable через URI.

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

Также вам часто придется использовать методы, связанные с размерами и масштабированием: setMaxHeight(), setMaxWidth(), getMinimunHeight(), getMinimunWidth(), getScaleType(), setScaleType().

Масштабирование через свойство Scale Type

Для масштабирования картинки в ImageView есть свойство Scale Type и соответствующий ему атрибут android:scaleType и перечисление ImageView.ScaleType.

• CENTER
• CENTER_CROP
• CENTER_INSIDE
• FIT_CENTER
• FIT_START
• FIT_END
• FIT_XY
• MATRIX

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

Для наглядности я задал красный цвет для фона ImageView.

Режим android:scaleType=»center» выводит картинку в центре без масштабирования. Если у вас будет картинка большего размера, то края могут быть обрезаны.

Режим android:scaleType=»centerCrop» также размещает картинку в центре, но учитывает ширину или высоту контейнера. Режим попытается сделать так, чтобы ширина (или высота) картинки совпала с шириной (или высотой) контейнера, а остальное обрезается.

Режим android:scaleType=»centerInside» масштабирует картинку, сохраняя пропорции. Можно увидеть задний фон контейнера, если его размеры отличаются от размера картинки.

Режим android:scaleType=»fitCenter» (по умолчанию) похож на предыдущий, но может не сохранять пропорции.

Если выбрать режим android:scaleType=»fitStart», то картинка прижимается к левому верхнему углу и таким образом заполняет верхнюю половину контейнера.

Значение android:scaleType=»fitEnd» сместит картинку в нижнюю часть контейнера.

Режим android:scaleType=»fitXY» растягивает/сжимает картинку, чтобы подогнать её к контейнеру. Может получиться вытянутая картинка, поэтому будьте осторожны.

Последний атрибут android:scaleType=»matrix» вывел картинку без изменений в левом верхнем углу с обрезанными краями.

Атрибут android:adjustViewBounds=»true»

При использовании атрибута scaleType=»fitCenter» из предыдущего примера Android вычисляет размеры самой картинки, игнорируя размеры ImageView. В этом случае ваша разметка может «поехать». Атрибут adjustViewBounds заставляет картинку подчиниться размеру компонента-контейнера. В некоторых случаях это может не сработать, например, если у ImageView установлен атрибут layout_width=»0dip». В таком случае поместите ImageView в RelativeLayout или FrameLayout и используйте значение 0dip для этих контейнеров.

Загрузка изображения из галереи

Предположим, у вас есть на экране компонент ImageView, и вы хотите загрузить в него какое-нибудь изображение из галереи по нажатию кнопки:

Намерение ACTION_PICK вызывает отображение галереи всех изображений, хранящихся на телефоне, позволяя выбрать одно изображение. При этом возвращается адрес URI, определяющий местоположение выбранного изображения. Для его получения используется метод getData(). Далее для преобразования URI-адреса в соответствующий экземпляр класса Bitmap используется специальный метод Media.getBitmap(). И у нас появляется возможность установить изображение в ImageView при помощи setImageBitmap().

На самом деле можно поступить ещё проще и использовать метод setImageURI.

Сравните с предыдущим примером — чувствуете разницу? Тем не менее, приходится часто наблюдать подобный избыточный код во многих проектах. Это связано с тем, что метод порой кэширует адрес и не происходит изменений. Рекомендуется использовать инструкцию setImageURI(null) для сброса кэша и повторный вызов метода с нужным Uri.

В последних версиях системных эмуляторов два примера не работают. Проверяйте на реальных устройствах.

Получить размеры ImageView — будьте осторожны

У элемента ImageView есть два метода getWidth() и getHeight(), позволяющие получить его ширину и высоту. Но если вы попробуете вызвать указанные методы сразу в методе onCreate(), то они возвратят нулевые значения. Можно добавить кнопку и вызвать данные методы через нажатие, тогда будут получены правильные результаты. Либо использовать другой метод активности, который наступает позже.

Копирование изображений между ImageView

Если вам надо скопировать изображение из одного ImageView в другой, то можно получить объект Drawable через метод getDrawable() и присвоить ему второму компоненту.

Примеры

В моих статьях можно найти примеры использования ImageView.

Источник

Работа с изображениями

Ресурсы изображений

Одним из наиболее распространенных источников ресурсов являются файлы изображений. Android поддерживает следующие форматы файлов: .png (предпочтителен), .jpg (приемлем), .gif (нежелателен). Для графических файлов в проекте уже по умолчанию создана папка res/drawable . По умолчанию она уже содержит ряд файлов — пару файлов иконок:

При добавлении графических файлов в эту папку для каждого из них Android создает ресурс Drawable . После этого мы можем обратиться к ресурсу следующим образом в коде Java:

Например, добавим в проект в папку res/drawable какой-нибудь файл изображения. Для этого скопируем на жестком диске какой-нибудь файл с расширением png или jpg и вставим его в папку res/drawable (для копирования в проект используется простой Copy-Paste)

Далее нам будет предложено выбрать папку — drawable или drawable-24 . Для добавления обычных файлов изображений выберем drawable :

Здесь сразу стоит учесть, что файл изображения будет добавляться в приложение, тем самым увеличивая его размер. Кроме того, большие изображения отрицательно влияют на производительность. Поэтому лучше использовать небольшие и оптимизрованные (сжатые) графические файлы. Хотя, также стоит отметить, что все файлы изображений, которые добавляются в эту папку, могут автоматически оптимизироваться с помощью утилиты aapt во время построения проекта. Это позволяет уменьшить размер файла без потери качества.

При копировании файла нам будет предложено установить для него новое имя.

Можно изменить название файла, а можно оставить так как есть. В моем случае файл называется dubi2.png . И затем нажмем на кнопку Refactor. И после этого в папку drawable будет добавлен выбранный нами файл изображения.

Для работы с изображениями в Android можно использовать различные элементы, но непосредственно для вывода изображений предназначен ImageView . Поэтому изменим файл activity_main.xml следующим образом:

В данном случае для отображения файла в ImageView у элемента устанавливается атрибут android:src . В его значении указывается имя графического ресурса, которое совпадает с именем файла без расширения. И после этого уже в Preview или в режиме дизайнере в Android Studio можно будет увидеть применение изображения, либо при запуске приложения:

Если бы мы создавали ImageView в коде java и из кода применяли бы ресурс, то activity могла бы выглядеть так:

В данном случае ресурс drawable напрямую передается в метод imageView.setImageResource() , и таким образом устанавливается изображение. В результате мы получим тот же результат.

Однако может возникнуть необходимость как-то обработать ресурс перед использованием или использовать его в других сценариях. В этом случае мы можем сначала получить его как объект Drawable и затем использовать для наших задач:

Для получения ресурса применяется метод ResourcesCompat.getDrawable() , в который передается объект Resources, идентификатор ресурса и тема. В данном случае тема нам не важна, поэтому для нее передаем значение null. Возвращается ресурс в виде объекта Drawable :

Затем, например, можно также передать ресурс объекту ImageView через его метод setImageDrawable()

Источник

Android SDK: Продвинутая галерея для изображений

С помощью Android Intents и Gallery View, можно разрешить пользователю выбирать изображения на их устройстве. В этом уроке мы объединим выбор изображений с Gallery View, который мы немного улучшим создав интерактивную функцию для показа выбранных пользователем изображений. Если вы создавали хотя бы одно приложение для Android, вы вполне справитесь со всеми этапами урока.

Приложение, которое мы создадим в этом уроке будет отображать прокручиваемую ленту изображений, с помощью Android Gallery View. Пользователь сможет импортировать изображения нажав на объект в галерее, которые будут взяты из галереи по-умолчанию или с помощью файлового менеджера. Когда изображение выбрано, мы обработаем его до того как показать, поэтому мы не задействуем лишние ресурсы памяти. При нажатии на эскиз, приложение покажет выбранное изображение в увеличенном виде.

Шаг 1: Создание проекта Android

Запустите новый проект в Eclipse. В main Activity классе вашего приложения добавьте в начале следующие операторы импорта, это нужно сделать до объявления класса:

Объявление класса должно быть примерно такое, но с вашим названием Activity:

Внутри класса, до метода «onCreate», который Eclipse должен автоматически включить, добавьте следующие переменные:

Первая переменная — константа, которая используется для идентификации изображения, после того как пользователь его выбрал. Когда пользователь нажимает на эскиз и переходит к выбору изображения, мы будем использовать переменную «currentPic» чтобы отслеживать какие эскиз выбран. Две другие переменные необходимы для элементов пользовательского интерфейса, которые указаны в классе.

В файле манифеста, единственное дополнение, которые вы должны сделать, указать элемент main Activity для вашего приложения:

Это позволит приложению сохранять изображения при смене ориентации устройства. Теперь давайте настроим текстовые строки, которые мы будем использовать в пользовательском интерфейсе. Откройте файл «res/values/strings.xml». Eclipse должен был уже добавить имя вашего приложения, которое вы можете изменить, если захотите. Добавьте следующие строки:

Это все будет использовано в интерфейсе. Теперь вернемся к нашему классу Activity.

Шаг 2: Дизайн приложения

Прежде чем мы напишем функционал на Java, давайте оформим элементы приложения. Откройте «res/layout/main.xml» файл. Мы будем использовать Linear Layout, поэтому добавьте следующие строки в файл XML:

Мы добавим ещё больше элементов в наш Linear Layout. Начнём с Text View как первого элемента в Linear Layout:

Обратите внимание, что мы ссылаемся на строку которую определили в файле XML. Далее добавьте элемент галереи следующим образом:

Мы используем атрибут ID, поэтому мы сможем обратиться к объекту в Java коде. Затем добавим еще один Text View:

Опять, мы используем строку, которую уже определили. Наконец, последним пунктом в нашем Linear Layout будет Image View, который будет показывать увеличенное изображение галереи:

Мы должны будем сослаться на этот View в Java коде, поэтому мы используем атрибут ID. Также, мы используем строку в качестве описания содержимого. Теперь нам нужно определить стиль для галереи. Создайте новый файл в каталоге «res/values», и назовите его «attrs.xml». Напишите следующий код:

Мы собираемся использовать некоторые из ресурсов платформы Android для оформления элементов нашей галереи и будем ссылаться к ним в Java коде.

Теперь вернемся к нашему Activity классу. Внутри метода «onCreate» существующий код должен выглядеть следующим образом:

После этого, добавьте ссылки на два элемента пользовательского интерфейса:

Теперь мы готовы создать галерею и обработать взаимодействия с пользователем.

Шаг 3: Создаём Base Adapter

Чтобы создать Gallery View, мы собираемся создать класс, который расширяет Base Adapter. В вашем классе Activity после метода «onCreate», создайте новый подкласс следующим образом:

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

Первая переменная представляет фоновый цвет элемента Android Gallery, на которую мы указываем в нашем «attrs.xml» файле. Context указывает на пользовательский интерфейс при добавлении элементов. Массив Bitmap хранит изображения, которые мы будем отображать в Gallery View. Чтобы начать с чего-то, мы будем использовать изображение «заглушку», в качестве элементов галереи, которые пользователь ещё не выбрал.

Пойдём дальше и и создадим метод конструктора для нашего нового класса PicAdapter, после переменных:

Мы добавим больше кода в метод конструктора позже. Сначала мы создадим переменные массивы Context и Bitmap — мы собираемся показать галерею с 10 объектами в ней, но вы можете изменить эту величину, если хотите. Для демонстрации мы используем стандартную иконку проекта в Eclipse, в качестве «заглушки» изображения, но вы конечно же можете создать свою. Если вы хотите использовать ваше изображение, сохраните его в папках drawable и измените значение строки «decodeResource» в соответствии с новым именем.

Теперь мы можем назначить «заглушку» изображения для каждой позиции в массиве, так что все эскизы галереи первоначально будут отображать её — находясь еще внутри метода-конструктора:

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

Здесь мы указываем на содержание нашего «attrs.xml» файла.

Теперь нам нужно задействовать несколько стандартных методов, расширяя класс Base Adapter. Для начала подключим метод «getCount», после метода конструктора:

Этот метод возвращает количество объектов в галерее. После этого метода добавьте стандартный метод «getItem»:

Далее добавим метод «getItemId»:

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

В методе «getView» мы определяем, что мы хотим показать в каждом элементе галереи. Наш массив Bitmap будет содержать изображения, в каждой позиции с индексом массива Bitmap, соответствующий его позиции в галерее. Также как при создании View, мы устанавливаем Bitmap для отображения, вместе с некоторыми свойствами. Также мы установим фоновый цвет элемента, который мы упоминали ранее. При желании вы можете изменить размер эскизов. Каждый эскиз будет отображаться отцентрированным, если его размер меньше, чем объект View — вы можете выбрать другую опцию, к примеру, растянуть изображение, чтобы соответствовать размеру поля, изменив параметр «ScaleType».

Теперь вернёмся к началу класса main Activity вашего приложения. Добавим новую переменную, представляющую объект нового класса, который вы только что создали:

Теперь в методе «onCreate» после кода, который вы добавили, задействуйте переменную Base Adapter и установите его в качестве адаптера для галереи:

При первоначальном запуске приложения, всё должно выглядеть примерно так:

Теперь мы готовы обрабатывать взаимодействия с пользователем.

Шаг 4: Разрешаем пользователю выбрать изображения

Чтобы выбрать изображения для галереи, пользователь должен нажать на эскиз. В методе «onCreate» после существующего кода, добавьте следующий обработчик события для каждого элемента в Gallery View:

Мы создаем новый обработчик «OnItemLongClickListener» с методом «onItemLongClick» внутри него. Добавьте следующий код внутри метода:

Найдите минутку и взгляните на то, что получилось. Сначала, мы записываем выбранный элемент, теперь мы знаем, какой элемент в галерее выбран. Затем код сообщает приложению, что необходимо дать пользователю выбрать приложение для выбора изображения, это может быть Галерея Android или файловый менеджер. Указав «ACTION_GET_CONTENT», мы даём задание приложению вернуть результат выбора пользователя. Поскольку мы запускаем событие выбора с помощью «startActivityForResult», мы сможем обработать возвращаемые изображения в Activity метода «onActivityResult».

То, что произойдёт, когда событие выбора изображения запущено будет зависеть от того какие приложения установил пользователь. На моем устройстве я могу выбрать из двух приложений:

Файл изображения который я выберу в любом из этих приложений будет возвращён в приложение.

Шаг 5: Управление полученными изображениями

Когда пользователь выбирает изображение из галереи или файлового менеджера приложения, данные будут возвращены в метод «onActivityResult». Добавьте метод к классу Activity, используя следующую структуру:

Здесь мы проверяем, что мы получили корректные данные и что данные вернулись после события выбора. Мы вызовем метод суперкласса в конце метода. Внутри второго оператора «if» мы добавим весь код который нужен для импорта выбранного изображения, начиная с URI изображения:

Нам нужно немного больше чтобы импортировать изображение. Начнём с объявления нескольких переменных:

Теперь, давайте, попытаемся получить путь изображения:

Теперь мы получим данные изображения, затем отправим запрос используя курсор, передадим URI изображения выбранного пользователем. Условия «if» и «else» обрабатывают выбор изображения пользователем через стандартную галерею или с помощью файлового менеджера. Конечным результатом кода будет путь к выбранному изображению.

Шаг 6: Отображение обработанных изображений для снижения нагрузки на использование памяти

Вместо того, чтобы просто показать выбранные пользователем изображения, мы должны свести к минимуму количество памяти которое будет использовать наше приложение. В большинстве случаев изображения на устройстве будут гораздо больше, чем мы можем отобразить в приложении. По этой причине нам нужно обработать изображения перед его отображением в приложении. Находясь внутри второго оператора «if» в «onActivityResult» добавьте следующее:

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

Теперь нам нужно настроить объект Bitmap чтобы декодировать изображение:

Сначала узнаем больше о размере изображения:

Теперь передадим настройки Bitmap для обработки размеров изображения, но не самого изображения. Мы будем использовать эту информацию для определения подходящего размера для импорта изображения, и начнём с задействования переменной которую сохраним:

Теперь вычислим размер образца, и если необходимый размер меньше, чем размер изображения по-умолчанию:

Теперь мы можем установить размер образца Bitmap:

Теперь нам нужно настроить параметры Bitmap для того, чтобы декодировать само содержимое файла, а не только его размеры:

Наконец мы можем обработать Bitmap используя наши настройки:

Теперь переменная «pic» содержит Bitmap изображения, которое мы будем использовать в приложении.

Шаг 7: Добавляем выбранные изображения в галерею

Теперь у нас есть выбранное пользователем изображение, и мы можем добавить его в массив Gallery. Для этого нам нужно добавить метод в класс Base Adapter. Внутри класса «PicAdapter» добавьте следующий метод после «getView»:

Теперь вернёмся к «onActivityResult», и после строки, в которой мы обработали файл изображения и сохранили результат в переменной «pic», добавьте следующее:

Сначала мы вызовем новый метод, чтобы добавить новое изображение в массив Gallery, а затем мы установим Adapter так, что новое изображение мгновенно появится в Gallery View.

Шаг 8: Показываем большое изображение

Наконец, мы покажем одно изображение большего размера. Изображение будет показано в larger Image View в момент импорта в приложение и затем когда пользователь выбирает его в галерее. Для начала, настроим показ изображения большего размера, когда пользователь импортирует его. В методе «onActivityResult», после строк в которой мы вызывали «setAdapter», добавьте следующее:

У нас есть переменная, содержащая увеличенное изображение, поэтому можно просто объединить их вместе с параметрами обработки. Теперь давайте обработаем показ увеличенного изображения, когда пользователь нажимает на эскиз. В классе «PicAdapter» добавьте еще один метод после «addPic»:

Этот метод просто возвращает изображение в указанную позицию. Теперь перейдём к Activity методу «onCreate». После того как вы добавили обработчик нажатия, добавьте обработчик для каждого объекта Gallery View.

Метод «onItemClick» будет срабатывать каждый раз когда пользователь будет нажимать на эскиз в галерее. Теперь мы вызываем новый метод «getPic», который добавили в класс «PicAdapter» чтобы получить Bitmap выбранной позиции, и устанавливаем в качестве Image View Bitmap для его отображения в увеличенном размере.

Заключение

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

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

Источник