I am trying to center a TextView in a LinearLayout and it is centering horizontaly but not vertically.
below is my code
<LinearLayout
android:orientation="vertical"
android:layout_width="320dp"
android:layout_height="50dp"
android:background="#drawable/rectblack"
android:layout_marginTop="10dp"
android:layout_gravity="center"
android:minWidth="25px"
android:minHeight="25px">
<TextView
android:text="Explode a Vin"
android:gravity="center"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/tvExVin" />
</LinearLayout>
In the end I would like it to be centered vertically to the left of the Linearlayout, if someone could figure out how to do that, that would be great.
Thanks!
You have the gravity and layout_gravity reversed. You can have multiple values on the gravity attribute separated by "|". Try this:
<LinearLayout
android:orientation="vertical"
android:layout_width="320dp"
android:layout_height="50dp"
android:background="#drawable/rectblack"
android:layout_marginTop="10dp"
android:layout_gravity="center_horizontal"
android:gravity="center_vertical|left"
android:minWidth="25px"
android:minHeight="25px">
<TextView
android:text="Explode a Vin"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/tvExVin" />
</LinearLayout>
For clarification:
android:layout_gravity="center_horizontal" will center the LinearLayout horizontally in its parent.
android:gravity="center_vertical|left" will center the TextView (and any other children) vertically inside the LinearLayout and align it to the left.
Try to change your gravity to
android:layout_gravity="center_vertical"
gravity is used to position the content inside your View and layout_gravity is used to position the View within its parent.
But I'm confused by "In the end I would like it to be centered vertically to the left of the Linearlayout". But from the way it sounds, my answer should give you what you want.
Also, unless there is a very good reason, you shouldn't need to use a LinearLayout, or any parent, for a single child. If you can give a better explanation of what you want or even a screenshot then we may be able to help with a better solution.
This will give you your desired effect
<LinearLayout
android:layout_width="320dp" <!-- removed orientation (horizontal by default) -->
android:layout_height="50dp"
android:background="#drawable/rectblack"
android:layout_marginTop="10dp"
android:layout_gravity="center"
android:minWidth="25px"
android:minHeight="25px">
<TextView
android:text="Explode a Vin"
android:layout_gravity="center_vertical" <!-- changed gravity here -->
android:layout_width="fill_parent"
android:layout_height="wrap_content" <!-- change to wrap_content -->
android:id="#+id/tvExVin" />
</LinearLayout>
<LinearLayout 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:layout_gravity="center_horizontal|center_vertical"
android:gravity="center_vertical|center_horizontal"
android:orientation="vertical" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="AppLock Demo"
android:textSize="30dp" />
</LinearLayout>
Related
I am using the following layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="2dp"
android:layout_marginTop="10dp"
android:background="#drawable/cardview_shadow"
android:elevation="2dp"
android:gravity="center_vertical"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="2dp"
android:gravity="fill_horizontal"
android:orientation="horizontal">
<ImageView
android:id="#+id/ic_find_previous_holo_dark"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="left"
android:src="#drawable/ic_find_previous_holo_dark" />
<ViewFlipper xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/view_flipper"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/emoji_u1f33c" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/emoji_u1f33c" />
</ViewFlipper>
<ImageView
android:id="#+id/ic_find_next_holo_dark"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="right"
android:src="#drawable/ic_find_next_holo_dark" />
</LinearLayout>
</LinearLayout>
I want left arrow to the left & right arrow to the right & center layout to fill the center gap without giving exact width in dp, px etc but i m not able to achieve this layout. i need this type of layout most of the time
In your case you need to give android:layout_weight=1 to your ViewFlipper So that it can take rest of the space left by your other 2 image views (Will push both views to the sides since ViewFlipper is the middle view). A better explanation is given here https://developer.android.com/guide/topics/ui/layout/linear.html check the Layout Weight section.
I want a layout to be centered vertically when there are few elements in it, see the image to the left. When there are many elements, I want it to grow and become a scroll view that covers the whole screen. See right image.
How can I achieve this?
The red elements are dynamically added to the layout. The two blue TextViews are outside the scrollview. Basically the scrollview kicks in when we have no more space left on the screen.
Try this one.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#fff">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#ff0000"
android:gravity="center"
android:padding="5dp"
android:text="Top TextView"
android:textColor="#fff" />
<!-- You can remove min Height if you don't want it-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#00ffff"
android:minHeight="100dp">
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!-- Do you Code here.-->
</ScrollView>
</LinearLayout>
<TextView
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#ff0000"
android:gravity="center"
android:padding="5dp"
android:text="Bottom TextView"
android:textColor="#fff" />
</LinearLayout>
In my horizontal LinearLayout, I set the gravity in one view to be center_vertical, and then I tried to set layout_gravity for a second view, but that view is lined up with the centered text in the first view!
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top"
android:background="#drawable/border"
android:gravity="center_vertical"
android:text="layout_gravity=top gravity=center_vertical" >
</TextView>
<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top"
android:background="#drawable/border"
android:gravity="top"
android:text="layout_gravity=top gravity=top" >
</TextView>
</LinearLayout>
And here is the same code but for a vertical layout. Notice that the desired behavior works correctly in the vertical layout.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:layout_width="200dp"
android:layout_height="100dp"
android:layout_gravity="left"
android:background="#drawable/border"
android:gravity="center_horizontal"
android:text="layout_gravity=left gravity=center_horizontal" >
</TextView>
<TextView
android:layout_width="200dp"
android:layout_height="100dp"
android:layout_gravity="right"
android:background="#drawable/border"
android:gravity="right"
android:text="layout_gravity=right gravity=right" >
</TextView>
</LinearLayout>
I can just use a RelativeLayout or maybe another nested LinearLayout to fix the problem. But I am asking this question because I would like to know if I am not understanding how gravity and layout_gravity works!! It is important to me that I understand how these fundamental attributes work. Thanks
If you want one centered and one top then you need to add a baseline aligned flag to the LinearLayout
android:baselineAligned="false"
It is default for the layout to align the children's baselines. This can cause issues such as this when the children use different values of gravity.
The difference with vertical is that the baselines can't be aligned as they can in horizontal.
See:
http://developer.android.com/reference/android/widget/LinearLayout.html#attr_android:baselineAligned
Additional info - This appears to explain the issue better than I can:
http://www.doubleencore.com/2013/10/shifty-baseline-alignment/
if you are trying something not "connected to each other" i.e. you want some space between two widgets then use a blank widget and use weights
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:weightSum="100" >
<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_weight="40"
android:gravity="center_vertical"
android:text="layout_gravity=top gravity=center_vertical" >
</TextView>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="20" />
<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_weight="40"
android:gravity="right"
android:text="layout_gravity=top gravity=top" >
</TextView>
</LinearLayout>
You werent clear about the output that you wanted , this is what i could interpret as your required output.. But i will explain you how this works ..
For more on weights you can go to http://developer.android.com/reference/android/widget/package-summary.html
There is something called as "widget" and "content of widget"
While talking of linearlayout with layout_gravity you set gravity of it self as a "widget" in the main View and with gravity you set gravity to the content in that linearlayout
Simmilarly with say textview , if you use layout_gravity (say equal to center) then the textview will be centered in its space (i.e. it will be centered in its width if layoutorientation is vertical , and it will be centered in its height if layout_orientation is horizontal)
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<TextView
android:layout_width="200dp"
android:layout_height="200dp"
android:layout_gravity="center"
android:text="Second Activity" />
</LinearLayout>
See the same in vertical orientation
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:layout_width="200dp"
android:layout_height="200dp"
android:layout_gravity="center"
android:text="Second Activity" />
</LinearLayout>
Also now see about the gravity when you apply gravity to textview, the "TEXT" in the textview is centered (if gravity=center)
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:layout_width="200dp"
android:layout_height="200dp"
android:layout_gravity="center"
**android:gravity="center"**
android:text="Second Activity" />
</LinearLayout>
Now you can realise that gravity sets the gravity to the content within the widget.. the "content" of a widget can be widgets itself..
LinearLayout is a widget , and within linear layout you add yet other types of widgets (button and text view)
So applying gravity=center to textview sets its content(i.e. text)at the center and applying gravity to linearlayout will center its content(i.e. textview) at the center
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:gravity="center">
<TextView
android:layout_width="200dp"
android:layout_height="200dp"
android:layout_gravity="center"
android:gravity="center"
android:text="Second Activity" />
</LinearLayout>
gravity is how the view itself positions its content within the area determined by its width and height. layout_gravity is how the parent view positions the child within the parent's area. Usually you can simply set gravity on the LinearLayout instead of setting layout_gravity on all of its children.
Do note that for LinearLayouts, gravity only has an effect on the axis that is not the orientation, e.g. top and bottom would be relevant to a horizontal LinearLayout, but left and right (or start and end) would not be relevant.
I have a relative layout, and inside it i place 3 items, 2 imageviews and one scrollview.
My layout is like this...
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center"
android:gravity="center"
android:orientation="horizontal"
android:baselineAligned="true"
android:background="#drawable/background">
<RelativeLayout
android:id="#+id/logosLayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:layout_weight="1"
android:layout_margin="16dp"
android:gravity="center">
<!-- An image will be placed here -->
</RelativeLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_weight="1"
android:background="#33ffffff"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:src="#drawable/up" />
<ScrollView
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_margin="8dp"
android:fadingEdgeLength="32dp"
android:scrollbars="none" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical" >
<ImageButton
android:id="#+id/hotelBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:background="#drawable/button_background"
android:contentDescription="#string/hotelBtnDesc"
android:gravity="center"
android:src="#drawable/icon1" />
<TextView
android:id="#+id/hotelBtnDescTxtVw"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:gravity="center"
android:text="#string/hotelBtnDesc"
android:textColor="#ffffff"
android:textSize="14sp" />
<!-- more scrollview items -->
</LinearLayout>
</ScrollView>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:src="#drawable/down" />
</RelativeLayout>
</LinearLayout>
The above code produces the view shown here:
You may note that the arrows are not aligned in the center, but are slightly moved to the right. Why is that, and how can I fix it ? Note that i have already used android:layout_centerHorizontal="true" to my imageviews.
Thank you in advance
Its problem with your
android:layout_margin="8dp"
remove it from both scrollview and imageView
and pass it to RelativeLayout direct.
or add
android:layout_marginTop="8dip"
android:layout_marginBottom="8dip"
in your RelativeLayout.
and pass
android:layout_centerHorizontal="true"
to your scrollview
they are aligned to the center if you put the marginRight into consideration, try adding android:layout_margin="8dp" to the arrows.
u need to set image view that is under the Relative layout set this image view width fill parent.
Try removing android:layout_weight="1" from your RelativeLayout and see if it works.
In your LinearLayout, the attribute android:orientation="horizontal" causing your display to be aligned horizontaly. Therefore your RelativeLayout is in center but since its shared with another layout thats why you cant note the difference. If you completely remove the first RelativeLayout (the one with id logosLayout) then i hope you'll see the second layout in center.
So, first you need to define the hierarchy of layout you require and then adjust your views accordingly.
It seems problem with your android:layout_margin="8dp" for your scrollview only and pass it to RelativeLayout direct but instead of using margin use padding = "8dp".
I has the following XML:
<RelativeLayout android:id="#+id/cover_box"
android:layout_width="wrap_content" android:layout_height="wrap_content">
<ImageView android:id="#+id/cover"
android:layout_width="wrap_content" android:layout_height="wrap_content" />
<ImageView android:id="#+id/download" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:src="#drawable/mark_download"
android:layout_centerInParent="true" android:layout_marginTop="90px" />
</RelativeLayout>
But it's look's like the marginTop is being ignored.
If you want the 2nd image to be 90dp under the center of the screen, you could replace it with a FrameLayout where you can control the padding to move your image downwards.
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:paddingTop="90dp">
<ImageView android:id="#+id/download"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/mark_download"/>
</FrameLayout>
When you use center in parent the view is put directly in the center. The margin top will only come into play 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.
I want the progressbar to shown under android:layout_centerInParent="true" so i have added a dummy TextView and set it to centerInParent .Then i put my progressbar under it. Now you can increase its distance from center in two ways . First by increasing marginTop in TextView and second increasing TextView height.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/widget"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/splash" >
<FrameLayout
android:id="#+id/splash_container"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<TextView
android:id="#+id/txt1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true" />
<com.s3.tdd.interfaces.CircularProgressBar
android:id="#+id/circularprogressbar2"
style="#style/Widget.ProgressBar.Holo.CircularProgressBar"
android:layout_width="110dip"
android:layout_height="110dip"
android:layout_below="#+id/txt1"
android:layout_centerHorizontal="true" />
</RelativeLayout>
You can put your imageview inside of other ViewGroup (LinearLayout of RelativeLayout layout), leaving the margin of imageview, and doing android:centerInParent="true" for the ViewGroup:
<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">
<LinearLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:centerInParent="true">
<ImageView android:id="#+id/download" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="#drawable/mark_download" android:layout_marginTop="90px" />
</LinearLayout>
</RelativeLayout>
You can make a dummy view and center it to parent. Now align your view relative to dummy view using layout:alignComponent and give the marginTop. Now in the code move it according to the width of your view to center it.