2011-04-30 42 views

Trả lời

55

Bạn có thể tạo một tài nguyên (lớp drawable xml) cho 'biên giới' (trên thực tế nền) ImageView của bạn, và tuyên bố trong bạn theme rằng ImageView Tài nguyên nền là xml có thể vẽ được.

Nếu bạn cần điều này "border" phải được thay đổi dựa vào nhà nước 's ImageView (focused, selected, vv), sau đó bạn nên tạo thêm drawables lớp, và đặt chúng lại với nhau thành một xml selector (bang drawable) .
Sau đó, trong chủ đề của bạn, bạn nên đặt nền của ImageViewselector.xml này.

Cập nhật
Dưới đây là một ví dụ về cách để xác định đường biên giới đơn giản để hình ảnh của bạn, điều đó sẽ dẫn đến

efteling with border

Bạn phải

  1. tạo một layer mới tệp có thể kéo (image_border.xml),
  2. sửa đổi/tạo styles.xml của bạn tệp
  3. sửa đổi/tạo colors.xml tệp
  4. sửa đổi tệp xml bố cục (hoặc mã của bạn) để áp dụng kiểu cho ImageView.

res/drawable/image_border.xml

<?xml version="1.0" encoding="utf-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item> 
     <shape android:shape="rectangle"> 
      <gradient android:angle="90" 
       android:startColor="@color/image_border_start" 
       android:centerColor="@color/image_border_center" 
       android:endColor="@color/image_border_end" /> 
     </shape> 
    </item> 
    <item android:top="2dp" android:left="2dp" 
     android:right="2dp" android:bottom="2dp"> 
     <shape android:shape="rectangle"> 
      <solid android:color="@color/default_back_color" /> 
     </shape> 
    </item> 
</layer-list> 

res/values ​​/ styles.xml
Thêm các dòng sau đây:

<style name="myImageView"> 
    <!-- 3dp so the background border to be visible --> 
    <item name="android:padding">3dp</item> 
    <item name="android:background">@drawable/image_border</item> 
    <item name="android:scaleType">fitCenter</item> 
</style> 

res/values ​​/ colors.xml
Thêm các dòng sau đây:

<color name="image_border_start">#40990000</color> 
<color name="image_border_end">#FF660000</color> 
<color name="image_border_center">#FFFF3333</color> 

Và cuối cùng xác định kiểu của ImageView của bạn trong bố trí của bạn xml:

<ImageView android:id="@+id/my_image" 
    android:layout_width="100dp" android:layout_height="100dp" 
    android:src="@drawable/efteling" 
    style="@style/myImageView" /> 
+0

Cảm ơn bạn bè vì thông tin. – Piyush

+1

Không sao, tôi hy vọng bạn có thể bắt đầu với mẫu ở trên. Nếu bạn cần thêm thông tin, vui lòng hỏi :) – rekaszeru

+0

Cảm ơn bạn lần nữa vì mã số ....... – Piyush

8

Bạn có thể sử dụng tập tin XML này như một drawable thay vì nhiều file, nhưng tệp này được đặt trong thư mục có thể kéo. Trong ImageView, hãy sử dụng tệp XML này làm nền có thể vẽ , như: android:background="@drawable/following code file name".

Tôi hy vọng điều này hữu ích cho bạn.

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

Tôi đã thử tất cả các giải pháp trên nhưng chúng không hiệu quả đối với tôi! Vì vậy, tôi đã tìm ra một giải pháp đơn giản cho việc này! :-)

Tôi nhớ rằng tôi đã đọc về FrameLayout của Android trong article sau đây nói rằng nó giúp chúng tôi xếp chồng các thành phần giao diện người dùng lên trên cùng một thứ tự theo thứ tự chúng tôi thêm chúng.

Giải pháp:

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

Preview:

Và đó là nó. Bạn sẽ nhận được như sau imageView!

preview of the ImageView with boarder

Ưu điểm và Nhược điểm:

Tôi nghĩ rằng đây là khá giải pháp dễ dàng để sử dụng trong bất cứ nơi nào khác và đó là tất cả những điều bạn làm ngồi ở một nơi duy nhất để dễ dàng hơn để sửa đổi nó. Tuy nhiên tôi không muốn phải thêm hai ImageView.

Các vấn đề liên quan