I am trying to make a View as a divider on my application to separate two elements (two Buttons, two TextViews or whatever) and I would like to have a padding on the left and on the right of that View (to move the background some space on the left and on the right).
It allows you to set a padding but the View still continues occupying the full width screen. Here is the code I have:
<View
android:layout_width="wrap_content"
android:layout_height="0.5dp"
android:background="#FFFFFF"
android:paddingLeft="10dp"
android:paddingRight="10dp"/>
How can I set a space on the left and on the right of that View so the divider will be smaller than screen?
Thanks in advance!
use margins instead of padding
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
Finally I got it. As on Android documentation it says: Even though a view can define a padding, it does not provide any support for margins, I am not able to use marginLeft or marginRight properties.
If you try to set directly android:marginLeft="10dp" you will get the following error:
No resource identifier found for attribute 'marginLeft' in package 'android'
Nevertheless, you can use android:layout_marginLeft="10dp" and android:layout_marginRight="10dp" to get the desired result.
The final View xml will be like this:
<View
android:layout_width="wrap_content"
android:layout_height="0.5dp"
android:background="#FFFFFF"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"/>
Padding takes care of the inner space. Therefore you would use padding to increase the space between the outline of the view and the elements inside it, whether they are buttons, textviews etc.
Margin takes care of the outer space. You would use this to increase the space between the outline of the view and the element which contains it. Hence what you need. To implement this in a view use the following:
private void setMargins (View view, int left, int top, int right, int bottom) {
if (view.getLayoutParams() instanceof ViewGroup.MarginLayoutParams) {
ViewGroup.MarginLayoutParams p = (ViewGroup.MarginLayoutParams) view.getLayoutParams();
p.setMargins(left, top, right, bottom);
view.requestLayout();
}
}
Hope this helps :)
Related
In RelativeLayout if layout_centerVertical or layout_centerInParent are true vertical margin (margin top ,margin bottom) does not work for me why?
<RelativeLayout>`
`
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginTop="900dp"
android:background="#36648b"
android:src="#drawable/ic_star_black_24dp"
/>
</RelativeLayout>`
When you layout_centerInParent="true" your ImageView, it's being put exactly in center of parent view.
layout_marginTop="[##]dp" will affect your layout if an object is within 90px of the top of your view. Thus pushing the centered view down to keep at least 90px of space on top of it. So it isn't being ignored but it is not having the effect that you think it should have.
source: https://stackoverflow.com/a/7895380/5244435
I'm generating my Views programatically, so there's no XML. But as it is easier to show my problem, I will give the structure in XML-like notation
<RelativeLayout
android:id="#+id/mainLayout">
<LinearLayout
android:id="#+id/left"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="#+id/text"
android:layout_width="wrap_content"
android:maxWidth="300dp"
android:maxLines="3"
android:text="Some long Text" />
</LinearLayout>
<ImageView
android:id="#+id/right"
android:layout_toRightOf="#id/left">
</RelativeLayout>
For this, the LinearLayout is positioned in the top left corner of the RelativeLayout. The ImageView is positioned right to it.
The TextView is very important. You see it's width is variable but to a maximum of 300dp. With this and maxLines this TextView has a maximum area by the size of 300dp x 3 lines. Most likely, the TextView won't be this large and by the wrap_content settings, TextView and LinearLayout will adapt to the text.
(I have to say, I overrid the TextView's onMeasure method, so the TextView is only as wide as the widest line.)
At the moment, everything is ok. The TextView and therefor LinearLayout enclose the text tightly, sitting at (0, 0). Next to it on the right sits the ImageView. Now comes the hard part I'm stuck at.
I want to align the LinearLayout within the before mentioned area, the TextView could maximally span. First thought was, I surround the LinearLayout with another RelativeLayout, by the maximum size and position the smaller LinearLayout within. But as the ImageView must have to be a direct child of mainLayout, I can't align it to the LinearLayout anymore.
My current approach is to override the LinearLayout's onLayout method:
#Override
protected void onLayout(boolean changed, int left, int top,
int right, int bottom){
super.onLayout(changed, this.getLeft(), this.getTop(),
this.getRight(), this.getBottom());
int translation;
int widthNeed = this.mLinLay.getMeasuredWidth();
switch(this.mLinLayAlignment)
{
case Left:
break;
case Center:
translation = (this.mLabWidth - widthNeed)/2;
this.setLeft(this.getLeft() + translation);
this.setRight(this.getRight() + translation);
// also tried: this.setTranslationX(translation);
break;
case Right:
translation = (this.mLabWidth - widthNeed);
this.setLeft(this.getLeft() + translation);
this.setRight(this.getRight() + translation);
// also tried: this.setTranslationX(translation);
break;
}
}
I only want to align the LinearLayout horizontally by now, so I only distinguish between 3 cases. The translation works pretty well, but the ImageView stays on its place, where it aligns to the initial position of the LinearLayout. I first tried LinearLayout.setTranslationX() but with the same effect. So I changed it, because the documentation on setTranslationX implicated, translation happens after layouting.
I think I just have to call the right method, so mainLayout is forced to layout the ImageView again, but I can't find it.
Also, are these the proper way and place to move the LinearLayout? As I need the final size of the TextView, it had to be measured, so this is the place I have to do it, I think.
EDIT
I have tried a little more. I got the LayoutParams from the LinearLayout, increased the left and decreased the right Margin by the calculated translation and set the LayoutParams again. Well, the ImageView still stays in place, so no progress here. But after switching out and back in the app, I realised, the Margin changed every time layouting. Well, should have seen this coming.
But why isn't the same thing happening, using setLeft and setRight?
Maybe if you draw a picture of what you want it would help.
I would stay out of the onLayout method alltogether.
If you want to move View or Layout around, then use layout params
RelativeLayout.LayoutParams params = linearLayout.getLayoutParams();
params.setMargins(left, top, right, bottom);
linearLayout.setLayoutParams(params);
I'm trying to have some margins inside a button between the text and the borders but I don't know how to specify them.
The only way I know is using android:layout_width="...", but this is not relative to the text size.
Thanks!
If you're looking for this kind of padding on the left and right of this cheeky text :
Here is what you do. :
<Button
android:id="#+id/she_was_good"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:soundEffectsEnabled="false"
android:layout_alignParentBottom="true"
android:paddingRight="25dp"
android:paddingLeft="25dp"
android:text="#string/im_sorry_lol_str" />
The part you are looking for is paddingRight and paddingLeft
Use padding to add margin between border and text in button.
To measure its dimensions, a view takes into account its padding. The
padding is expressed in pixels for the left, top, right and bottom
parts of the view. Padding can be used to offset the content of the
view by a specific amount of pixels. For instance, a left padding of 2
will push the view's content by 2 pixels to the right of the left
edge.
Read more at the official doc.
I'd like to create a message-like UI. I'm creating a list view with two types of rows: left and right.
Each row contains one TextView. The left one is used to display the message from the sender, while the right one is used to display the message from the current user.
What I would like to do is to set the TextView in the right row to occupy certain percentage of the screen, have text aligned to the left but to grow dynamically with the content.
To clarify, here is an image of what I would like to achieve: http://dl.dropbox.com/u/2482095/wanted.png
Blue rows are "left" rows, black rows are "right" rows.
To achieve this, I have used various combinations of LinearLayout and RelativeLayout with an empty view placed to the left, and desired textView placed to the right. What I get I something like this, which is not what I want: http://dl.dropbox.com/u/2482095/notWanted1.png (text always starting at the exact point)
I have also managed to set gravity:right, which aligns text to the right, which is also not what I wanted.
Is there any way to make TextView grow with its content?
[edit] My xml file looks something like this:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:padding="5dp">
<View android:id="#+id/emptyView"
android:layout_width="80dp"
android:layout_height="wrap_content"
android:layout_weight="1" />
<TextView android:id="#+id/messageBody"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
You should set layout_width="wrap_content" on your TextView, and layout_weight="1" on your empty view. That way, the TextView should just be as wide as needed, and the extra space will be taken by your empty view.
Basically what you want is the text to be right-aligned if it fits in one line, and left-aligned otherwise.
To measure the width of the Text use the Paint.measureText() method. So you might use something like this for your view:
Paint paint = new Paint(view.getPaint());
LayoutParams params = view.getLayoutParams();
int availableWidth = params.width - view.getPaddingLeft() - view.getPaddingRight();
int textWidth = (int) Math.ceil(paint.measureText(view.getText().toString()));
if(textWidth <= availableWidth) {
view.setGravity(Gravity.RIGHT);
}
else {
view.setGravity(Gravity.LEFT);
}
Yes, have your view (any view) wrap_content. This will allow the view to grow as large as its parent will allow. If your parent only allows a certain amount of space for your view to take, the child will never grow larger. Not, a parent is also limited by its parent and so on.
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());
}