Android - лучший способ наложить кнопку воспроизведения на изображение / миниатюру - PullRequest
10 голосов
/ 21 сентября 2011

У меня есть приложение для Android, которое может воспроизводить аудио / видео и показывать изображения.Для видео я хочу наложить кнопку воспроизведения поверх изображения предварительного просмотра, а также в представлениях списка. Прямо сейчас, как я делаю это с ImageView в XML, и затем рисуемый является слоем списка слоев, который я определяюпрограммно, потому что одно из изображений является динамическим, кнопка воспроизведения, конечно, статична.Я хочу выровнять кнопку воспроизведения на 10 пикселей снизу по центру по горизонтали.

Мой ImageView определен следующим образом (в xml)

<ImageView 
          android:id="@+id/EvidencePreview"      
          android:layout_width="267dp"
          android:layout_height="201dp"
          android:scaleType="centerCrop"
          android:layout_margin="3dp"
          android:layout_gravity="center_horizontal|center_vertical"/>

ImageView является частью формы, гдеПользователь может редактировать заголовок и другую информацию.Затем в своей деятельности теперь я создаю список слоев следующим образом:

Resources resources = mContext.getResources();
Drawable playOverlayDrawable = resources.getDrawable(R.drawable.play_overlay_large);                        
Drawable[] layers = new Drawable[2];
layers[0] = Drawable.createFromPath(tb.filePath);
layers[1] = playOverlayDrawable;
LayerDrawable layerDrawable = new LayerDrawable(layers);
ViewGroup.LayoutParams lp = iv.getLayoutParams();

int imageHeight = lp.height;
int imageWidth = lp.width;
int overlayHeight = layers[1].getIntrinsicHeight();
int overlayWidth = layers[1].getIntrinsicWidth();
int lR = (imageWidth - overlayWidth) / 2;
int top = imageHeight - (overlayHeight + 10);
int bottom = 10;
layerDrawable.setLayerInset(1, lR, top, lR, bottom);
iv.setImageDrawable(layerDrawable);

Это работает только тогда, когда ориентация изображения горизонтальна.Имейте в виду, что изображение / миниатюра имеет значение MINI_KIND, что означает, что оно должно быть 512 x 384, но я вижу, что это на самом деле не размер .. На моем телефоне они либо 480x800, либо 800x480, в зависимости от ориентации камерыбыл в .. Так как моя ширина / высота макета предопределена, я просто хочу, чтобы слой кнопки воспроизведения не масштабировался и выравнивал его одинаково каждый раз ..

Другой очевидный способ сделать этобыло бы использовать относительный макет (или, возможно, макет кадра?), но я надеялся избежать этого, так как я использую один и тот же код для отображения как изображений, так и видео (оба из которых имеют предварительный просмотр миниатюр изображений - но только видеона них должна быть кнопка воспроизведения).

Есть идеи, как выровнять слои по списку слоев, или альтернативы, которые будут работать так же хорошо или лучше?

Ответы [ 2 ]

21 голосов
/ 22 сентября 2011

В итоге я использовал FrameLayout следующим образом:

<FrameLayout 
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="3dp"
    android:layout_gravity="center_horizontal|center_vertical" >

<ImageView 
    android:id="@+id/MediaPreview"      
    android:layout_width="267dp"
    android:layout_height="201dp"
    android:scaleType="centerCrop"
    android:src="@drawable/loading" />

<ImageView
    android:id="@+id/VideoPreviewPlayButton"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:paddingBottom="10dp"
    android:layout_gravity="center_horizontal|bottom"
    android:visibility="gone"
    android:src="@drawable/play_overlay_large" />

</FrameLayout>

Затем я просто установил видимость View.VISIBLE для кнопки предварительного просмотра для видео и оставил ее для фотографий.Для моего списка я использовал метод списка слоев, показанный выше, потому что все миниатюры были одинакового размера.Надеюсь, что это поможет кому-то еще!

обратите внимание, что layout_gravity в ImageView с идентификатором VideoPreviewPlayButton помещает его внизу по центру по горизонтали, а paddingBottom на 10 дп немного перемещает его снизу вверх.

2 голосов
/ 21 сентября 2011

Рассмотрите возможность использования RelativeLayout в качестве контейнера для ваших представлений. Это дает вам свободу размещать взгляды детей. Вы можете привязать свою кнопку к правому или верхнему краю изображения.

...