I always face this problem and I feel that I design it bad.
if I want to display an activity (settings type of activity) where my user can input a name, choose an item, and check a toggle item. As follows I would like to align the EditText, spinner and button under neath each other in which they occupy the right half of the screen and the text occupies the left side.
Do I use
Nested linear layouts with weights (which I never seem to get it right)
Relative Layout where I align things and I use center in parent property to get it starting from half screen (too many IDs are defined in XML file even for lables that I won't use in the code)
Table layout
Which one you recommend? or maybe how?
For perfect alignment I think the TableLayout is the best option in your case. You can do this using other two options. But if the text length of the left side changes then you may need to change the xml layouts. But by using tableLayout that will be more easy to manage.
From the image you provided above, it seems you have TextDetails on left side and View on right such that right view must start from centerVertical. Is it right??
I suggest you use TableLayout... Add your views as you mentioned above..
You can set width hardcoded so that they remain intact always like this..
float screenWidth = ((Activity) context).getWindowManager()
.getDefaultDisplay().getWidth();
then your views both TextDetails and View's add setWidth(screenWidth / 2);
I think you need to go throw Android desing patters. There are some tips about how to do this better. On my opinion - just use LinearLayout and manipulate with their gravity/margin/padding. Or use RelativeLayout instead like google recommends.
Best wishes.
Related
The layout of my MainActivity on my phone appears very differently than the layout I see on the code editor. Images are included. I am using a TabbedView. However, the problem still exists on any layout I choose (empty/tabbed).
What can I do to solve this problem?
I am concerned about the text "Hello world" in the middle, not in the top left corner. I follow this tutorial and in the tutorial it is correctly positioned.
It works as expected, because section_label TextView width is wrap_content it changes, depending on what text it displays. And the 2nd TextViews position depends on it, so it changes too. You should be able to verify this by setting various length texts in your layout editor.
For what you want to achieve, RelativeLayout is not the best choice and you may want to use i.e. LinearLayout instead, with its orientation set to vertical and layout_gravity of second TextView set to right
This is happen because you are using the RelativeLayout in the relativelayout we can arrage our views in custom position wise by the help of give the android:id=#+id/some_id like this if you want your second view is shown just below the first view then give them the property android:layout_below="#id/view1" in your second view
Please read all the documentation of RelativeLayout form this link
https://developer.android.com/guide/topics/ui/layout/relative.html
I am relatively new to Android UI. I always get confuse in providing margin to different view like should i provide bottom margin or should i use top margin(to view below it). Also should i use RelativeLayout or LinearLayout if both can solve my problem.
Thanks
It Depends on your need
Linear Vs Relative
If you just want to stack your TextView and Button horizontally or vertically you should go with LinearLayout.
If you want to make a layout that is more complex for example you can have an ImageView covering all of the screen and Button over the ImageView or if you want your layout elements to be stack on corners or at bottom, RelativeLayout is your Guy.
Top margin vs Bottom Margin
It doesn't make much a difference its a personal preference, I Use margin-bottom on first element rather than margin-top for second element.
One noticeable difference is when you are working with Show layout bounds during development. You can see here those pink coloration indicate that it is using margin on its view while padding has no coloration. Recently I prefer to use padding if applicable with my requirements as it seems more cleaner to inspect UI when Show layout bounds is enabled from Developer option.
The image is not mine and was just use as a quick sample.
If both Linear and RelativeLayout will solve your layout, then you should use Linear as it is faster to render.
With regards to top vs. bottom Margin. That's entirely your preference and how you want to think about the elements. Does Item A always sit 40dp above the next item or does Item B always sit 40dp below the previous item?
I'm making a chat for Android and I need to make a main xml layout.
There is going to be a TextView to display history, EditText and Send Button. All view should be positioned like in whatsapp. EditText and Button at the bottom of a screen. The rest of the space goes to the TextView.
So how is it possible to do it, so it would look nice at any screen and any orientation?
I tried to do it with android:layout_weight, but I don't think it's going to be very portable.
Thanks in advance.
I don't think a single TextView is the best way to achieve this.
I'd recommend using a ListView instead of a giant TextView to hold the entire conversation history. Each element in the ListView would hold a single TextView and any other required views to display each message in the history, and it will by default allow for scrolling up and down to view the entire history. You can then just adjust the text size to handle different screen sizes.
This is how the default Android Messaging app is implemented, but you can customize each item in the ListView to make it look how you want (like WhatsApp, for example).
Hope this helps.
because layout_weight sets the proportions, but the height of my editText/Button is fixed
So? Don't put android:layout_weight on the fixed portion.
So for different screen sizes, diffrerent height would be given to them, leaving some space.
Then don't put android:layout_weight on the fixed portion. You are hitting yourself on the head with a hammer, then complaining that your head hurts.
Step #1: Vertical LinearLayout.
Step #2: Transcript TextView inside the LinearLayout, with a height of 0 and a weight of 1.
Step #3: EditText and Button (in a horizontal LinearLayout?), inside the vertical LinearLayout, with a height of wrap_content and no weight specified (defaults to 0).
Your fixed-height stuff, with a height of wrap_content, will get its allocation of pixels, and your transcript TextView will get all remaining pixels, courtesy of its weight of 1.
I also echo physphil's suggestion to use a ListView in transcript mode for your chat transcript, rather than the TextView.
I have a very simple layout with two side by side textviews. Both have the same parent layout that fills the screen horizontally.
I need them to have a visible space between them so that they are visually seperated when both have text. I also need the left textview to take up about 2/3 the screen width and let the other have the rest.
This is fairly easy to do with LinearLayout and a few margin settings, but if either one of the views has no text, I need the other one to fill the entire width.
I'm not quite sure how to have the layout do that without setting the empty view's visibility to GONE in code. Is there any good, efficient way to do all of these things at once? Feel free to use any layout you wish to make it work.
have you tried this using a relative layout? there is a property for layout_alignWithParentIfMissing that might give you what you need...
Seeking help to design a layout as shown here:
http://docs.google.com/Doc?docid=0AQhgDtGvE2HgZGZ6cmtua185MTd0eGdyZmc&hl=en
The major challenge I face is aligning the components at desired positions. Please refer the three buttons(icons) and the way they are positioned.
Literally, going nuts, thinking how to position those exactly at the desired places.
Any help is much appreciated.
Regards,
Rony
Since you used the Android category, I'm assuming that you're trying to recreate this iPhone layout in Android.
The three buttons would probably be best laid as follows.
Your main layout container would probably be a RelativeLayout, so you can dock things to the top and bottom and lay everything else out in relation to one of its sibling elements. The three button icons (and I'm assuming you're referring to the circular buttons and not the tab bar buttons at the very bottom) would be in a LinearLayout centered within its parent (probably want to use gravity=center_horizontal on the main outer layout) and the individual items would have an equal left and right margin parameters to get the desired spacing (layout_marginLeft, layout_marginRight). You could also make the LinearLayout container of the buttons flush (layout_width=fill_parent) and using android:weight attribute on the outer buttons laying them out towards the center and using a lower weight on the center item. I'd favor the first option, personally.
If you're trying to create relatively complex layouts and any of the above doesn't make sense, go back and read the docs. Layout in Android is very powerful, but you really have to understand the available tools to take advantage of it.