How to create a view that is bigger than the screen?

Question

Is it possible to create a view that is bigger than the screen?

I need a view that has a bigger width then the screen of the device. I use this view in a rotation animation. During the rotation the parts that were not on the screen before animating the view will become visible.

Is there a way to achieve this effect with the android framework?

Update

I tried to set my parent layout much bigger then the screen and it is working. This will make somethings a little bit uncomfortable but it could work. The next problem now is that my layout still starts at the left side of the screen. I can't think of a method to make the layout to expand itself to the left and the right of the screen.

"I tried to set my parent layout much bigger then the screen and it is working" how did you do that? — Pacerier, Feb 14 '12 at 10:17

Janusz · Accepted Answer · 2012-02-15T06:44:02.980

Ok I got an answer. It is not very nice because it uses a deprecated View class but it works at least on my current testing screen resolution other resolutions are tested tomorrow.

I wrapped the view that I wanted to expand beyond the screen in an absolute layout like this:

<AbsoluteLayout
  android:layout_width="wrap_content"
  android:layout_height="fill_parent"
  android:layout_alignParentBottom="true">

  <ImageView
     android:id="@+id/content"
     android:layout_width="600dip"
     android:layout_height="420dip"
     android:scaleType="centerCrop"
     android:layout_x="-200dip"
     android:layout_y="60dip"
     android:src="@color/testcolor" />

</AbsoluteLayout>

The -200 x coordinate makes the view stick 200dip out of the left side of the screen. If I'm animating the view those parts that are outside the screen will gradually become visible.

It seems like wrapping ImageView in FrameLayout makes the negative margin possible. I don't understand why Android makes it such a pain just to place a view off-screen / partial-off-screen. — John, Mar 27 '15 at 08:03

riwnodennyk · Answer 2 · 2013-03-12T17:17:16.933

9

E.g. setting negative bottom margin together with setting extra large layout_height (large enough for you) solved the similar issue as for me.

Works fine at least using API 11+ animations/rotations.

Could look like:

android:layout_marginBottom="-1000dp" android:layout_height="1000dp"

edited Mar 12 '13 at 17:17

answered Mar 12 '13 at 17:05

riwnodennyk

8,140
4
35
37

Setting a negative margin is a weird to me, but it works fine and is one-line solution. – Jason Hartley Jun 14 '16 at 15:45
Negative margin works for a lot of views but it's is not officially supported https://developer.android.com/reference/android/R.attr#layout_margin – Allan Veloso Aug 25 '18 at 19:09

Jordy · Answer 3 · 2016-03-13T10:49:18.967

In case anyone still comes up on this page. The key is your root layout, it will only work with a FrameLayout (or the deprecated absolutelayout). Then you have two options to make your child view bigger.

through xml, this is quick and easy but you don't know the actual screen width & height in advance so your off with setting a ridiculously high value for layout_width & layout_height to cover all screens.
Calculate the screen size programatically and make the view's width/height proportional bigger to this..

Also be aware that your bigger view still starts in the top left corner of the screen so to account this you will have to give a negative top & left margin that's half of what you are adding to the view's width/height

FrameLayout.LayoutParams params = (FrameLayout.LayoutParams) viewToMakeBigger.getLayoutParams();
int marginLeft = (int) (viewToMakeBigger.getWidth()*0.1);
int marginTop = (int) (viewToMakeBigger.getHeight()*0.1); 
params.width = (int) (viewToMakeBigger.getWidth()*1.2);
params.height = (int) (viewToMakeBigger.getHeight()*1.2);
params.leftMargin = -marginLeft;    
params.topMargin = -marginTop;
viewToMakeBigger.setLayoutParams(params);

@JasonHartley, you ask "Have you tried using a negative margin?" Isn't that what the code in @Jordy's answer (`params.leftMargin = -marginLeft`, etc.) is doing? — CODE-REaD, Aug 02 '16 at 16:05
@JasonHartley, if you remove your comments I'll remove mine! Leave a comment like "removing in the next minute" first so I'll notice. Thanks. — CODE-REaD, Aug 05 '16 at 16:23
I spent 20 hours of my 40 hours work week, because of using Relative layout instead of Frame. Love you so much! — Рома Богдан, Jan 06 '21 at 01:27

fredley · Answer 4 · 2010-09-28T13:22:37.167

5

HorizontalScrollView:

http://developer.android.com/reference/android/widget/HorizontalScrollView.html

Layout container for a view hierarchy that can be scrolled by the user, allowing it to be larger than the physical display.

edited Sep 28 '10 at 13:22

answered Sep 28 '10 at 13:16

fredley

32,953
42
145
236

This should be marked as the correct answer as AbsoluteLayouts are deprecated – vosmith Dec 09 '15 at 20:51

score 4 · Answer 5 · answered Aug 07 '16 at 04:32

The simple axml below creates an ImageView that is 400dp wider than the screen (even though the layout_width is set to equal the parent's width) using a negative left and right margin of 200dp.

The ImageView is situated 250dp above the top of the screen using a negative top margin, with 450dp of 700dp vertical pixels visible on the screen.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
<ImageView
        android:background="#FFFF0000"
        android:layout_height="700dp"
        android:layout_marginLeft="-200dp"
        android:layout_marginRight="-200dp"
        android:layout_marginTop="-250dp"
        android:layout_width="match_parent" />
</RelativeLayout>

score 3 · Answer 6 · edited Apr 05 '22 at 11:14

3

You can override the views in the onMeasure method. This will set your View dimensions to 1000x1000 px.

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    setMeasuredDimension(1000, 1000);
}

edited Apr 05 '22 at 11:14

Bikram Kumar

393
1
4
15

answered Sep 30 '13 at 07:30

stoefln

14,498
18
79
138

onMeasure gets called a often tho – Jason Hartley Jun 14 '16 at 15:48

score 2 · Answer 7 · edited Apr 07 '22 at 08:12

2

Is it possible to create a view that is bigger than the screen?

Why not, you can define the layout_width and layout_height in px(or dip) as you want:

android:layout_width="10000px"
android:layout_height="20000px"

edited Apr 07 '22 at 08:12

Bikram Kumar

393
1
4
15

answered Sep 28 '10 at 13:17

Paresh Mayani

127,700
71
241
295

7

Yes but the parent layout of the view will clip the view if it gets bigger then they are. – Janusz Sep 28 '10 at 13:21
But you can use the padding of a layout with negative values that allows you to "scroll" inside. – WarrenFaith Sep 28 '10 at 13:29
Okay I was not very specific I updated my question, this could actually work but I have another problem now. – Janusz Sep 28 '10 at 13:33
Then apply those 10000px on parent layout. – Harry Jun 08 '15 at 04:07

score 1 · Answer 8 · answered Mar 22 '13 at 03:47

1

You need to change the size of the window, by getWindow().setLayout. This will increase the size for your window. Since the root layout can be as big as its parent you can then increase the size of the view you want to be bigger than the screen size. It works for me let me know

answered Mar 22 '13 at 03:47

Pulkit Sethi

1,325
1
14
22

Please check my answer it should make your surface view larger than screen – Pulkit Sethi Mar 24 '13 at 22:38

Rahim Rahimov · Answer 9 · 2015-11-19T16:36:49.833

You can do it programmatically:

    FrameLayout.LayoutParams rootViewParams = (FrameLayout.LayoutParams) rootView.getLayoutParams();
    rootViewParams.height=displayMetrics.heightPixels+(int)dpToPixels(60);
    rootViewParams.width=displayMetrics.widthPixels+(int)dpToPixels(60);
    rootView.setLayoutParams(rootViewParams);
    rootView.setX(rootView.getX() - dpToPixels(30));
    rootView.setY(rootView.getY() - dpToPixels(30));

MUST BE ONLY IN "public void onWindowFocusChanged(boolean hasFocus)" method.

and

        rootView = (RelativeLayout) findViewById(R.id.rootLayout);

Inside "protected void onCreate(Bundle savedInstanceState)" method.

Where yout .xml file is like this:

<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="match_parent"
    android:id="@+id/rootLayout"
    tools:context="com.example.Activity">

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_centerHorizontal="true"
    android:layout_margin="30dp"  
    android:layout_centerVertical="true"
    android:layout_height="match_parent">

    // Bla bla bla

</RelativeLayout>

and:

public float dpToPixels(float dp) {
    return TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, dp, context.getResources().getDisplayMetrics());
}

score 0 · Answer 10 · answered Sep 28 '10 at 13:16

0

You can use ViewSwitcher to handle that. Used with Animation and a OnGestureListener looks pretty good.

answered Sep 28 '10 at 13:16

WarrenFaith

57,492
25
134
150

I dont want to switch views I want a view that is rotating as the user rotates his phone and will show different parts of it depending on the phone orientation. – Janusz Sep 28 '10 at 13:23
Than I recommend what Paresh Mayani has suggested or a SurfaceView implementation... – WarrenFaith Sep 28 '10 at 13:29

How to create a view that is bigger than the screen?

10 Answers10

Linked