Cote Mounyo
Cote Mounyo

Reputation: 13975

android -- hide part of linear layout off-screen to the right

I have two linear layouts inside a parent linear layout. all horizontal. I want all of l_child to show and part of r_child to show; while the rest of r_child will be off-screen to the right. How do I accomplish that?

<LinearLayout

    android:orientation="horizontal" >

    <LinearLayout
        android:id="@+id/l_child"
        android:orientation="horizontal" >
    </LinearLayout>

    <LinearLayout
        android:id="@+id/r_child"
        android:orientation="horizontal" >
    </LinearLayout>

</LinearLayout>

Upvotes: 1

Views: 4315

Answers (4)

eski
eski

Reputation: 7905

Layout weights are only for distributing layouts to fill a view, so no overflowing can be done this way.

Assigning layout_width with density independent pixels will result in varied success for different size devices.

So I believe you would have more success adding your layouts programmatically based on the screen size.

See this post for getting the screen width: Get screen dimensions in pixels

Once you have the screen width, you can assign the inner-layout dimensions by pixels (with LinearLayout.LayoutParams), calculated as percentages of the screen width.

If you want the left layout to take up 80% of the screen, use .8*screen_width for the size, and if you want the right layout to then overflow by 20% of the screen, use .4*screen_width for that size.

Upvotes: 0

Bartek Filipowicz
Bartek Filipowicz

Reputation: 1235

Try giving the parent LinearLayout a negative right margin.

android:layout_marginRight="-50dp" 

Other solution might be to put the parent LinearLayout inside a ScrollView, and set the widths of children layouts to the desired width. In this case, you'll be able to scroll the right layout back to the screen.

Upvotes: 6

Android Noob
Android Noob

Reputation: 3341

You can try using ViewPager, but I don't know if you can get the "bleeding canvas" effect that you're describing using that UI component.

EDIT: Maybe you can try using Gallery widget.

Is this what you're describing?

http://www.bangkokpost.com/media/content/20110915/309542.jpg

Upvotes: 0

Emmanuel
Emmanuel

Reputation: 13233

Do you mean something like this

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_weight="1"
android:orientation="horizontal"
>

<LinearLayout
    android:layout_width="0dp"
    android:layout_weight="1"
    android:layout_height="70dp"
    android:layout_gravity="center_horizontal|top">

    <ImageView
        android:layout_width="48dp"
        android:layout_height="48dp"
        android:id="@+id/imageView1"
        android:src="@drawable/ic_launcher"
        />
    <ImageView
        android:layout_width="48dp"
        android:layout_height="48dp"
        android:id="@+id/imageView2"
        android:src="@drawable/ic_launcher"/>
    <ImageView
        android:layout_width="48dp"
        android:layout_height="48dp"
        android:id="@+id/imageView3"
        android:src="@drawable/ic_launcher"/>
</LinearLayout>

<LinearLayout
    android:layout_width="0dp"
    android:layout_weight="1"
    android:layout_height="70dp"
    android:layout_gravity="center_horizontal|top">


    <ImageView
        android:layout_width="48dp"
        android:layout_height="48dp"
        android:id="@+id/imageView1"
        android:layout_marginRight="200dp"
        android:src="@drawable/ic_launcher"/>
    <ImageView
        android:layout_width="48dp"
        android:layout_height="48dp"
        android:id="@+id/imageView2"
        android:src="@drawable/ic_launcher"/>
    <ImageView
        android:layout_width="48dp"
        android:layout_height="48dp"
        android:id="@+id/imageView3"
        android:src="@drawable/ic_launcher"/>
</LinearLayout>
</LinearLayout>

Upvotes: 0

Related Questions