Reputation: 483
I am making a login screen for my Android app and was wondering how can I use a video as a background rather than having an image or simple colors?
I want to make it similar to the Spotify / Bible app login screen where they have a video playing and you have buttons to sign in or register.
Images -
(Click image to enlarge)
Upvotes: 33
Views: 43925
Reputation: 3963
NatureDevil answer and video is great but 2 things are missing first if you click on a button and open a new activity like sing-up and decided to click on back arrow on the device, the home screen will give black screen because the video will not restart so you need to add this
@Override
protected void onResume() {
super.onResume();
// to restart the video after coming from other activity like Sing up
mVideoView.start();
}
other thing for the VideoView to stretch from left to right full screen add:
android:layout_alignParentEnd="true"
android:layout_alignParentStart="true"
Upvotes: 5
Reputation: 947
You just need a few steps to set the video as the background of your app.
VideoView videoview = (VideoView) findViewById(R.id.videoview); Uri uri = Uri.parse("android.resource://"+getPackageName()+"/"+R.raw.test); videoview.setVideoURI(uri); videoview.start();I have made a video that explains how to create JOOX login screen in android which looks more or less like the Spotify app. Feel free to check it out and let me know if it helps :)
Upvotes: 42
Reputation: 656
First make new XML
and add the VideoView
inside it:
my_video_background.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<VideoView
android:id="@+id/videoView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:layout_alignParentTop="true"
android:layout_gravity="center" />
</RelativeLayout>
Then include this file inside your main layout that have Buttons
, let's say:
splash.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#29000000">
<include layout="@layout/my_video_background" />
<!--Like Spotify image-->
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="46dp"
android:src="@android:drawable/ic_dialog_map" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="horizontal">
<Button
android:id="@+id/login"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:background="#FF2D2D2D"
android:text="LOG IN"
android:textColor="@android:color/white" />
<Button
android:id="@+id/signUp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:background="#FF669900"
android:text="SIGN IN"
android:textColor="@android:color/white" />
</LinearLayout>
</RelativeLayout>
That's it!
Upvotes: 10