CODEWITHSUNDEEP
androidandroid-layoutlayoutandroid-linearlayoutsurfaceview
angel_30
angel_30

Reputation: 1

Nested Linear Layout in Android to evenly share height and width

I have a nested linear layout in my test Android app to achieve a 2x2 grid (one vertical and one horizontal), but I have problem making the cells evenly fill the whole screen. Currently I manually set the height as an arbitrary number (150dp). How can I fix it and make the height and width evenly be divided between the grid cells?

Basically I want any number of possible grid I have (2x3, 3x3, etc.) to evenly share the screen? (Each surfaceView is responsible to play a video. I had some problems using a grid layout)

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/linearlayout_0"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <LinearLayout
        android:id="@+id/linearlayout_10"
        android:layout_width="fill_parent"
        android:layout_height="150dp"
        android:orientation="horizontal" >

        <SurfaceView
            android:id="@+id/video_11_surfaceview"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1" />

        <SurfaceView
            android:id="@+id/video_12_surfaceview"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/linearlayout_11"
        android:layout_width="match_parent"
        android:layout_height="150dp"
        android:orientation="horizontal" >

        <SurfaceView
            android:id="@+id/video_21_surfaceview"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1" />

        <SurfaceView
            android:id="@+id/video_22_surfaceview"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1" />
    </LinearLayout>

</LinearLayout>

Upvotes: 0

Views: 616

Answers (1)

Cheticamp
Cheticamp

Reputation: 62841

Set layout_weight for the inner LinearLayout as follows:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/linearlayout_0"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

<LinearLayout
    android:id="@+id/linearlayout_10"
    android:layout_width="fill_parent"
    android:layout_height="0dp"
    android:layout_weight="1"
    android:orientation="horizontal">

    <SurfaceView
        android:id="@+id/video_11_surfaceview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1" />

    <SurfaceView
        android:id="@+id/video_12_surfaceview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1" />
</LinearLayout>

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

    <SurfaceView
        android:id="@+id/video_21_surfaceview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1" />

    <SurfaceView
        android:id="@+id/video_22_surfaceview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1" />
</LinearLayout>

This works, but you may want to look at GridLayout.

Upvotes: 1

Related Questions