CODEWITHSUNDEEP
androidandroid-layoutyoutube-api
Puneet Chugh
Puneet Chugh

Reputation: 93

How to play youtube video upon click of an image?

I am working on an application on Android in which I want to play a youtube video upon the click of an image. I don't want to move onto a different activity or screen.

Plus I don't want the video to take any extra space other than the space allocated to image.

Could someone suggest any solution ? I didn't find any post regarding Android.

Upvotes: 1

Views: 439

Answers (2)

Puneet Chugh
Puneet Chugh

Reputation: 93

Thanks for the help. That did work well for my app. Let me explain how I finally did it. For this purpose we need Relative Layout in which we can overlap the views. I have overlapped ImageView and youtubeView. Initially, I have set ImageView as VISIBLE and youtubeView as INVISIBLE. And in View.onClickListener for the ImageView, I have made ImageView as INVISIBLE and youtubeView as VISIBLE. That works well for me.

Note : Overlapping of views is only possible in RelativeLayout not in any other Layout unless you want to create your own custom Layouts.

    <RelativeLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="?android:attr/listPreferredItemHeight"
        android:paddingStart="@dimen/activity_horizontal_margin_less"
        android:paddingRight="@dimen/activity_horizontal_margin_less"
        android:paddingTop="@dimen/activity_vertical_margin_less"
        android:paddingBottom="@dimen/activity_vertical_margin_less"
        tools:context="com.example.puneet.movieout.MovieInfoDisplay"
        >


        <TextView
            android:layout_width="wrap_content"
            android:id="@+id/textView2"
            android:layout_height="wrap_content"
            android:layout_alignParentTop="true"
            android:text="I am Puneet Chugh. I am Puneet Chugh"
            android:layout_centerHorizontal="true"
            android:textSize="24sp"
            android:textStyle="bold"
            android:textColor="@color/black"/>

        <com.google.android.youtube.player.YouTubePlayerView
            android:id="@+id/youtube_view"
            android:layout_below="@+id/textView2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"

        />
        <ImageView
            android:layout_marginTop="10dp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerHorizontal="true"
            android:id="@+id/imageView"
            android:layout_below="@+id/textView2"/>
    </RelativeLayout>

The activity part :

    youTubeView.setVisibility(View.INVISIBLE);

    moviePoster.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {

            moviePoster.setVisibility(View.INVISIBLE);
            youTubeView.setVisibility(View.VISIBLE);
        }
    });

Upvotes: 1

Sel&#231;uk Cihan
Sel&#231;uk Cihan

Reputation: 2034

Assuming in the OnClickListener, you catch the click event:

1) You would make the image invisible by calling setVisibility(View.GONE) on it.

2) You would have a VideoFragment class that extends YouTubePlayerSupportFragment and it would be contained in an invisible container, so you call

VideoFragment videoFragment = (VideoFragment) getFragmentManager().findFragmentById(R.id.video_fragment_container);
videoFragment.setVideoId(videoId);
container.setVisibility(View.VISIBLE);

For the details, take a look at the sample applications.

Upvotes: 1

Related Questions