Fronteira para uma visualização de imagem no Android?

Como posso definir uma borda para um ImageViewe alterar sua cor no Android?

Defino o xml abaixo como plano de fundo do Image View como Drawable. Funciona.

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="#FFFFFF" />
    <stroke android:width="1dp" android:color="#000000" />
    <padding android:left="1dp" android:top="1dp" android:right="1dp"
        android:bottom="1dp" />
</shape>

E depois adicione android:background="@drawable/yourXmlFileName"ao seuImageView

A seguir está o código que eu costumava ter borda preta. Observe que eu não usei arquivo xml extra para borda.

<ImageView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/red_minus_icon"
    android:background="#000000"
    android:padding="1dp"/>

Este é um post antigo que eu conheço, mas achei que isso poderia ajudar alguém por aí.

Se você deseja simular uma borda translúcida que não se sobrepõe à cor "sólida" da forma, use-a no seu xml. Observe que eu não uso a tag "stroke" aqui, pois parece sempre se sobrepor à forma desenhada.

  <?xml version="1.0" encoding="utf-8"?>
    <layer-list xmlns:android="http://schemas.android.com/apk/res/android" >

    <item>
        <shape android:shape="rectangle" >
            <solid android:color="#55111111" />

            <padding
                android:bottom="10dp"
                android:left="10dp"
                android:right="10dp"
                android:top="10dp" />

            <corners android:radius="5dp" />
        </shape>
    </item>
    <item>
        <shape android:shape="rectangle" >
            <padding
                android:bottom="5dp"
                android:left="5dp"
                android:right="5dp"
                android:top="5dp" />

            <solid android:color="#ff252525" />
        </shape>
    </item>
</layer-list>

ImageView no arquivo xml

<ImageView
            android:id="@+id/myImage"
            android:layout_width="100dp"
            android:layout_height="100dp"

            android:padding="1dp"
            android:scaleType="centerCrop"
            android:cropToPadding="true"
            android:background="@drawable/border_image"

            android:src="@drawable/ic_launcher" />

salve o código abaixo com o nome de border_image.xmle ele deve estar na pasta drawable

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">

    <gradient
        android:angle="270"
        android:endColor="#ffffff"
        android:startColor="#ffffff" />

    <corners android:radius="0dp" />

    <stroke
        android:width="0.7dp"
        android:color="#b4b4b4" />
</shape>

se você quiser dar um canto arredondado à borda da imagem, poderá alterar uma linha no arquivo border.xml

<corners android:radius="4dp" />

Criar borda

Crie um arquivo xml (por exemplo, "frame_image_view.xml") com o seguinte conteúdo na sua pasta drawable:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <stroke
        android:width="@dimen/borderThickness"
        android:color="@color/borderColor" />
    <padding
        android:bottom="@dimen/borderThickness"
        android:left="@dimen/borderThickness"
        android:right="@dimen/borderThickness"
        android:top="@dimen/borderThickness" />
    <corners android:radius="1dp" /> <!-- remove line to get sharp corners -->
</shape>

Substitua @dimen/borderThicknesse@color/borderColor com o que quiser ou adicione dimen / cor correspondente.

Adicione o Drawable como plano de fundo ao seu ImageView:

<ImageView
        android:id="@+id/my_image_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/frame_image_view"
        android:cropToPadding="true"
        android:adjustViewBounds="true"
        android:scaleType="fitCenter" />

Você precisa usar android:cropToPadding="true", caso contrário, o preenchimento definido não terá efeito. Como alternativa, use android:padding="@dimen/borderThickness"o ImageView para obter o mesmo. Se a borda enquadrar o pai em vez do ImageView, tente usar android:adjustViewBounds="true".

Alterar cor da borda

A maneira mais fácil de alterar a cor da borda no código é usar o atributo tintBackgound.

ImageView img = findViewById(R.id.my_image_view);
img.setBackgroundTintList(ColorStateList.valueOf(Color.RED); // changes border color to red

ou

ImageView img = findViewById(R.id.my_image_view);
img.setBackgroundTintList(getColorStateList(R.color.newColor));

Não se esqueça de definir o seu newColor.

Adicione um Drawable em segundo plano como res / drawables / background.xml:

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
  <solid android:color="@android:color/white" />
  <stroke android:width="1dp" android:color="@android:color/black" />
</shape>

Atualize o plano de fundo do ImageView em res / layout / foo.xml:

...
<ImageView
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:padding="1dp"
  android:background="@drawable/background"
  android:src="@drawable/bar" />
...

Exclua o preenchimento do ImageView se desejar que o src desenhe sobre o plano de fundo.

Isso foi usado acima, mas não mencionado exclusivamente.

setCropToPadding(boolean);

Se verdadeiro , a imagem será cortada para caber dentro do preenchimento.

Isso fará com que a ImageViewfonte caiba dentro do preenchimento adicionado ao plano de fundo.

Via XML, isso pode ser feito da seguinte maneira:

android:cropToPadding="true"

você deve criar um background.xml em res / drawable este código

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#FFFFFF" />
<corners android:radius="6dp" />
<stroke
    android:width="6dp"
    android:color="@android:color/white" />
<padding
    android:bottom="6dp"
    android:left="6dp"
    android:right="6dp"
    android:top="6dp" />
</shape>

Para quem está pesquisando borda e forma personalizadas do ImageView. Você pode usar o android-shape-imageview

Basta adicionar compile 'com.github.siyamed:android-shape-imageview:0.9.+@aar'ao seubuild.gradle .

E use em seu layout.

<com.github.siyamed.shapeimageview.BubbleImageView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:src="@drawable/neo"
    app:siArrowPosition="right"
    app:siSquare="true"/>

Eu quase desisti disso.

Esta é minha condição usando o deslize para carregar a imagem, consulte o problema detalhado do deslize aqui sobre transformações de cantos arredondados e aqui

Eu também tenho os mesmos atributos para o meu ImageView, pois todos respondem aqui 1 , aqui 2 e aqui 3

android:cropToPadding="true"
android:adjustViewBounds="true"
android:scaleType="fitCenter"`
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/path_to_rounded_drawable"

Mas ainda sem sucesso.

Depois de pesquisar por algum tempo, o uso de foregroundatributos desta resposta SO fornece um resultadoandroid:foreground="@drawable/all_round_border_white"

infelizmente, isso me deu o canto da borda "nada legal", como na imagem abaixo:

Achei muito mais fácil fazer isso:

1) Edite o quadro para incluir o conteúdo (com a ferramenta 9patch).

2) Coloque o ImageViewinterior a Linearlayoute defina o plano de fundo ou a cor do quadro que você deseja como plano de fundo do Linearlayout. Conforme você define o quadro para ter o conteúdo dentro dele, você ImageViewestará dentro do quadro (exatamente onde você definiu o conteúdo com a ferramenta 9patch).

A seguir, é minha solução mais simples para esse longo problema.

<FrameLayout
    android:layout_width="112dp"
    android:layout_height="112dp"
    android:layout_marginLeft="16dp" <!-- May vary according to your needs -->
    android:layout_marginRight="16dp" <!-- May vary according to your needs -->
    android:layout_centerVertical="true">
    <!-- following imageView acts as the boarder which sitting in the background of our main container ImageView -->
    <ImageView
        android:layout_width="112dp"
        android:layout_height="112dp"
        android:background="#000"/>
    <!-- following imageView holds the image as the container to our image -->
    <!-- layout_margin defines the width of our boarder, here it's 1dp -->
    <ImageView
        android:layout_width="110dp"
        android:layout_height="110dp"
        android:layout_margin="1dp"
        android:id="@+id/itemImageThumbnailImgVw"
        android:src="@drawable/banana"
        android:background="#FFF"/> </FrameLayout>

Na resposta a seguir eu expliquei bem o suficiente, por favor, dê uma olhada nisso também!

Espero que isso seja útil para alguém por aí!

No mesmo xml que usei a seguir:

    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="#ffffff" <!-- border color -->
        android:padding="3dp"> <!-- border width -->

        <ImageView
            android:layout_width="160dp"
            android:layout_height="120dp"
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            android:scaleType="centerCrop" />
    </RelativeLayout>

Primeiro, adicione a cor de fundo que você deseja como a cor da borda e, em seguida,

altere o cropToPadding para true e depois adicione o preenchimento.

Então você terá sua borda para o seu imageView.