Как отобразить границу для просмотра изображений?

Question

Друзья Как отобразить рамку для просмотра изображения?

Хочу привести в соответствие, как в мобильной галерее отображение всех изображений с рамкой.

PLZ, дайте мне ответ и спасибо за продвижение ....

Answer 1

Вы можете создать ресурс (слой для рисования в формате xml) для "границы" вашего ImageView (на самом деле фон) и объявить в своем theme, что фоновый ресурс ImageView - это доступный для рисования xml.

Если вам нужно изменить эту «рамку» в зависимости от состояния ImageView (focused, selected и т. Д.), То вам нужно создать больше слоев для рисования и соединить их вместе в селекторе. XML (состояние рисования).
Тогда в вашей теме вы должны установить фон ImageView таким selector.xml.

Обновление
Ниже приведен пример того, как задать простую рамку для ваших изображений, которая приведет к

Вы должны

1. создать новый файл для рисования слоя (image_border.xml),
2. изменить / создать файл styles.xml
3. изменить / создать colors.xml файл
4. измените XML-файл макета (или код), чтобы применить стиль к ImageView.

Рез / рисуем / 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
Добавьте следующие строки:

<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
Добавьте следующие строки:

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

И, наконец, укажите стиль вашего ImageView в вашем макете xml :

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

Answer 2

Вы можете использовать этот XML-файл как рисованный вместо нескольких файлов, но это файл помещается в папку для рисования. В ImageView используйте этот XML-файл как фон для рисования, например: android:background="@drawable/following code file name".

Надеюсь, это полезно для вас.

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

Answer 3

Я перепробовал все вышеперечисленные решения, но у меня они не сработали!Так что я нашел простое решение для этого!: -)

Я помню, что читал о FrameLayout для Android в следующей статье , в которой говорится, что это помогает нам размещать элементы пользовательского интерфейса друг над другом в том же порядке, который мы добавляемих вверх.

Решение:

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

Предварительный просмотр:

И это все.Вы получите следующее как imageView!

Плюсы и минусы:

Я думаю, что это довольно простое решение для использования вв любом другом месте, и все, что вы делаете, находится в одном месте, так что его легче изменить.Однако мне не нравится добавлять два ImageViews.