This is my linear layout:
It is too close to the top. I am trying to add some space to the top. I have tried using android:paddingTop but that does not work. How do I add space at top in linear layout?
XML:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/linearLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="20dp"
android:orientation="vertical"
android:paddingLeft="20dp"
android:paddingTop="200dp"
android:paddingRight="20dp"
android:paddingBottom="20dp">
<TextView
android:id="#+id/pNameTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/comfortaa_bold"
android:textColor="#000000"
android:textSize="18sp" />
<TextView
android:id="#+id/pDescriptionTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/comfortaa_bold"
android:textColor="#000000"
android:textSize="18sp" />
<TextView
android:id="#+id/pTypeTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/comfortaa_bold"
android:textColor="#000000"
android:textSize="18sp" />
<TextView
android:id="#+id/pPriceTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/comfortaa_bold"
android:textColor="#000000"
android:textSize="18sp" />
<TextView
android:id="#+id/pQuantityTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/comfortaa_bold"
android:textColor="#000000"
android:textSize="18sp" />
</LinearLayout>
Given what you show in your image, it looks likely that you've already specified android:padding to give padding to all four edges. If that is the case, adding android:paddingTop won't do anything; the system will ignore that attribute in favor of the generic android:padding.
If, for example, you currently have android:padding="16dp", you'll have to delete that and replace it with something like this:
android:paddingTop="32dp"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:paddingBottom="16dp"
If you are using ListView and want to add only some spacing above the very first item, then the situation is different. Instead of adding paddingTop to your item view, you have some choices.
Padding on the ListView
Add these two attributes to your ListView or RecyclerView tag:
android:paddingTop="32dp"
android:clipToPadding="false"
This is by far the easiest solution, but it will affect how the scrollbar is drawn, which you may not like.
Add a header view to the ListView
Create a layout file for a header view. I suggest using a <Space> tag if you just want some extra space at top:
<Space
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="32dp"/>
Then inflate this and add it to your ListView:
val header = inflater.inflate(R.layout.list_header, listView, false)
listView.addHeaderView(header)
By default, a divider will still appear between this header and your first list item. If you don't want that, you can disable it:
listView.setHeaderDividersEnabled(false)
Dynamic padding in getView()
In your adapter's getView() method, you can programmatically set the padding based on the item's position. First, define two dimen resources like this:
<dimen name="extra_padding">32dp</dimen>
<dimen name="normal_padding">16dp</dimen>
Then, in getView(), add code like this:
val paddingTop = when (position) {
0 -> resources.getDimensionPixelSize(R.dimen.extra_padding)
else -> resources.getDimensionPixelSize(R.dimen.normal_padding)
}
view.setPadding(view.paddingLeft, paddingTop, view.paddingRight, view.paddingBottom)
Related
I have RelativeLayout and two TextView, one of which with background.
On image two baselines aligned, but I want to align baseline of one and background bottom of another.
Here is my xml code.
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="#dimen/chat_room_item_height"
android:background="?attr/selectableItemBackground"
android:paddingEnd="16dp"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:paddingStart="16dp"
>
<!-- other stuff -->
<TextView
android:id="#+id/text_view_unread_message_count"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_below="#+id/text_view_last_message_date"
android:layout_marginLeft="8dp"
android:layout_marginStart="8dp"
android:background="#drawable/chat_unread_message_count_background"
style="#style/ChatRoomUnreadMessageCountTextStyle"
tools:text="101"
/>
<TextView
android:id="#+id/text_view_last_message"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/text_view_title"
android:layout_toEndOf="#id/image_view_icon"
android:layout_toLeftOf="#id/text_view_unread_message_count"
android:layout_toRightOf="#id/image_view_icon"
android:layout_toStartOf="#id/text_view_unread_message_count"
android:ellipsize="end"
android:layout_alignBaseline="#+id/text_view_unread_message_count"
android:gravity="bottom"
android:maxLines="1"
tools:text="My life is a story book with many different chapters but I don’t let everyone read it."
style="#style/ChatRoomLastMessageTextStyle"
/>
</RelativeLayout>
I have tried wrap TextView with background to different ViewGrops, wrap both TextView to layout, no avail.
You can do a little trick, here we go:
Put the text_view_unread_message_count inside a some viewgroupo e.g. RelativeLayout and add a paddingBottom with using SP scaling (this is your space for manually align), something like this:
Obs.: You need to give a new ID to you TextView, this is a example ID's and size values can be changed.
<!-- sp scaling will change with font size -->
<RelativeLayout
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:paddingBottom="10sp"
android:layout_marginLeft="8dp"
android:layout_marginStart="8dp"
android:layout_toEndOf="#id/image_view_icon"
android:layout_toLeftOf="#id/text_view_unread_message_count"
android:layout_toRightOf="#id/image_view_icon"
android:layout_toStartOf="#id/text_view_unread_message_count">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/chat_unread_message_count_background"
style="#style/ChatRoomUnreadMessageCountTextStyle"
tools:text="101"
/>
</RelativeLayout>
Put you locations definitions on parent and text definitions on textview. This should work.
You can set the required bottom margin programmatically.
val bottomToBaselineHeight = textViewLastMessage.height - textViewLastMessage.baseline
textViewUnreadMessageCount.margin(bottom = bottomToBaselineHeight)
The below mentioned layout is a model of one item in a ListView. As you see it, the three TextViews are separated from each as each one occupies .3 of the entire row space.
The problem is, when I add items to the ListView I found that the three TextViews are just linked to each other. For example, let's assume I want to add item to the ListView contains the following:
Adam USA M
I expect to see that row on the screen with some spaces separating each textView, but what happens is that I get something like the following:
AdamUSAM
Why this is happening and how to solve it?
model_view:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/tvName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight=".3"
android:text="Name"/>
<TextView
android:id="#+id/tvAddress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight=".3"
android:text="Address: "/>
<TextView
android:id="#+id/tvGender"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight=".3"
android:text="gender: "/>
</LinearLayout>
Update:
Now I changed the layout to be as follows, but the problem is persists which is that the three textviews are appearing clinching to each other without spacing.
layout
<?xml version="1.0" encoding="utf-8"?>
<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="3">
<TextView
android:id="#+id/tvName"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Name: "
android:focusable="false"/>
<TextView
android:id="#+id/tvAddress"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Address: "
android:focusable="false"/>
<TextView
android:id="#+id/tvGender"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="gender: "
android:focusable="false"/>
</LinearLayout>
screen shot:
You need to specify the orientation of LinearLayout e.g. android:orientation="horizontal" then replace your weights to 1 instead of 0.3 and make sure your TextView width is 0dp not wrap_content.
Add a layout_margin or padding to each TextView.
Use property
android:layout_margin="10dp"
in your listView xml add :
android:dividerHeight="8 dip"
or any value you want.
I would suggest to remove layout_weight from TextViews, define a specific height to them and add padding. Adding margins may cause your TextViews to go out of ListView.
I have the following Android layout
<?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:paddingBottom="16dp"
android:orientation="vertical" >
<TextView
android:id="#+id/slideTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dip"
android:padding="#dimen/px20"
android:text="#string/login_message"
android:textSize="#dimen/px25"
android:textStyle="bold" />
<TextView
android:id="#+id/slideDescription"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableLeft="#drawable/password"
android:drawablePadding="#dimen/px20"
android:drawableStart="#drawable/password"
android:padding="#dimen/px20"
android:text="#string/login_message_body"
android:textSize="#dimen/px20" />
<TextView
android:id="#+id/swipeMessage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:text="" />
</RelativeLayout>
But all the elements are positioned at the top of the screen one on top of the other, like if they didn't occupy any space.
That's not what what it seems to happen in the RelativeLayout documentation, where all elements are vertically positioned one below the other.
What's going on here?
So you need to use the id of the other components to align then properly.
For example the TextView with the id #+id/slideDescription should also have
android:layout_below="#+id/slideTitle" as one of the properties of the xml.
And the TextView with the id #+id/swipeMessage should also have
android:layout_below="#+id/slideDescription" as one of the properties of the xml.
In order to place one view below another in RelativeLayout you have to use layout_below property and set the ID of View you want to be above the specified one. But actually in order to place views vertically below each other it is more convenient to use LinearLayout with orientation set to vertical
layout_below is missed in the above xml code.I replaced the code with that please use that.
In Relative layout elemnets will be arranged relative to other elements in order to do this we should use id values of individual view elments
android:layout_below="#id/slideTitle" should be placed in description text view
android:layout_below="#id/slideDescription" should be placed in message text view
in order to get the output you desired please use the below code
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingBottom="16dp" >
<TextView
android:id="#+id/slideTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dip"
android:padding="#dimen/px20"
android:text="#string/login_message"
android:textSize="#dimen/px25"
android:textStyle="bold" />
<TextView
android:id="#+id/slideDescription"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/slideTitle"
android:drawableLeft="#drawable/password"
android:drawablePadding="#dimen/px20"
android:drawableStart="#drawable/password"
android:padding="#dimen/px20"
android:text="#string/login_message_body"
android:textSize="#dimen/px20" />
<TextView
android:id="#+id/swipeMessage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_below="#id/slideDescription"
android:text="" />
Consider the xml file with the following textview layout:
I am trying to set the alignment of my this textview whose values are coming dynamically such that it should be:
One:24
Two:6000
The problem the layout is coming like this:
How to align it properly?
My xml is having visibility:gone set for One: and Two: text views. Then in my java file, I am doing like so:
one.setText("One:"+entries.get("one"));
two.setText("Two:"+entries.get("two"));
if(entries.get("type").equals("OneType"))
{
one.setVisibility(View.VISIBLE);
two.setVisibility(View.GONE);
}
else
{
one.setVisibility(View.VISIBLE);
two.setVisibility(View.VISIBLE);
}
UPDATE:
The xml file relevant code:
<LinearLayout
android:id="#+id/passedlayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="right"
android:orientation="vertical"
>
<TextView
android:id="#+id/one"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="25dp"
android:visibility="gone"
android:textColor="#000000"
android:textStyle="bold"/>
<TextView
android:id="#+id/two"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="25dp"
android:visibility="gone"
android:textColor="#000000"
android:textStyle="bold"/>
</LinearLayout>
UPDATE:
I have multiple such rows for a single layout. Setting the gravity to left worked for the single layout.
However for more than one rows having varying digits, the layout again gets disturbed
like this-
Layout1:
One:24
Two:6000
Layout2:
One:0
Two:0
You see that One: and Two: of Layout1 are not aligned with One: and Two: of Layout2.
Change
android:gravity="right"
to
android:gravity="left"
in the LinearLayout with id passedlayout
I'm trying (in vain) to add margins to my ListView items. I have tried adding margin values to my RelativeLayout below but no matter what I do all I seem to get is a 1px line between each item.
What I really would like is to have rounded corners on each item, a 1px black border and a 3-5px margin left, top, and right but right now I'll settle for just a margin around each item :-)
How do I achieve my goals? Just the margin for now... ;-)
Here's what I have:
UPDATE: I have updated the xml below removing main layout and fragment layout. I have also updated the ListView item layout to what I have now which is closer to what I want but still not perfect. Screenshot added as well
listview item layout xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingLeft="#dimen/matchMargin"
android:paddingRight="#dimen/matchMargin"
android:paddingTop="#dimen/matchMargin" >
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#cfcfcfcf" >
<include
android:id="#+id/matchKampstart"
layout="#layout/kampstart_layout" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/matchKampstart"
android:layout_marginTop="#dimen/belowKampstartMargin" >
<ImageView
android:id="#+id/tournamentImageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginRight="2dp"
android:adjustViewBounds="true"
android:contentDescription="#string/tournamentImageViewContentDescription"
android:gravity="left"
android:src="#drawable/sofabold_launcher" />
<ImageView
android:id="#+id/homeTeamImageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginRight="2dp"
android:adjustViewBounds="true"
android:contentDescription="#string/homeTeamImageViewContentDescription"
android:src="#drawable/sofabold_launcher" />
<TextView
android:id="#+id/homeTeam"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginRight="2dp"
android:text="#string/home"
android:textSize="14sp"
android:textStyle="bold" />
<TextView
android:id="#+id/dash"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginRight="2dp"
android:gravity="center"
android:text="#string/dash"
android:textSize="12sp"
android:textStyle="bold" />
<ImageView
android:id="#+id/awayTeamImageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginRight="2dp"
android:adjustViewBounds="true"
android:contentDescription="#string/awayTeamImageViewContentDescription"
android:src="#drawable/sofabold_launcher" />
<TextView
android:id="#+id/awayTeam"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:gravity="center"
android:text="#string/away"
android:textSize="14sp"
android:textStyle="bold" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#id/matchKampstart"
android:layout_marginTop="#dimen/belowKampstartMargin" >
<ImageView
android:id="#+id/tvChannelImageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="false"
android:contentDescription="#string/tvChannelImageViewContentDescription"
android:gravity="right"
android:src="#drawable/sofabold_launcher" />
</LinearLayout>
</RelativeLayout>
</RelativeLayout>
This gives me the following where you'll notice a very small line to the right and left for each item. That I would also like to get rid of.
I'm not great with layouts, but I have noticed in the past that ListView rows often ignore LayoutParams. I have no idea where this happens or if it's possible to override, I do know you can easily work around it by adding another layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="?android:attr/listPreferredItemHeight"
android:background="#990000ff" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginRight="10dp"
android:layout_marginTop="10dp"
android:background="#9900ff00"
android:paddingLeft="10dp" >
<TextView
android:id="#+id/text"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#99ff0000" />
</LinearLayout>
</LinearLayout>
Typically layouts that only have one child can be removed, but as you can see this one serves a purpose:
The outer-most layout is blue, the TextView is red, and the green is the extra layout that allows you to add some extra spacing. Notice the difference between padding (the green on the left) and margin (no green on the right). You have clearly stated that you want to use margins (android:layout_margin) but your code clearly uses padding (android:padding) so I included both.
A little late seeing this, but just add the following lines to your ListView xml element
android:divider="#00000000"
android:dividerHeight="10dp"
See the answer here for why. In short the child asks the parent, and the list view row uses AbsListView.LayoutParams, which doesn't include margins.
Why LinearLayout's margin is being ignored if used as ListView row view
In your adapter, catch your relative layout in getView(), then give a layout params ,
RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams)view.getLayoutParams();
params.setMargins(80, 0, 0, 0); //substitute parameters for left, top, right, bottom
YourRelativeLayoutInAdapter.setLayoutParams(params);
I suppose you have a ListView defined in an XML file somewhere, if so, you could add some padding to it, so that there will be some space between the edge of the screen and the ListView.
Example:
<ListView
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:padding="15dp"/>