studio - ¿Borde para una vista de imagen en Android?

programa para cambiar el color de una imagen online

Question

¿Cómo puedo establecer un borde para un ImageView y cambiar su color en Android?

Answer 1

A continuación se muestra el código que solía tener un borde negro. Tenga en cuenta que no he utilizado un archivo xml extra para el borde.

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

Answer 2

Agregue un Drawable de fondo 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>

Actualice el fondo de ImageView en 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" />
...

Excluya el relleno ImageView si desea que el src dibuje sobre el fondo.

Answer 3

Configuré el siguiente xml en el fondo de la Vista de imagen como Dibujable. 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>

Y luego agregue android:background="@drawable/yourXmlFileName" a su ImageView

Answer 4

En el mismo xml que he usado a continuación:

    <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>

Answer 5

Este es un post antiguo que conozco, pero pensé que posiblemente podría ayudar a alguien.

Si desea simular un borde translúcido que no se superponga con el color "sólido" de la forma, entonces use esto en su xml. Tenga en cuenta que no uso la etiqueta de "trazo" aquí en absoluto, ya que parece que siempre se superpone a la forma real dibujada.

  <?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>

Answer 6

Esto ha sido utilizado anteriormente pero no mencionado exclusivamente.

setCropToPadding(boolean)

If true, the image will be cropped to fit within its padding. 

Esto hará que la fuente de ImageView se ajuste al relleno añadido al fondo.

A través de XML se puede hacer como se muestra a continuación,

android:cropToPadding="true"

Answer 7

La siguiente es mi solución más simple a este largo 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>

En la siguiente answer lo he explicado bastante bien, ¡por favor, eche un vistazo a eso también!

¡Espero que esto sea útil para alguien más allá afuera!

Answer 8

Me resultó mucho más fácil hacer esto:

1) Edite el marco para tener el contenido dentro (con la herramienta 9patch).

2) Coloque el ImageView dentro de un Linearlayout , y establezca el fondo o el color del marco que desea como fondo de Linearlayout . Cuando configure el marco para que tenga el contenido dentro de sí mismo, su ImageView estará dentro del marco (justo donde configura el contenido con la herramienta 9patch).

Answer 9

Para aquellos que están buscando borde personalizado y la forma de ImageView. Puedes usar android-shape-imageview

Solo agrega compile ''com.github.siyamed:android-shape-imageview:0.9.+@aar'' a tu build.gradle .

Y utilizar en su diseño.

<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"/>

Answer 10

debe crear un background.xml en 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>

Answer 11

ImageView en archivo 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" />

guarde el código de abajo con el nombre de border_image.xml y debería estar en una carpeta dibujable

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
 android:shape="rectangle">
<gradient android:startColor="#ffffff" 
android:endColor="#ffffff"
android:angle="270" />
<corners android:radius="0dp" />
<stroke android:width="0.7dp" android:color="#b4b4b4" />
</shape>

Si desea asignar una esquina redondeada al borde de la imagen, puede cambiar una línea en el archivo border.xml.

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