368

ImageViewAndroidでの境界線を設定して色を変更するにはどうすればよいですか?

4

17 に答える 17

606

以下のxmlを画像ビューの背景にDrawableとして設定しました。できます。

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

そして、あなたに追加android:background="@drawable/yourXmlFileName"しますImageView

于 2010-07-16T11:02:21.527 に答える
173

以下は、私が黒い境界線を持っていたのに使用したコードです。ボーダーに追加のxmlファイルを使用していないことに注意してください。

<ImageView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/red_minus_icon"
    android:background="#000000"
    android:padding="1dp"/>
于 2011-05-19T07:55:01.307 に答える
33

ImageViewxmlファイルで

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

以下のコードをの名前で保存するborder_image.xmlと、ドローアブルフォルダにあるはずです

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

画像の境界に丸みを帯びた角を付けたい場合は、border.xmlファイルの行を変更できます

<corners android:radius="4dp" />
于 2014-07-11T07:02:13.383 に答える
25

これは私が知っている古い投稿ですが、これはおそらく誰かを助けるかもしれないと思いました。

シェイプの「単色」の色と重ならない半透明の境界線をシミュレートする場合は、これをxmlで使用します。ここでは「ストローク」タグを使用しないことに注意してください。これは、実際に描画された形状と常に重なっているように見えるためです。

  <?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>
于 2012-04-12T23:50:15.287 に答える
5

ボーダーを作成する

ドローアブルフォルダに次のコンテンツを含むxmlファイル(「frame_image_view.xml」など)を作成します。

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

必要なものに置き換え@dimen/borderThicknessたり@color/borderColor、対応する寸法/色を追加したりします。

Drawableを背景として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" />

を使用する必要があります。使用android:cropToPadding="true"しない場合、定義されたパディングは効果がありません。android:padding="@dimen/borderThickness"または、ImageViewで使用して同じことを実現します。境界線がImageViewではなく親を囲む場合は、を使用してみてくださいandroid:adjustViewBounds="true"

境界線の色を変更する

コードで境界線の色を変更する最も簡単な方法は、tintBackgound属性を使用することです。

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

また

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

を定義することを忘れないでくださいnewColor

于 2019-08-08T01:40:09.813 に答える
4

res / drawables/background.xmlのような背景Drawableを追加します。

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

res / layout/foo.xmlのImageView背景を更新します。

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

srcで背景の上に描画する場合は、ImageViewのパディングを除外します。

于 2016-07-06T18:05:07.623 に答える
3

これは上記で使用されていますが、排他的に言及されていません。

setCropToPadding(boolean);

trueの場合、画像はそのパディング内に収まるようにトリミングされます。

これにより、ImageViewソースが背景に追加されたパディング内に収まるようになります。

XMLを介して、以下のように実行できます-

android:cropToPadding="true"
于 2015-08-12T10:02:09.567 に答える
2

このコードをres/drawableにbackground.xmlを作成する必要があります

<?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>
于 2015-06-09T22:09:29.377 に答える
2

ImageViewのカスタムボーダーと形状をお探しの方に。android-shape-imageviewを使用できます

画像

に追加compile 'com.github.siyamed:android-shape-imageview:0.9.+@aar'するだけbuild.gradleです。

そして、あなたのレイアウトで使用してください。

<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"/>
于 2018-07-11T09:18:19.323 に答える
1

以下は、この長い問題に対する私の最も簡単な解決策です。

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

次の回答で私はそれを十分に説明しました、それも見てください!

これが他の誰かに役立つことを願っています!

于 2015-06-19T06:48:05.027 に答える
1

まず、境界線の色として必要な背景色を追加し、次に ここに画像の説明を入力してください

CropToPaddingをtrueに変更し、その後にパディングを追加します。

次に、imageViewの境界線が作成されます。

于 2019-08-03T17:50:48.443 に答える
1

私はこれについてほとんどあきらめました。

これは、グライドを使用して画像をロードする私の状態です。丸みを帯びたコーナー変換に関する詳細なグライドの問題と、ここを参照してください。

私も同じ属性を持っています。誰もがここで1ここで2 、ここで3ImageView答えます。

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"

しかし、それでも成功しません。

しばらく調査した後、ここでこのSO回答foregroundの属性を使用すると結果が得られますandroid:foreground="@drawable/all_round_border_white"

残念ながら、下の画像のような「良くない」境界コーナーが表示されます。

ここに画像の説明を入力してください

于 2020-01-20T20:09:36.390 に答える
1

Android Studioで9パッチを使用して、境界線を作成できます。

解決策を探していましたが、見つからなかったので、その部分をスキップしました。

次に、FirebaseアセットのGoogle画像検索にアクセスしましたが、誤って9patchを使用していることがわかりました。

9パッチの実行

リンクは次のとおりです:https ://developer.android.com/studio/write/draw9patch

エッジがある場所にドラッグするだけです。

Unityのボーダーエッジのようなものです。

于 2020-07-23T16:33:34.653 に答える
1

このコードをImageViewに追加するだけです:

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

    <solid
        android:color="@color/white"/>

    <size
        android:width="20dp"
        android:height="20dp"/>
    <stroke
        android:width="4dp" android:color="@android:color/black"/>
    <padding android:left="1dp" android:top="1dp" android:right="1dp"
        android:bottom="1dp" />
</shape>
于 2020-09-04T16:57:10.053 に答える
0

私はこれを行うのがとても簡単だとわかりました:

1)フレームを編集してコンテンツを中に入れます(9patchツールを使用)。

2)のImageView内側に配置しLinearlayout、フレームの背景または必要な色をの背景として設定しますLinearlayout。フレーム内にコンテンツが含まれるようにフレームを設定するとImageView、フレーム内になります(9patchツールでコンテンツを設定した場所)。

于 2012-06-25T10:02:53.137 に答える
0

次に使用したのと同じxmlで:

    <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>
于 2016-02-09T15:51:52.463 に答える
0

インデントされた境界線

次のコードを図形に追加します。

<gradient
    android:angle="135"
    android:endColor="#FF444444"
    android:centerColor="#FFAAAAAA"
    android:startColor="#FFFFFFFF"/>

étvoila、光源が左上に設定された、(多かれ少なかれ)インデントされた境界線があります。ビットマップのサイズ(imageviewのサイズに関連して、例では200dpx200dpのimageviewと196dpx196dpのビットマップを使用し、コーナーの半径は14dp)とパディングをいじって、最良の結果。斜角効果を得るには、endとstartcolorを切り替えます。

画像に表示される形状の完全なコードは次のとおりです(res / drawableに保存します(border_shape.xmlなど))。

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient
        android:angle="135"
        android:endColor="#FF444444"
        android:centerColor="#FFAAAAAA"
        android:startColor="#FFFFFFFF"/>
    <padding
        android:top="2dp"
        android:left="2dp"
        android:right="2dp"
        android:bottom="2dp"/>
    <corners
        android:radius="30dp"/>
</shape>

そして、次のようにimageviewでそれを呼び出します。

android:scaleType="center"    
android:background="@drawable/border_shape"
android:cropToPadding="true"
android:adjustViewBounds="true"

そして、角が丸いビットマップのコードは次のとおりです。

Bitmap getRoundedRectBitmap(Bitmap bitmap, float radius) {
    Paint paint = new Paint();
    PorterDuffXfermode pdmode = new PorterDuffXfermode(PorterDuff.Mode.SRC_IN);
    Bitmap bm = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getHeight(), Bitmap.Config.ARGB_8888);
    Canvas canvas = new Canvas(bm);
    Rect rect = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());
    RectF rectF = new RectF(rect);
    canvas.drawARGB(0, 0, 0, 0);
    paint.setColor(0xff424242);
    canvas.drawRoundRect(rectF, radius, radius, paint);
    paint.setXfermode(pdmode);
    canvas.drawBitmap(bitmap, rect, rect, paint);
    return bm;
}
于 2020-12-26T03:54:34.873 に答える