How to make view match parent dynamically - android

I have a layout as below. Location view maybe gone or visible and controlled by code. Thus the height of content view is variable based on the location view. But the divider view has always same height although it declared as matching to its parent. Would you like to let me know how to make sure divider view has same height with its parent? Thanks a lot.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<LinearLayout
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_toLeftOf="#+id/divider"
android:orientation="vertical" >
<TextView
android:id="#+id/location"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:visibility="gone" />
<TextView
android:id="#+id/type"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical" />
</LinearLayout>
<View
android:id="#+id/divider"
android:layout_width="1px"
android:layout_height="match_parent"
android:layout_gravity="center_vertical"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
android:background="#drawable/ic_divider_dashed_holo_dark" />
</RelativeLayout>

Man you have it totally mixed up, why are you using linear layout inside? makes no sense. The relative layout has no orientation concept.
About that height, possibly try alignTop and alignBottom to content, with wrap_content instead match_parent (also dont use fill_parent, atleast dont mix them with match_parent).

Related

Android: Align Parent Bottom + Bottom margin

I've used a relative layout and I want to set the button at bottom of the screen, However this puts it all the down to the bottom and I would like to have some margin so it there's some space between the end of the screen/view and the button. However whatever I do the button margin just doesn't do anything on 2.1+ for some reason. The relative layout contains a background so I cant but the margin on that.
Anyone know a fix for this?
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="0dp"
android:background="#drawable/background" >
<Button
android:id="#+id/confirm_mobile_button_next"
android:layout_width="fill_parent"
android:layout_height="40dip"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="false"
android:layout_centerHorizontal="false"
android:layout_centerInParent="false"
android:layout_margin="15dp"
android:background="#drawable/button_shape_selector"
android:paddingLeft="10dip"
android:paddingRight="10dip"
android:text="#string/confirm_mobile_no_continue"
android:textColor="#color/white"
android:textStyle="bold" />
</RelativeLayout>
You can simply add a padding to the RelativeLayout instead of a margin to the Button, e.g. android:paddingBottom="15dp".
In general I'm always testing my layout in the Exclipse preview using API Level 8 setting. This gives quite accurate results for most devices, including ICS and JB.
The other thing you can do is put a View that's aligned to the bottom of the RelativeLayout, and set its height to the bottom margin you would want to use (or simply specify a value for layout_marginBottom) like so:
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
>
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/some_image"
android:adjustViewBounds="true"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Some Overlay"
android:padding="3dip"
android:gravity="center_vertical|center_horizontal"
android:layout_above="#+id/empty_view"
android:layout_marginBottom="35dip"
/>
<View
android:id = "#+id/empty_view"
android:layout_height = "30dip"
android:layout_width = "match_parent"
android:visibility="invisible"
android:layout_alignParentBottom="true"
/>
</RelativeLayout>
This example fills the RelativeLayout with the ImageView, and positions a TextView over the ImageView.
Yu can use translateY attribute
translateY="-16dp"
Final code
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="0dp"
android:background="#drawable/background">
<Button
android:id="#+id/confirm_mobile_button_next"
android:layout_width="fill_parent"
android:layout_height="40dip"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="false"
android:layout_centerHorizontal="false"
android:layout_centerInParent="false"
android:layout_margin="15dp"
android:background="#drawable/button_shape_selector"
android:paddingLeft="10dip"
android:paddingRight="10dip"
android:text="#string/confirm_mobile_no_continue"
android:textColor="#color/white"
android:textStyle="bold"
android:translateY="-16dp" />
</RelativeLayout>
only working solution suggested by #franny zhao is below.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<FrameLayout
android:id="#+id/fl_layout"
android:layout_alignParentBottom="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="#+id/tv_layout"
android:text="hello world"
android:layout_marginBottom="50dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</FrameLayout>
</RelativeLayout>
If you add padding to the bottom aligned view as suggested by others, the view background will also extend. If you have colored background then the view will look like it is glued to the bottom. Padding and margin are entirely different, padding is part of view, but margin leaves space between views.
I think the best way is to set android:layout_alignParentBottom in XML
then in java code behind:
Button confirm_mobile_button_next = (Button)findViewById(R.id.confirm_mobile_button_next)
and
confirm_mobile_button_next.setTransitionY(-THE_VALUE) or setTransitionX(-THE_VALUE)
I think the best way is to set:
<...
android:layout_alignParentBottom="true" />
then in java code behind:
Button confirm_mobile_button_next = (Button)findViewById(R.id.confirm_mobile_button_next)
confirm_mobile_button_next.setTransitionY(-THE_VALUE) or setTransitionX(-THE_VALUE)
You can use a ViewGroup(for example, FrameLayout or LinearLayout) to wrap the view. Set alignParentBottom in the outside ViewGroup, then marginBottom can work in the inside View.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<FrameLayout
android:id="#+id/fl_layout"
android:layout_alignParentBottom="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="#+id/tv_layout"
android:text="hello world"
android:layout_marginBottom="50dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</FrameLayout>
</RelativeLayout>
Since I stumbled upon this issue, and saw no answers fit to my situation I started thinking for half a second and resolved it by setting a negative margin on the view inside the RelativeLayout sample:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_marginTop="-8dp"
android:layout_marginStart="-8dp">
</RelativeLayout>
This should prove useful to some people.
Well this is 2022, but if you still are not using ConstraintLayout for some reason, like the one legacy project code I am fixing, use this property for a Bottom margin type visual.
android:translationY="-8dp"
and your code should look like this (in my case this a FAB in Relative Layout)
<com.google.android.material.floatingactionbutton.ExtendedFloatingActionButton
android:id="#+id/cart_check_out_btn"
style="#style/FABThemeDark"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginHorizontal="16dp"
android:layout_marginVertical="16dp"
android:text="#string/cart_check_out_btn"
android:textAllCaps="false"
android:translationY="-8dp" />
And it will work like this
Try in this way :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="17dp"
android:text="Button" />
Here is another alternative. If you want to set the child's margin instead of parent's padding, you should set the value of android:layout_marginTop to double of the desired margin and then set the android:layout_centerVertical to true. Top margin is given double the desired value to compensate the bottom margin. That way you will have an equal top and bottom margin around the child view.
<Button
android:id="#+id/confirm_mobile_button_next"
android:layout_width="fill_parent"
android:layout_height="40dip"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="false"
android:layout_centerVertical="true"
android:layout_centerInParent="false"
android:layout_marginLeft="15dp"
android:layout_marginRight="15dp"
android:layout_marginTop="30dp"
android:background="#drawable/button_shape_selector"
android:paddingLeft="10dip"
android:paddingRight="10dip"
android:text="#string/confirm_mobile_no_continue"
android:textColor="#color/white"
android:textStyle="bold" />
It will give you the same result.

layout_centerHorizontal is not centering

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".

Android RelativeLayout -- how to position?

I want a Layout like this:
But my code doesn't work. I can't achieve this Layout, and I don't know what is wrong with what I've done so far.
Here's what I have so far -- Is the layout_gravity OK? Or does it need to be set it in the RelativeLayout?
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent"
android:layout_width="fill_parent">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/topText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20dip"
android:layout_gravity="top" />
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/centerLayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal"
android:layout_below="#id/topText">
<ImageButton
android:id="#+id/lektionBackButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/back"
android:layout_gravity="left"/>
<ImageView
android:id="#+id/centerImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:cropToPadding="true"
android:layout_gravity="center"/>
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/lektionForwardButton"
android:src="#drawable/forward"
android:layout_gravity="right"/>
</LinearLayout>
<TextView
android:id="#+id/bottomText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20dip"
android:layout_below="#id/centerLayout"
android:layout_gravity="bottom" />
</RelativeLayout>
</RelativeLayout>
You don't need to use gravity or the inner LinearLayout at all for this. Instead use layout_alignParentTop, layout_alignParentLeft, layout_alignParentRight, layout_alignParentBottom, layout_centerInParent and layout_centerVertical on the children.
It might be useful for you to go through the RelativeLayout tutorial.
Only when it comes to a Relative layout, you can switch to the Graphical layout in your Eclipse editor and drag and set the attributes. Everything with just your mouse. This however isn't possible with any other layout. Hope that helps.
RelativeLayout is a ViewGroup that displays child views in relative positions. The position of each view can be specified as relative to sibling elements (such as to the left-of or below another view) or in positions relative to the parent RelativeLayout area (such as aligned to the bottom, left or center).
Official Android Developer Click.
RelativeLayout Video link.

WRAP_CONTENT fills parent

I have a couple of activities with controls that I want to wrap content, but for some reason, they end up filling the parent. Inspecting them with the hierarchy viewer shows them with WRAP_CONTENT set, but the bounding box of the view clearly taking up the rest of the space on the screen.
The view is outlined above, and as you can see, layout_width is WRAP_CONTENT, but it fills the screen. And yes, I've checked and its child LinearLayout does not fill the width--it ends where its parent is supposed to.
EDIT: The image was really just to show how exactly the view ends up laid out. Here's the XML:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TableLayout android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:id="#+id/cart_table">
<TableRow android:layout_height="wrap_content"
android:id="#+id/footer">
<View android:layout_height="0dp" />
<TextView android:textSize="#dimen/h2"
android:gravity="right"
android:id="#+id/grand_total" />
</TableRow>
</TableLayout>
<com.eftours.TDLinkv2.Payment.Controls.PaymentForm
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/cart_table"
android:layout_alignParentRight="true"
android:id="#+id/payment_form" />
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/small_button"
android:layout_below="#id/payment_form"
android:id="#+id/checkout_button"
android:text="Checkout" />

ListView footer not center

Any idea why the footer of my list view is always on the left? Here's my xml layout. Footer just added and removed as more data needs loaded. I want theTextView and ProgressBar to be center
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:orientation="horizontal"
android:gravity="center">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:textSize="12sp"
android:textColor="#color/author_text"
android:text="LOADING DATA..."
/>
<ProgressBar
android:layout_width="15dp"
android:layout_height="15dp"
android:layout_marginLeft="10dp"
/>
</LinearLayout>
Okay, so the problem was NOT with the footer view shown in the OP; it indeed works just fine. The problem was my ListView had the layout_width attribute set to wrap_content. This works just fine for all the list renderers, but not for the footer. Changing the ListView to fill_parent fixed it
<ListView
android:id="#+id/android:list"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
style="#style/MyList"
/>
thanks gang
[SOLVED]
A horizontal LinearLayout will lay its views out left-to-right. It ignores any gravity or layout_gravity attributes when determining horizontal positioning (although these will affect vertical positioning). You'll need to use a RelativeLayout or else nest a vertical LinearLayout to get horizontal centering of views.
Alternatively, you could give the TextView a layout_weight of 1, which will cause it to take up any extra space. Since it will center its text, that should give you the effect you want.
EDIT: Now that I understand what you want, this ought to do it:
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:orientation="vertical"
>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center"
android:layout_gravity="center_horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:textSize="12sp"
android:textColor="#color/author_text"
android:text="LOADING DATA..."
/>
<ProgressBar
android:layout_width="15dp"
android:layout_height="15dp"
android:layout_marginLeft="10dp"
/>
</LinearLayout>
</LinearLayout>
You can maybe avoid the nested LinearLayouts by using a RelativeLayout in some way, but this came to mind first.
try setting its layout_width to match_parent

Categories

Resources