adjust android videoview height to half of the screen in portrait mode

Question

I guess this might be easy but Please i need help, i have a video view that i want the height to get to the middle of the screen on any device, but what am currently doing is not doing that. when in portrait mode i want the video view to start from the top of screen to the middle of the screen in any device when in portrait mode, i think the video view is not suppose to have a fixed height, because this might vary on different device, this is the code am trying.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >

<VideoView
    android:id="@+id/videoview"
    android:layout_width="match_parent"
    android:layout_height="280dip"
    android:layout_alignParentLeft="true"
    android:layout_alignParentRight="true"
    android:layout_alignParentTop="true"
    android:layout_centerHorizontal="true"
    android:layout_centerInParent="true" >
</VideoView>

<LinearLayout
    android:id="@+id/linearLayout"
    android:layout_width="fill_parent"
    android:layout_height="30dp"
    android:layout_alignParentLeft="true"
    android:layout_below="@+id/videoview"
    android:background="@drawable/top_bar"
    android:orientation="horizontal" >

    <LinearLayout
        android:id="@+id/settings"
        android:layout_width="50dp"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="vertical"
        android:paddingBottom="5dp"
        android:paddingTop="5dp" >

        <ImageView
            android:id="@+id/set"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:contentDescription="@string/desc"
            android:src="@drawable/settings" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/low_tab"
        android:layout_width="70dp"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="vertical"
        android:paddingBottom="5dp"
        android:paddingTop="5dp" >

        <ImageView
            android:id="@+id/low"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:contentDescription="@string/desc"
            android:src="@drawable/low" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/high_tab"
        android:layout_width="80dp"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="vertical"
        android:paddingBottom="5dp"
        android:paddingTop="5dp" >

        <ImageView
            android:id="@+id/high"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:contentDescription="@string/desc"
            android:src="@drawable/high" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/audio_tab"
        android:layout_width="70dp"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="vertical"
        android:paddingBottom="5dp"
        android:paddingTop="5dp" >

        <ImageView
            android:id="@+id/audio"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:contentDescription="@string/desc"
            android:src="@drawable/audio" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/full_screen"
        android:layout_width="30dp"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="vertical"
        android:paddingBottom="5dp"
        android:paddingTop="5dp" >

        <ImageView
            android:id="@+id/full"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:contentDescription="@string/desc"
            android:src="@drawable/full" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/fresh"
        android:layout_width="30dp"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="vertical"
        android:paddingBottom="5dp"
        android:paddingTop="5dp" >

        <ImageView
            android:id="@+id/refresh"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:contentDescription="@string/desc"
            android:src="@drawable/refresh" />
    </LinearLayout>
</LinearLayout>

<LinearLayout
    android:id="@+id/linearLayout1"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_below="@+id/linearLayout"
    android:background="@drawable/comment_bar"
    android:orientation="horizontal" >

    <LinearLayout
        android:id="@+id/liveblog_tab"
        android:layout_width="80dp"
        android:layout_height="wrap_content"
        android:background="@drawable/select"
        android:gravity="center"
        android:orientation="vertical"
        android:paddingBottom="5dp"
        android:paddingTop="5dp" >

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:contentDescription="@string/desc"
            android:src="@drawable/live_blog" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/addcom_tab"
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        android:background="@drawable/select"
        android:gravity="center"
        android:orientation="vertical"
        android:paddingBottom="5dp"
        android:paddingLeft="15dp"
        android:paddingTop="5dp" >

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:contentDescription="@string/desc"
            android:src="@drawable/add_comment" />
    </LinearLayout>
</LinearLayout>

<RelativeLayout
    android:id="@+id/main_content"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_below="@+id/linearLayout1"
    android:orientation="vertical" >

    <FrameLayout
        android:id="@+id/frame"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_alignLeft="@+id/linearLayout1"
        android:layout_centerVertical="true" >

        <LinearLayout
            android:id="@+id/liveblog"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical" >

            <WebView
                android:id="@+id/browser"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent" >
            </WebView>
        </LinearLayout>

        <LinearLayout
            android:id="@+id/comments"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical" >
        </LinearLayout>
    </FrameLayout>
</RelativeLayout>

osayilgan · Accepted Answer · 2013-08-12T14:21:20.587

I have written something that can solve your problem. You can do this as well on run time but If you want to do it inside XML here is the code.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:weightSum="100" >

<VideoView
    android:id="@+id/videoview"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="50" >
</VideoView>

<LinearLayout
    android:id="@+id/linearLayout"
    android:layout_width="fill_parent"
    android:layout_height="0dp"
    android:layout_weight="10"
    android:background="@android:color/black"
    android:orientation="horizontal" >

    <LinearLayout
        android:id="@+id/settings"
        android:layout_width="50dp"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="vertical"
        android:paddingBottom="5dp"
        android:paddingTop="5dp" >

        <ImageView
            android:id="@+id/set"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/low_tab"
        android:layout_width="70dp"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="vertical"
        android:paddingBottom="5dp"
        android:paddingTop="5dp" >

        <ImageView
            android:id="@+id/low"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/high_tab"
        android:layout_width="80dp"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="vertical"
        android:paddingBottom="5dp"
        android:paddingTop="5dp" >

        <ImageView
            android:id="@+id/high"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/audio_tab"
        android:layout_width="70dp"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="vertical"
        android:paddingBottom="5dp"
        android:paddingTop="5dp" >

        <ImageView
            android:id="@+id/audio"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/full_screen"
        android:layout_width="30dp"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="vertical"
        android:paddingBottom="5dp"
        android:paddingTop="5dp" >

        <ImageView
            android:id="@+id/full"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/fresh"
        android:layout_width="30dp"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="vertical"
        android:paddingBottom="5dp"
        android:paddingTop="5dp" >

        <ImageView
            android:id="@+id/refresh"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </LinearLayout>
</LinearLayout>

<LinearLayout
    android:id="@+id/linearLayout1"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="20"
    android:orientation="horizontal" >

    <LinearLayout
        android:id="@+id/liveblog_tab"
        android:layout_width="80dp"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="vertical"
        android:paddingBottom="5dp"
        android:paddingTop="5dp" >

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/addcom_tab"
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="vertical"
        android:paddingBottom="5dp"
        android:paddingLeft="15dp"
        android:paddingTop="5dp" >

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </LinearLayout>
</LinearLayout>

<FrameLayout
    android:id="@+id/frame"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="20" >

    <LinearLayout
        android:id="@+id/liveblog"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical" >

        <WebView
            android:id="@+id/browser"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent" >
        </WebView>
    </LinearLayout>

    <LinearLayout
        android:id="@+id/comments"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical" >
    </LinearLayout>
</FrameLayout>

</LinearLayout>

thank you for your quick response, i will try it and if it works i will accept your answer immediately — blessed, Aug 12 '13 at 13:21
i have tried the code and it didnt work, the videoview is suppose to start from the top of the screen device to the middle of the device screen depening on the device the user is using, i have button and other layout below the videoview but the videoview is suppose to occupy from the top to the middle depending the users device. thank you — blessed, Aug 12 '13 at 13:33
I'm 100% sure that this code is working. If you send me your layout code then I can insert it into your layout. I cannot help you without seeing your code. — osayilgan, Aug 12 '13 at 13:41
ok, i will edit my code again to the full code so you can see it, thanks — blessed, Aug 12 '13 at 13:43
i have edit my code to the full code, you can check my edited code on top, so what i want is for the videoview height to start from the top to the middle of the screen of any device, thank you — blessed, Aug 12 '13 at 13:45
@blessed I have editted my code, see my edited answer. I have removed some of your backgrounds and content descriptions to edit the file easier you can add it back. — osayilgan, Aug 12 '13 at 14:17
and I have set the Heights based on percentage. First one (VideoView) is 50% and the rest is 10%, 20%, 20%. You can change it by changing the layout_weight. — osayilgan, Aug 12 '13 at 14:19
Okay, thank you, i will try this again, as soon as it works, i will accept your answer — blessed, Aug 12 '13 at 14:20
it worked!!!! Thank you so much for taking time to answer me question, you saved me time and am so grateful for this — blessed, Aug 12 '13 at 14:46
Your welcome. Bytheway I've seen that you are putting some horizontal tabs by giving exact width to layouts. You can do the same approach for your tabs. You can use layout_weight to set their dimensions. — osayilgan, Aug 12 '13 at 14:56
@osayigan just a quick observation on my videoview, i observed that my videoview width is not completely fitting the width of the screen, my videoview showing is not entirely covering the videoview — blessed, Aug 13 '13 at 13:52
@blessed If you can send me your Layout codes and a screen shot which shows that it doesn't fit, I can take a look. — osayilgan, Aug 13 '13 at 14:15
thank you for your support, people like you are rare to find. I have upload the screenshot, xml and java file for you to take a look, looking forward to your response.In the videoview of the screenshot you can see the video stream not fitting properly the width of the videoview.thank you.kindly find link below here: http://videoshare.loveworldapis.com/HomeActivity.java http://videoshare.loveworldapis.com/Screenshot.png http://videoshare.loveworldapis.com/home.xml — blessed, Aug 13 '13 at 17:37
@blessed as far as I see, you are expecting to have exactly the same width for videoView with your actual video's width. This is not possible If you want the VideoView covers %50 of your screen. You need to choose one of them. If you make the Video Covers your screen width then you need to set the height of your Video View as wrap_content. But in this way its not guaranteed that you will get %50 of your screen's height. — osayilgan, Aug 14 '13 at 09:26
what you can do is, keep it like this but set background color to black if you want to cover %50 of your screen height. — osayilgan, Aug 14 '13 at 09:28
thank you for always been there, am so so grateful to people like you that help out at times like this, just one more thing if i decise to leave it like this when i change orientation to landscape the video becomes extremely small, but my intention in landscape is to make it go fullscreen. — blessed, Aug 14 '13 at 09:51
Thanks. You need to listen orientation changes inside your activity. [Here](http://stackoverflow.com/questions/4434027/android-videoview-orientation-change-with-buffered-video) is a SOF question and a solution with it. You can switch to full screen on the orientation Change method. — osayilgan, Aug 14 '13 at 10:22
@sayilgan, i tried the link you sent, but am having issues implementing it on my own, so i have used the opportunity to ask another question on stackoverflow here is the link i will gladly accept your answer if it works, all i want to do now is for the video to fill in landscape mode like the link to the youtube you sent me, you can also make reference to the link i sent previous to understand my code completely, thank you so much: http://stackoverflow.com/questions/18227255/android-video-not-fitting-the-width-in-portrait-of-the-videoview-and-not-occupyi — blessed, Aug 14 '13 at 17:54

adjust android videoview height to half of the screen in portrait mode

1 Answers1