В Android ImageView по умолчанию является прямоугольником. Как сделать прямоугольник с закругленными углами (обрезать все 4 угла моего растрового изображения, чтобы они были прямоугольниками с закругленными углами) в ImageView?
573
В Android ImageView по умолчанию является прямоугольником. Как сделать прямоугольник с закругленными углами (обрезать все 4 угла моего растрового изображения, чтобы они были прямоугольниками с закругленными углами) в ImageView?
ShapeableImageView
сделать круглую или закругленную ImageView stackoverflow.com/a/61086632/7666442Ответы:
Это довольно поздно для ответа, но для любого, кто ищет это, вы можете сделать следующий код, чтобы вручную закруглить углы ваших изображений.
http://www.ruibm.com/?p=184
Это не мой код, но я использовал его, и он прекрасно работает. Я использовал его в качестве помощника в классе ImageHelper и немного расширил, чтобы передать количество растушевки, необходимое для данного изображения.
Конечный код выглядит так:
Надеюсь, это поможет кому-то!
источник
Хотя приведенный выше ответ работает, Romain Guy (основной разработчик для Android) показывает лучший метод в своем блоге, который использует меньше памяти, используя шейдер, не создавая копию растрового изображения. Общая суть функциональности здесь:
Преимущество этого перед другими методами состоит в том, что это:
Я создал RoundedImageView на основе этого кода, который оборачивает эту логику в ImageView и добавляет надлежащую
ScaleType
поддержку и необязательную закругленную границу.источник
/ example / res / layout / rounded_item.xml
почему вы указываете SRC изображения , когда все ваши источники жёстко? Хорошая демка, просто излишняя.Другой простой способ - использовать CardView с угловым радиусом и ImageView внутри:
источник
Обрезание к округлым формам было добавлено в
View
класс в API 21.Просто сделай это:
Рез / рисуем / round_outline.xml
android:background="@drawable/round_outline"
android:clipToOutline="true"
К сожалению, есть ошибка, и этот атрибут XML не распознается. К счастью, мы все еще можем настроить отсечение в Java:
ImageView.setClipToOutline(true)
Вот как это будет выглядеть:
Замечания:
Этот метод работает для любой нарисованной формы (не только округленной). Он будет обрезать ImageView к любой форме фигуры, которую вы определили в Drawable XML.
Специальное примечание о ImageViews
setClipToOutline()
работает только в том случае, если фон представления установлен на форму для рисования. Если эта фоновая фигура существует, View рассматривает контур фигуры как границы для целей отсечения и затенения.Это означает, что если вы хотите использовать
setClipToOutline()
для скругления углов в ImageView, ваше изображение должно быть установлено с использованиемandroid:src
вместоandroid:background
(поскольку фон должен быть установлен на вашу округлую форму). Если вы ДОЛЖНЫ использовать background для установки изображения вместо src, вы можете использовать этот обходной путь:источник
android:clipToOutline
нужно использоватьandroid:outlineProvider="background"
.В версии 21 библиотеки поддержки теперь есть решение этой проблемы: оно называется RoundedBitmapDrawable .
По сути, это как обычный Drawable, за исключением того, что вы задаете ему угловой радиус для отсечения с помощью:
Итак, начиная с
Bitmap src
целиImageView
, это будет выглядеть примерно так:источник
android.support.v4.graphics.drawable.RoundedBitmapDrawableFactory
такv4
и поддерживает его.v4
библиотеке поддержки, но не доREVISION 21
библиотеки поддержкиscaleType
centerCrop
(поддержка библиотеки v25.3.1)Я сделал Custom ImageView:
Как пользоваться:
Вывод:
Надеюсь, это поможет вам.
источник
Canvas.clipPath()
может вызватьjava.lang.UnsupportedOperationException
в некоторых случаях. См. Stackoverflow.com/questions/13248904/…android:background
, но неandroid:src
.Быстрое решение XML -
Вы можете установить желаемую ширину, высоту и радиус в CardView и scaleType в ImageView.
С AndroidX используйте
<androidx.cardview.widget.CardView>
источник
scaleType="fitXY"
и не выглядит надлежащего @ThemBonesЯ обнаружил, что оба метода были очень полезны при разработке рабочего решения. Вот моя составная версия, которая не зависит от пикселей и позволяет вам иметь некоторые квадратные углы с остальными углами, имеющими одинаковый радиус (что является обычным вариантом использования). Благодаря обоим решениям выше:
Кроме того, я переопределил ImageView, чтобы вставить это, чтобы я мог определить его в XML. Возможно, вы захотите добавить некоторую логику, которую здесь делает супер-вызов, но я прокомментировал это, поскольку в моем случае это бесполезно.
Надеюсь это поможет!
источник
Округлое изображение Использование
ImageLoader
здесьСоздать
DisplayImageOptions
:Или вы можете использовать
Picasso
библиотеку с площади.Вы можете скачать файл RoundedTransformation здесь здесь
источник
Поскольку все ответы казались мне слишком сложными только для поворотов, я подумал и пришел к другому решению, которым, на мой взгляд, стоит поделиться, только с XML, если у вас есть немного места вокруг изображения:
Создайте граничную форму с прозрачным содержимым следующим образом:
Затем в RelativeLayout вы можете сначала разместить свое изображение, а затем в том же месте над формой с другим ImageView. Форма покрытия должна быть больше по размеру на величину ширины границы. Будьте осторожны, чтобы взять больший угловой радиус, поскольку внешний радиус определен, но внутренний радиус - это то, что покрывает ваше изображение.
Надеюсь, это тоже кому-нибудь поможет.
Отредактируйте согласно запросу CQM пример относительного макета:
источник
Начиная с версии
1.2.0-alpha03
этого на компоненты материала библиотеки есть новыйShapeableImageView
.Вы можете использовать что-то вроде:
с:
Или программно:
источник
Моя реализация ImageView с виджетом закругленных углов, который (вниз || вверх) размеры изображения до требуемых размеров. Используется кодовая форма CaspNZ.
источник
В последнее время есть другой способ - использование Glide Generated API . Это требует некоторой начальной работы, но затем дает вам всю мощь Glide с гибкостью, позволяющей делать что угодно, потому что вы записываете реальный код, поэтому я думаю, что это хорошее решение для долгосрочной перспективе. Кроме того, использование очень просто и аккуратно.
Сначала настройте Glide версии 4+:
Затем создайте класс модуля приложения Glid для запуска обработки аннотаций:
Затем создайте расширение Glide, которое действительно работает. Вы можете настроить его, чтобы сделать все, что вы хотите:
После добавления этих файлов создайте свой проект.
Затем используйте его в своем коде так:
источник
RequestOptions
иoptions
в параметрах@GlideExtension
аннотированного класса, и просто обратился к методу.transform(new RoundedCorners(px))
wherepx
is same (int px = Math.round(cornerRadius * (context.getResources().getDisplayMetrics().xdpi / DisplayMetrics.DENSITY_DEFAULT));
).Есть классная библиотека, которая позволяет формировать изображения.
Вот пример:
Определение формы:
Результат:
источник
Вот простой пример переопределения imageView, вы также можете использовать его в дизайнере макетов для предварительного просмотра.
Это для быстрого решения. Радиус используется на всех углах и зависит от процента ширины растрового изображения.
Я только что переопределил
setImageDrawable
и использовал метод поддержки v4 для округления растрового изображения.Применение:
Предварительный просмотр с imageView и пользовательским imageView:
источник
Вы должны расширить
ImageView
и нарисовать свой собственный прямоугольник с закругленными углами.Если вы хотите создать рамку вокруг изображения, вы также можете наложить скругленную рамку поверх изображения в макете.
[править] Наложите рамку, чтобы использовать оригинальное изображение,
FrameLayout
например , с помощью . Первым элементомFrameLayout
будет изображение, которое вы хотите округлить. Затем добавьте еще одинImageView
с рамкой. ВторойImageView
будет отображаться поверх оригинала,ImageView
и, таким образом, Android будет рисовать его содержимое выше оригиналаImageView
.источник
FrameLayout
ПогружаетImageView
в нем и добавить ещеImageView
с закругленной рамой. Таким образом, перваяImageView
будет отображать выбранную вами фотографию, а втораяImageFrame
- округленную рамку.Ромэн Гай, где он находится.
Сокращенная версия выглядит следующим образом.
источник
Это чистое решение XML было достаточно хорошо в моем случае. http://www.techrepublic.com/article/pro-tip-round-corners-on-an-android-imageview-with-this-hack/
РЕДАКТИРОВАТЬ
Вот ответ в двух словах:
В папке / res / drawable создайте файл frame.xml. В нем мы определяем простой прямоугольник с закругленными углами и прозрачным центром.
В ваш файл макета вы добавляете LinearLayout, который содержит стандартный ImageView, а также вложенный FrameLayout. FrameLayout использует отступы и настраиваемый рисунок, чтобы создать иллюзию закругленных углов.
источник
Подсказки к Джорджу Уолтерсу II выше, я просто взял его ответ и немного расширил его, чтобы по-разному поддерживать закругление отдельных углов. Это можно было бы оптимизировать немного дальше (некоторые целевые участки перекрываются), но не намного.
Я знаю, что эта ветка немного устарела, но это один из лучших результатов для запросов в Google о том, как закруглить углы ImageViews на Android.
источник
Примените форму,
imageView
как показано ниже:это может быть полезно для вашего друга.
источник
Почему бы не сделать отсечение
draw()
?Вот мое решение:
Код:
источник
Далее создается объект макета с закругленными прямоугольниками, который рисует скругленный прямоугольник вокруг любых дочерних объектов, которые в нем размещены. Также демонстрируется, как программно создавать виды и макеты без использования XML-файлов макета.
Класс для объекта макета RoundedRectangle определен здесь:
источник
Котлин
Чтобы сделать
ImageView
циркуляр мы можем изменитьcornerRadius
с помощью:источник
Большое спасибо за первый ответ. Здесь модифицированная версия для преобразования прямоугольного изображения в квадратное (и округленное), а цвет заливки передается в качестве параметра.
источник
Если вы используете Glide Library, это будет полезно:
источник
если ваше изображение в Интернете, лучше всего использовать glide и
RoundedBitmapDrawableFactory
(из API 21 - но доступно в библиотеке поддержки), например:источник
centerCrop
Вы можете использовать только
ImageView
в вашем макете и сglide
помощью этого метода вы можете применять закругленные углы.сначала в твоей гадости пиши,
для изображения с закругленными углами,
вызов метода:
источник
ImageView
.Ответьте на вопрос, который перенаправлен сюда: «Как создать круговой ImageView в Android?»
источник
С помощью библиотеки glide и класса RoundedBitmapDrawableFactory этого легко достичь. Возможно, вам потребуется создать круглое изображение заполнителя.
источник
Для тех, кто использует Glide и Kotlin, вы можете добиться этого, расширив
RequestBuilder
и использовать как;
источник
roundCorners
как указано выше? @ Dr.aNdRO