Perbatasan untuk tampilan gambar di Android?

Bagaimana cara menetapkan batas untuk ImageViewdan mengubah warnanya di Android?

Saya mengatur xml di bawah ini ke latar belakang Tampilan Gambar sebagai Gambar. Berhasil.

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

Dan kemudian tambahkan android:background="@drawable/yourXmlFileName"keImageView

Berikut ini adalah kode yang saya gunakan untuk memiliki batas hitam. Perhatikan bahwa saya belum menggunakan file xml tambahan untuk perbatasan.

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

Ini adalah pos lama yang saya tahu, tetapi saya pikir ini mungkin dapat membantu seseorang di luar sana.

Jika Anda ingin mensimulasikan batas tembus pandang yang tidak tumpang tindih dengan warna "solid" bentuk, gunakan ini di xml Anda. Perhatikan bahwa saya tidak menggunakan tag "stroke" di sini sama sekali karena tampaknya selalu tumpang tindih dengan bentuk gambar yang sebenarnya.

  <?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 dalam file 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" />

simpan kode di bawah ini dengan nama border_image.xmldan itu harus dalam folder yang dapat digambar

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

jika Anda ingin memberikan sudut bulat ke batas gambar maka Anda dapat mengubah baris dalam file border.xml

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

Buat Perbatasan

Buat file xml (mis. "Frame_image_view.xml") dengan konten berikut di folder yang dapat digambar:

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

Ganti @dimen/borderThicknessdan @color/borderColordengan apa pun yang Anda inginkan atau tambahkan dimen / warna yang sesuai.

Tambahkan Drawable as background ke ImageView Anda:

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

Anda harus menggunakan android:cropToPadding="true", jika bantalan yang ditentukan tidak memiliki efek. Atau gunakan android:padding="@dimen/borderThickness"di ImageView Anda untuk mencapai hal yang sama. Jika perbatasan membingkai induk alih-alih ImageView Anda, coba gunakan android:adjustViewBounds="true".

Ubah Warna Batas

Cara termudah untuk mengubah warna batas Anda dalam kode menggunakan atribut tintBackgound.

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

atau

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

Jangan lupa untuk mendefinisikan newColor.

Tambahkan latar belakang Drawable like 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>

Perbarui latar belakang ImageView di 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" />
...

Kecualikan pad ImageView jika Anda ingin src untuk menggambar di atas latar belakang.

Ini telah digunakan di atas tetapi tidak disebutkan secara eksklusif.

setCropToPadding(boolean);

Jika benar , gambar akan dipotong agar pas dengan padding-nya.

Ini akan membuat ImageViewsumber agar sesuai dengan padding yang ditambahkan ke latar belakangnya.

Melalui XML dapat dilakukan sebagai berikut-

android:cropToPadding="true"

Anda harus membuat background.xml dalam res / drawable code ini

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

Bagi mereka yang mencari batas kustom dan bentuk ImageView. Anda dapat menggunakan android-shape-imageview

Tambahkan saja compile 'com.github.siyamed:android-shape-imageview:0.9.+@aar'kebuild.gradle .

Dan gunakan dalam tata letak Anda.

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

Saya hampir menyerah tentang ini.

Ini adalah kondisi saya menggunakan luncuran untuk memuat gambar, lihat masalah luncuran terperinci di sini tentang transformasi sudut bulat dan di sini

Saya juga memiliki atribut yang sama untuk saya ImageView, untuk semua orang yang menjawab di sini 1 , di sini 2 & di sini 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"

Namun tetap tidak berhasil.

Setelah meneliti sebentar, menggunakan foregroundatribut dari jawaban SO ini di sini memberikan hasilandroid:foreground="@drawable/all_round_border_white"

sayangnya itu memberi saya sudut perbatasan "tidak baik" seperti gambar di bawah ini:

Saya merasa jauh lebih mudah untuk melakukan ini:

1) Edit bingkai untuk memiliki konten di dalamnya (dengan alat 9patch).

2) Tempatkan bagian ImageViewdalam a Linearlayout, dan atur latar belakang bingkai atau warna yang Anda inginkan sebagai latar belakang Linearlayout. Saat Anda mengatur bingkai untuk memiliki konten di dalamnya, Anda ImageViewakan berada di dalam bingkai (tepat di mana Anda mengatur konten dengan alat 9patch).

Berikut ini adalah solusi paling sederhana saya untuk masalah yang panjang ini.

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

Dalam jawaban berikut saya sudah menjelaskannya dengan cukup baik, silakan lihat juga!

Saya harap ini akan membantu orang lain di luar sana!

Dalam xml yang sama saya gunakan selanjutnya:

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

Pertama menambahkan warna latar yang Anda inginkan sebagai warna perbatasan Anda, lalu

ubah cropToPadding menjadi true dan setelah itu tambahkan padding.

Maka Anda akan memiliki batas untuk imageView Anda.