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.
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.
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"
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);
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.
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>
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);
}
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"
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
You can use ViewSwitcher to handle that. Used with Animation and a OnGestureListener looks pretty good.
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());
}
Related
I'm developing an Android app with avatar (the image icon), the ImageView is inside an RelativeLayout like this
<ImageView
android:id="#+id/indicators"
android:layout_width="#dimen/conversation_avatar_size"
android:layout_height="#dimen/conversation_list_left_indicator_height"
android:layout_below="#id/contact_image"
android:layout_alignWithParentIfMissing="true"
android:layout_marginEnd="#dimen/smaller_def_margin"
android:layout_marginTop="#dimen/smaller_def_margin"
android:scaleType="fitCenter"
tools:src="#drawable/ic_reply"/>
However, I cannot change the width of this ImageView when I make the contact_image invisible because indicator takes less space. The code is like below
indicators.getLayoutParams().width = width;
indicatorsWidth = indicators.getWidth();
indicators.requestLayout();
After indicators.requestLayout(); the width of the indicator still keeps the old one not changed to width. I'm wondering why this can happen? I also tried indicators.setLayoutParams(layoutParams); but still doesn't work.
I did find some interesting, even though indicators.getWidth() is still the old value, indicators.getLayoutParams().width is the new width now, and ImageView size doesn't change at all.
Update : I found what view.getWidth() is, and then I used indicators.setLeft() and indicators.setRight(), this time indicators.getWidth() is also the new width, however, the size still doesn't change, I checked it and found that indicators.getMeasuredWidth() is still the old value, any idea?
Your issue may be android:scaleType="fitCenter" if the height of the ImageView is the constraining factor. The view will be resized to fit the height and maintain the aspect ratio by adjusting the width. See this.
Compute a scale that will maintain the original src aspect ratio, but will also ensure that src fits entirely inside dst. At least one axis (X or Y) will fit exactly. The result is centered inside dst.
Here is a small app to play with this concept. You will see that even though the width is change, the height is not with android:scaleType="fitCenter". If you change it to android:scaleType="fitXY", you will see a change. This may not be your issue exactly, but you can use this code which is an MCVE to test out some ideas.
MainActivity.java
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
final ImageView indicators = findViewById(R.id.indicators);
indicators.postDelayed(new Runnable() {
#Override
public void run() {
indicators.getLayoutParams().width = 500;
indicators.requestLayout();
}
}, 2000);
}
}
activity_main.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/parent"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/indicators"
android:layout_width="100px"
android:layout_height="100px"
android:layout_alignWithParentIfMissing="true"
android:scaleType="fitCenter"
android:src="#mipmap/ic_launcher"/>
</RelativeLayout>
When modifying LayoutParams, you have to reassign the object back to the view or there will be no effect.
ViewGroup.LayoutParams params = myView.getLayoutParams();
params.width = newWidth;
myView.setLayoutParams(params);
This last line is what actually changes the width of the view.
I have a text view with a height which wraps content and a width that matches parent. So that the textView width == the screen Width.
But at one point I want the text to rotate 90 degrees.
Now I want to be able to change the views width so that it is the devices height instead of width.
This would cause that the width would expand.
(Basically like when one does orientation changes, but I can´t just have an orientation change for only one textview so I have to rotate it.)
My problem: I can´t set the textViews width larger than the device width.
Even when I am already done with the animation.
So is it possible to make the textView width larger than the device width?
and if not can anyone please suggest how I could solve my problem because I really need to change the orientation of the textView...
EDIT----EDIT
Is there a way to create a landscape text view and put it in a portait activity? That would completly solve my problems of the last week...
EDIT
My fragment:
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/f"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/t"
/>
</RelativeLayout>
I tried different things like
fragment.setRotation(90);
LayoutParams params = fragment.getLayoutParams();
params.height = text.getHeight();
params.width = deviceHeight;
fragment.setLayoutParams(params);
LayoutParams params1 = text.getLayoutParams();
params1.height = text.getHeight();
params1.width = deviceHeight;
text.setLayoutParams(params1);
EDIT________EDIT
Or has anyone ever written something like a verticalTExtView Class?
You can set the attributes of TextView as android:singleLine="true" and android:layout_width="wrap_content" and android:layout_height="wrap_content" // incase if you do not want the height to be increashed so singleLine is making the text to go out of screen width then you will need ScrollView for such behavior.
Hope this helps.
EDIT: I just realized that if I want to add buttons or anything below, I want to be able to drag on top of them. So maybe my solution would be changing the Z-Index of the cards so they can appear outside the FrameLayout?
I have a FrameLayout as such:
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/stack"
/>
I put a RelativeLayout in it that contains some items, but has the formatting of so:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:font="http://schemas.android.com/apk/res-auto"
android:layout_width="300dp"
android:layout_height="300dp"
android:background="#drawable/card_background"
android:layout_centerInParent="true"
>
The only reason I have my FrameLayout set to match_parent is because the user can drag the relative layout anywhere on the screen, and if the width and height of the FrameLayout are wrap_content, the RelativeLayout gets cropped when dragged. However, when leaving it as match_parent touching anywhere in the FrameLayout trigger's the LinearLayout's touch event.
For context, I'm trying to display a stack of cards, each the same size, and let the user drag the top one off the screen one by one.
I ended up adding directly to the RelativeLayout. Unfortunately, when creating a class by hand some of the gravity settings were lost, so I did something like this:
int size = ScreenMetricUtil.convertPixelToDp(getActivity().getBaseContext(), 300);
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(size, size);
params.addRule(RelativeLayout.CENTER_IN_PARENT);
card.setLayoutParams(params);
container.addView(card); // add to LinearLayout
And my helper method (source):
public static int convertPixelToDp(Context context, int pixels) {
float density = context.getResources().getDisplayMetrics().density;
return (int) (pixels * density + 0.5f);
}
I'm using a SlidingPaneLayout in my activity:
<android.support.v4.widget.SlidingPaneLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/myslidingpanelayout"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<!-- menu left -->
<LinearLayout
android:id="#+id/menu"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#8d305f"
android:orientation="vertical" >
...
</LineareLayout>
<!-- main page right-->
<LinearLayout
android:id="#+id/right_main"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#fff"
android:orientation="vertical" >
...
</LineareLayout>
</android.support.v4.widget.SlidingPaneLayout>
I want the menu to cover 3/4 of the page I want it to work on all the phones so I can't put for example
android:layout_width="300dp"
I want to calculate the screen width and set it to the left pane
Thank for your help
Thanks for you all I found this answer and it works with me:
int width;
int height;
if (android.os.Build.VERSION.SDK_INT >= 13){
Display display = getWindowManager().getDefaultDisplay();
Point size = new Point();
display.getSize(size);
width = size.x;
height = size.y;
}else {
Display display = getWindowManager().getDefaultDisplay();
width = display.getWidth(); // deprecated
height = display.getHeight(); // deprecated
}
if(width>0&&height>0){
LinearLayout layout = (LinearLayout)findViewById(R.id.menu);
// Gets the layout params that will allow you to resize the layout
LayoutParams params = layout.getLayoutParams();
// Changes the height and width to the specified *pixels*
params.height = height;
params.width = width*3/4;
}
Just looking up the doc for sliding pane, looks like it functions like a linear layout, and can use the
layout_weight
parameter to set a percentage based width since the parent viewgroup is match_parent
In the case of 3/4 = 75% you can
android:layout_weight="0.75"
From the android docs http://developer.android.com/reference/android/support/v4/widget/SlidingPaneLayout.html:
Like LinearLayout, SlidingPaneLayout supports the use of the layout parameter layout_weight on child views to determine how to divide leftover space after measurement is complete. It is only relevant for width. When views do not overlap weight behaves as it does in a LinearLayout.
When views do overlap, weight on a slideable pane indicates that the pane should be sized to fill all available space in the closed state. Weight on a pane that becomes covered indicates that the pane should be sized to fill all available space except a small minimum strip that the user may use to grab the slideable view and pull it back over into a closed state.
And from the LinearLayout docs http://developer.android.com/guide/topics/ui/layout/linear.html#Weight
Note: You will end up setting the layout_width parameter to 0dp since the view group will actually use the weight to lay the children out
Apart from Selecsosi's answer, which is correct, there is also this view I wrote to always display the second item as a pane (ignoring the default show-side-by-side-if-the-fit behaviour). It can, as the name shows, wrap around the sliding view.
You can implement the behaviour you're after by either using a lot of #dimen resources and switching them based on swXXXdp-(port|land) or just setting the sliding view's width at runtime (something I'm reasonably certain you can do with the default layout as well).
I'm developing an Android application and I want to design, in eclipse, a layout bigger than screen height.
I have a layout for a fragment and this fragment will be inside a ScrollView on FragmentActivity.
This is my fragment's layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/user_pro_main_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:id="#+id/text_state"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/layout_state"
android:textAppearance="?android:attr/textAppearanceLarge" />
</LinearLayout>
Do I have to change android:layout_height="match_parent" to make it bigger on eclipse's designer?
What do I have to do if I want to see the layout bigger on eclipse designer?
Answer is pretty simple: you can't view layout which is biggern then screen on Eclipse Editor.
Possible workarounds:
1. Comment part of top views (visible) to see bottom (which are invisible), then uncomment when ready to launch.
2. Change Device Preview to bigger resolution (Nexus 10), this will give you some extra space.
You can always explicitly set the exact dp value in layout_height, but of course most of the time I don't think you want a fixed value, so do it programatically.
LinearLayout yourLayout; // Get it by findViewById()
yourLayout.setLayoutParams(new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, your_calculated_height));
You would set android:layout_height="wrap_content" and as you add child elements beyond the physical screen it will continue to stretch the layout.
As for viewing this on Eclipse, I'm not sure. I personally would just run it on a device to view it.
just calculate device height and width and add int value to calculated height and width at runtime at layouts height and width.
public void deviceDisplay(){
Display display = getWindowManager().getDefaultDisplay();
int width = display.getWidth();
int height = display.getHeight();
}