eneim / toro

Video list auto playback made simple, specially built for RecyclerView

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Audio is playing but video shows black screen

merchsquare-dev opened this issue · comments

I am using toro3 to play videos in my recyclerview( I am using toro Container). This is how my gradle looks like

 ...
//Exo Video player
implementation 'com.google.android.exoplayer:exoplayer:2.10.6'
//toro player
implementation 'im.ene.toro3:toro:3.7.0.2010003'
implementation 'im.ene.toro3:toro-ext-exoplayer:3.7.0.2010003' 
.....

This is the link to one of my videos(all videos in my adapter are not working and this is one of them).
https://dkadf2kfhfqn2.cloudfront.net/videos/metice_2020-10-19_20:08:14.mp4

this is how my Adapter looks like

`class PagingRecommendedAdapter(val context: Context) : PagingDataAdapter<EventData, RecyclerView.ViewHolder>(COMPARATOR) {
var lastClick: Long = 0;

companion object {
    private val COMPARATOR = object : DiffUtil.ItemCallback<EventData>() {
        override fun areItemsTheSame(oldItem: EventData, newItem: EventData): Boolean {
            return oldItem.eventPermlink == newItem.eventPermlink
        }

        override fun areContentsTheSame(oldItem: EventData, newItem: EventData): Boolean {
            return oldItem.eventPermlink == newItem.eventPermlink
        }
    }
}

override fun onBindViewHolder(holder: RecyclerView.ViewHolder, position: Int) {
    if (holder is RecommendedHolder) {
        val eventData = getItem(position)!!
        holder.binding.event = eventData
        if (eventData.eventMedia.size > 0) {
            val medias = eventData.eventMedia
            if (eventData.eventMediaType == 1) {
                holder.binding.imageSlider.visibility = View.VISIBLE
                holder.binding.player.visibility = View.INVISIBLE
                //smart slider
                val smartSlider = SmartSliderAdapter(medias, context)
                holder.binding.imageSlider.setSliderAdapter(smartSlider)
                holder.binding.imageSlider.apply {
                    setIndicatorAnimation(IndicatorAnimationType.WORM);
                    setSliderTransformAnimation(SliderAnimations.SIMPLETRANSFORMATION);
                    startAutoCycle();
                }
            } else {
                holder.binding.imageSlider.visibility = View.INVISIBLE
                holder.binding.player.visibility = View.VISIBLE
                holder.binding.thumbnail.visibility = View.VISIBLE
                Glide.with(context).load(eventData.eventMedia[0].mediaThumbnail).centerCrop().error(R.drawable.ic_default_product).into(holder.binding.thumbnail)
            }
        }
    }
}

override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): RecyclerView.ViewHolder {
    val view = LayoutInflater.from(context).inflate(R.layout.recommended_layout, parent, false)
    return RecommendedHolder(view, this)
}

inner class RecommendedHolder(view: View, val adapter: PagingRecommendedAdapter) : RecyclerView.ViewHolder(view), View.OnClickListener, ToroPlayer, ToroPlayer.EventListener {
    val binding: RecommendedLayoutBinding

    var helper: ExoPlayerViewHelper? = null
    private var listener: Playable.EventListener = object : Playable.DefaultEventListener() {
        override fun onPlayerStateChanged(playWhenReady: Boolean, playbackState: Int) {
            super.onPlayerStateChanged(playWhenReady, playbackState)
            val active = playbackState > Player.STATE_IDLE && playbackState < Player.STATE_ENDED
            playerView.keepScreenOn = active
        }
    }

    init {
        binding = RecommendedLayoutBinding.bind(view)
    }

    override fun onClick(v: View?) {
    }

    override fun getPlayerView(): View {
        return binding.player
    }

    override fun getCurrentPlaybackInfo(): PlaybackInfo {
        return if (helper != null) helper!!.latestPlaybackInfo else PlaybackInfo()
    }

    override fun initialize(container: Container, playbackInfo: PlaybackInfo) {
        if (helper == null) {
            val config = Config.Builder().setMediaSourceBuilder(MediaSourceBuilder.LOOPING)
                .build() //this is use for lopping

            val event = binding.event!!

            if (event.eventMediaType == 2) {
                helper = ExoPlayerViewHelper(this, Uri.parse(event.eventMedia[0].mediaUrl), null, config)
                binding.imageSlider.visibility = View.INVISIBLE
                PlayerSelector.DEFAULT //to disable autoplay use PlayerSelector.NONE
                helper?.addEventListener(listener)
                helper?.addPlayerEventListener(this)
                helper?.initialize(container, playbackInfo)
                binding.player.setKeepContentOnPlayerReset(true)
                Dlog.e("Player Initialized: ${event.eventMedia[0].mediaUrl}")
            }
        }
    }

    override fun play() {

        if (helper != null) {
            helper?.play()
        }
        binding.thumbnail.visibility = View.GONE
        binding.player.exo_volume_up.performClick()
        Dlog.e("Play()")
    }

    override fun pause() {
        binding.thumbnail.visibility = View.VISIBLE
        if (helper != null) helper?.pause()
        Dlog.e("pause()")
    }

    override fun isPlaying(): Boolean {
        Dlog.e("isPlaying()")
        return helper != null && helper!!.isPlaying

    }

    override fun release() {
        if (helper != null) {
            helper?.removeEventListener(listener)
            helper?.removePlayerEventListener(this)
            helper?.release()
            helper = null
            Dlog.e("release()")
        }
    }

    override fun wantsToPlay(): Boolean {
        Dlog.e("wantsToPlay()")
        return ToroUtil.visibleAreaOffset(this, binding.root.parent) >= 0.65
    }

    override fun getPlayerOrder(): Int {
        Dlog.e("getPlayerOrder: ${adapterPosition}")
        return adapterPosition
    }

    override fun onFirstFrameRendered() {
        Dlog.e("onFirstFrameRendered()")
        binding.thumbnail.visibility = View.GONE
    }

    override fun onBuffering() {
        Dlog.e("onBuffering")
        binding.thumbnail.visibility = View.GONE
    }

    override fun onPlaying() {
        Dlog.e("onPlaying()")
        binding.thumbnail.visibility = View.GONE
    }

    override fun onPaused() {
        Dlog.e("onPaused()")
        binding.thumbnail.visibility = View.VISIBLE
    }

    override fun onCompleted() {
        Dlog.e("onCompleted()")
        binding.thumbnail.visibility = View.VISIBLE
    }


}

}`

I couldn't figure out where the problem is.

In case you wanna see my layout, here it is

`

<data>

    <variable
        name="event"
        type="com.merchsquare.sellist.mainpage.model.EventData" />
</data>

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <com.merchsquare.sellist.utils.views.RoundedRelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="@dimen/_12dp"
        app:bottomLeftCornerRadius="@dimen/_8dp"
        app:bottomRightCornerRadius="@dimen/_8dp"
        app:topLeftCornerRadius="@dimen/_8dp"
        app:topRightCornerRadius="@dimen/_8dp">


        <com.smarteist.autoimageslider.SliderView
            android:id="@+id/imageSlider"
            android:layout_width="match_parent"
            android:layout_height="328dp"
            app:sliderAnimationDuration="600"
            app:sliderAutoCycleDirection="back_and_forth"
            app:sliderAutoCycleEnabled="true"
            app:sliderIndicatorAnimationDuration="600"
            app:sliderIndicatorGravity="top|end"
            app:sliderIndicatorMargin="0dp"
            app:sliderIndicatorMarginLeft="0dp"
            app:sliderIndicatorOrientation="horizontal"
            app:sliderIndicatorPadding="3dp"
            app:sliderIndicatorRadius="2dp"
            app:sliderIndicatorSelectedColor="@color/black"
            app:sliderIndicatorUnselectedColor="@color/white"
            app:sliderScrollTimeInSec="5"
            app:sliderStartAutoCycle="true" />

        <com.google.android.exoplayer2.ui.PlayerView
            android:id="@+id/player"
            android:layout_width="match_parent"
            android:layout_height="328dp"
            android:layout_alignStart="@id/imageSlider"
            android:layout_alignTop="@id/imageSlider"
            android:layout_alignEnd="@id/imageSlider"
            android:layout_alignBottom="@id/imageSlider"
            app:player_layout_id="@layout/player_custom_view"
            app:resize_mode="zoom"
            app:show_buffering="always"
            app:surface_type="texture_view"
            app:use_controller="true"
            android:visibility="visible">
            <ImageView
                android:id="@+id/thumbnail"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:adjustViewBounds="true"
                android:scaleType="centerCrop"
                android:visibility="gone" />

        </com.google.android.exoplayer2.ui.PlayerView>

        <View
            android:id="@+id/center"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_centerHorizontal="true" />

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginStart="@dimen/_16dp"
            android:layout_toLeftOf="@id/center"
            android:paddingVertical="@dimen/_12dp">

            <RelativeLayout
                android:id="@+id/user_layout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="@drawable/rounded_white_bg"
                android:gravity="start"
                android:paddingHorizontal="@dimen/_8dp"
                android:paddingVertical="6dp"
                app:bottomLeftCornerRadius="@dimen/_4dp"
                app:bottomRightCornerRadius="@dimen/_4dp"
                app:topLeftCornerRadius="@dimen/_4dp"
                app:topRightCornerRadius="@dimen/_4dp">

                <com.merchsquare.sellist.utils.views.RoundedImageView
                    android:id="@+id/user_image"
                    android:layout_width="14dp"
                    android:layout_height="14dp"
                    android:layout_centerVertical="true"
                    android:src="@drawable/ic_default_product" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginStart="@dimen/_8dp"
                    android:layout_toEndOf="@id/user_image"
                    android:ellipsize="end"
                    android:fontFamily="@font/roboto_regular"
                    android:singleLine="true"
                    android:text="@{event.eventUserName}"
                    android:textColor="@color/_75_grey600"
                    android:textSize="14sp" />
            </RelativeLayout>
        </RelativeLayout>

        <RelativeLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignBottom="@id/imageSlider"
            android:layout_centerHorizontal="true"
            android:paddingVertical="@dimen/_12dp">

            <com.merchsquare.sellist.utils.views.RoundedRelativeLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerHorizontal="true"
                android:background="@drawable/rounded_white_bg"
                android:gravity="center"
                android:paddingHorizontal="@dimen/_16dp"
                app:bottomLeftCornerRadius="@dimen/_4dp"
                app:bottomRightCornerRadius="@dimen/_4dp"
                app:topLeftCornerRadius="@dimen/_4dp"
                app:topRightCornerRadius="@dimen/_4dp">

                <TextView
                    android:id="@+id/event_name"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_centerVertical="true"
                    android:ellipsize="end"
                    android:fontFamily="@font/roboto_condensed_bold"
                    android:singleLine="true"
                    android:text="@{event.eventName}"
                    android:textColor="@color/_42"
                    android:textSize="13sp"
                    android:textStyle="bold" />

                <TextView
                    android:id="@+id/event_duration"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignBaseline="@id/event_name"
                    android:layout_centerVertical="true"
                    android:layout_marginStart="@dimen/_16dp"
                    android:layout_toEndOf="@id/event_name"
                    android:background="@drawable/event_amber100_bg"
                    android:fontFamily="@font/roboto_condensed_bold"
                    android:letterSpacing="0.08"
                    android:lineHeight="12sp"
                    android:paddingHorizontal="8dp"
                    android:paddingVertical="2dp"
                    android:text="@{event.eventDuration}"
                    android:textColor="@color/_21"
                    android:textSize="11sp" />

                <ImageView
                    android:id="@+id/save_wishlist"
                    android:layout_width="@dimen/_48dp"
                    android:layout_height="@dimen/_48dp"
                    android:layout_centerVertical="true"
                    android:layout_toEndOf="@id/event_duration"
                    android:src="@drawable/ic_wishlist_off" />
            </com.merchsquare.sellist.utils.views.RoundedRelativeLayout>
        </RelativeLayout>

    </com.merchsquare.sellist.utils.views.RoundedRelativeLayout>


</RelativeLayout>

`

Wierdly, It was due to my custom layout i.e., RoundedRelativeLayout. After I changed it to RelativeLayout, it worked well.