web-dev-qa-db-ja.com

Androidの画像ビューの枠線？

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

androidborderimageview
309
Praveen

下のxmlをImage Viewの背景に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>

そしてImageViewにAndroid:background="@drawable/yourXmlFileName"を追加します

532
Praveen

以下は私が黒い枠を持っていたコードです。ボーダーに余分なxmlファイルを使用していないことに注意してください。

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

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

図形の「単色」色と重ならない半透明の境界線をシミュレートする場合は、これをxmlで使用します。実際の描画図形と常に重なっているように見えるので、ここでは "stroke"タグはまったく使用していません。

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

xmlファイルのImageView

<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という名前で保存してください。これはdrawableフォルダにあるはずです。

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

あなたが画像の境界に丸みを帯びたコーナーを与えたいならば、あなたはborder.xmlファイルのラインを変更するかもしれません

   <corners Android:radius="4dp" />
19
Ashish Saini

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のパディングを除外します。

2
Stephen Niedzielski

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

setCropToPadding(boolean)

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

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

XMLを介して、それは以下のように変換できます。

Android:cropToPadding="true"
2
Atul O Holic

ImageViewのカスタムボーダーと形状を探している人のために。あなたは Android-shape-imageview を使うことができます

image

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

このコードを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>
1
Cabezas

私が次に使用したのと同じ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>
0
porquero

まず境界線の色として必要な背景色を追加し、次に enter image description here

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

そうすると、imageViewの境界線ができます。

0
Achintha Isuru

私はこれを行う方がはるかに簡単だとわかりました。

1）（9パッチツールで）中身が入るようにフレームを編集します。

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

0
noloman

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

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

以下では 答え 私はそれを十分に説明しました、それも見てください！

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

0
Randika Vishman

境界線を作成

描画可能フォルダーに次のコンテンツを含む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"を使用する必要があります。そうしないと、定義されたパディングは効果がありません。または、ImageViewでAndroid:padding="@dimen/borderThickness"を使用して同じことを実現します。 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を定義することを忘れないでください。

0
SuperSmartWorld