Have elements equally span entire width / height of their RelativeLayout - android

I have, say three buttons i would like to list below one another in a layout. Depending on the device, screen size, pixel density, orientation and so on, i would like the buttons to span the entire height of their parent layout. The buttons each have a fixed height (dp), so the spanning is more likely concerning the space between the buttons.
I saw several questions on various forums regarding how a LinearLayout is supposedly a fix for this problem, by nesting a layout for each element, having the layout span. I would very much like to avoid nesting layouts, and I'm using a RelativeLayout as of now, so if there is any way to go about it with this type of layout it will be of great help! :)
Additionally, I would like the top and bottom button to "touch" the parent layout border at the top and bottom, and the last (or rest) button to fill out the rest of the vertical space equally.
Thank you in advance.

I'm not entirely sure what you wish to achieve, but you should be able to do this using a LinearLayout & weights (so you don't have to nest multiple layouts).
If you want the 3 buttons to take up the entire parent of the screen just add a weight to each for example:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:id="#+id/button_one"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"/>
<Button
android:id="#+id/button_two"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"/>
<Button
android:id="#+id/button_three"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"/>
</LinearLayout>

Try to set to topButton a field in XML:
android:layout_alignTop="true";
Try to set to middleButton a field in XML:
android:layout_centerVertical="true";
Try to set to bottomButton a field in XML:
android:layout_alignBottom="true";

Related

HorizontalScrollView's child not matching it's parent view's width even on setting android:layout_width="match_parent"

I want to display a horizontal list of scrollable buttons at top of the phone screen containing 30 items, for this purpose I am using a HorizontalScrollView with a LinearLayout with "horizontal" orientation as it's child but the linear layout is not taking up the entire phone width even on setting its width as "match-parent". Here's the code :
<HorizontalScrollView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:layout_gravity="center">
<GridView
android:id="#+id/gridView_horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:stretchMode="columnWidth" />
</LinearLayout>
</HorizontalScrollView>
Here is shown in the image that linear layout is not taking up the entire space and LinearLayout is only covering some of the space. Also on changing the size to a fixed size, I noticed that the HorizontalScrollView was actually behaving like a vertical Scroll View only.
NOTE: Also if there is an alternative way to display a horizontal list of buttons with 30 items with numbers from 1 to 30 on it, please suggest it.
To achive this easily you may use Recyclerview with Horizotanl Layout Manager.For Example
recycler_view.setLayoutManager(new LinearLayoutManager(MainActivity.this, LinearLayoutManager.HORIZONTAL, false));
I don't think you need a HorizontalScrollView with a nested LinearLayout for what you are trying to achieve. It would be a better idea to simply use a horizontal RecyclerView if your button layouts are similar and the functionality of the buttons is similar too. Refer to this answer for help https://stackoverflow.com/a/40584425/9119277

Inserting many views into one layout without them overflowing to the end of the screen

I'm looking for a way that I can dynamically add views into a layout (currently a LinearLayout) and that they won't overflow into the end of the screen and be hidden.
I can't use ScrollViews since it has to look like one sentence (It's a "fill the blanks" question).
I'm just looking for an idea on how to do this, not the code itself.
Thanks in advance, Shay.
If you are using linear layout than use linear layout with weights:
For example:
You have a LinearLayout with vertical orientation and you have 2 ImageViews inside it and you want these ImageViews always to take equal space.
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:weightSum="2"
android:orientation="vertical"
android:layout_gravity="center">
You can set the layout_weight of each ImageView to 1 and the weightSum in LinearLayout to 2 to achieve this.
<ImageView
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_height="0dp"/>
This will work correctly for any device without overflow into the end of the screen and be hidden

Sizing buttons in menu in the correct way

I'm doing a menu. The problem is that my buttons are too close to one another. I would like to separate them a bit.
Also I would like to extend them (rozszerzyć je) to the similar sizes.
Here you have the code:
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/button2"
android:layout_centerHorizontal="true"
Here you have the image of this problem:
And each button out of the 4 ones has a similar code. (the difference is in layout_above.
How to make it?
Thanks in advance!
Any reason why you have to use a RelativeLayout? If you can use a LinearLayout I'd use something like:
<LinearLayout
android:layout_width="..."
android:layout_height="..."
android:orientation="vertical">
<Button
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:padding_top="4dp"
android:padding_bottom="4dp"
... />
</LinearLayout>
This would get all your buttons to be the same size horizontal and vertical. You can tweak the padding top and bottom to get the desired effect.
The way layout_weight works is it takes the leftover space of the parent view, and portions them out to the children views according to their weights. Since the height of every button is 0dp, 100% of the vertical space is left to partition out. Since the weight of all the buttons is the same, they will be roughly the same size.
This explanation is for a vertical LinearLayout. For a horizontal, just switch the values of layout_height and layout_width.

android:layout_gravity effect in main.xml?

I have 4 buttons in a horizontal linear layout. I'd like the right edge of the 4th button to align with the right edge of the linear layout (equal to screen width) I've tried using android:layout_gravity="right" but it doesn't work - the right button is to the right of the 3rd one but not right aligned . Am I missing something obvious?
main.xml with only the relevant layout params only is:
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<Button
android:layout_height="fill_parent"
android:layout_width="wrap_content">
<Button SAME LAYOUT AS BUTTON 1>
<Button SAME LAYOUT AS BUTTON 1>
<Button
android:layout_height="fill_parent"
android:layout_width="wrap_content"
android:layout_gravity="right" />
</LinearLayout>
</LinearLayout>
This doesn't seem to match the stated behaviour for layout_gravity in the SDK reference :"Defines how to place the view, both its x- and y-axis, within its parent view group."
I know this isn't really the proper answer to your question, but you should really consider using RelativeLayout instead of LinearLayout. It scales better to different phone screen resolutions, and you can place the buttons in the correct order by using the layout_toRightOf and layout_alignParentRight attributes in your XML (or layout_above, layout_alignParentTop, etc.). Using gravity in a linear layout won't really behave as you expect because Android is still attempting to place the widgets in a fixed position.
RelativeLayout is a bit more of a pain to get working than LinearLayout, but it's worth the trouble and is also the one which Google recommends using. Once you get the hang of it, they are very convenient to work with.

How to create layout like this?

I have a horizontal LinearLayout, inside which I have 2 TextViews. Let's say that the LinearLayout's width is 320px. If the TextViews don't fit into the LinearLayout (they are together wider than 320px), I want to somehow achieve this:
The second TextView is fully displayed and is at the right edge of the LinearLayout
The first TextView is only shown partially, only first x characters are visible
What I mean:
[TextView1|TextView2_________________________] // this is normal
[VeryVeryL...|VeryVeryLongTextView2] // VeryVeryLongTextView1 is not fully visible
To get the effect you're requesting in the comments above, you could modify Mayra's solution to something like:
<LinearLayout ...>
<TextView android:layout_width="wrap_content"
android:maxWidth="20dp"
android:layout_height="wrap_content"/>
<TextView android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"/>
I think that will work. Weirdly, the maxWidth param is only present on a couple view classes, but TextView luckily is one of them. You'd think it'd be useful in more cases, so I'm not sure why it's not just available in the default view params.
Specify a specific width for your first textView (i.e, 20dp... note, it is better to use dp than hard coded pixels, to deal with multiple resolutions of devices), give your 2nd TextView a weight of 1. This tells it to take up the remaining space. For example:
<LinearLayout ...>
<TextView android:layout_width="20dp"
android:layout_height="wrap_content"/>
<TextView android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"/>
</LinearLayout>

Categories

Resources