My problem is I want to keep 3 elements like Buttons for example I have used a RelativeLayout as parent and LinearLayout as it's child and given android:weightSum="3" and added 3 buttons as it's children. I have achieved the UI I want.
But here Comes the original problem When One of the Button Visibility state is gone. Elements not coming properly.
How Can I achieve even though when I hide one button other two need to adjust.
Please Provide the solution if you have.
Respective Code
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:orientation="horizontal"
android:weightSum="3.0">
<Button
android:id="#+id/btn1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_weight="1.0"
android:textColor="#ffffff"
android:text="TAB1" />
<Button
android:id="#+id/btn2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1.0"
android:text="TAB 2"
android:visibility="gone" />
<Button
android:id="#+id/btn3"
android:layout_width="wrap_content"
android:layout_alignParentLeft="true"
android:layout_height="wrap_content"
android:layout_weight="1.0"
android:text="TAB 3" />
</LinearLayout>
</RelativeLayout>
</LinearLayout>
You have to use relative layout instead of linear 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="wrap_content"
android:orientation="horizontal"
android:weightSum="3">
<Button
android:id="#+id/btnOne"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_weight="1"
android:text="1"/>
<Button
android:id="#+id/btnTwo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_weight="1"
android:text="2"/>
<Button
android:id="#+id/btnThree"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_weight="1"
android:text="3"/>
if you set visibility gone for second button then you can achive this
or you can programetically remove the text of second button and set transperent background for this , like below code
<?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="wrap_content"
android:orientation="horizontal"
android:weightSum="3">
<Button
android:id="#+id/btnOne"
android:layout_width="0dp"
android:text="1"
android:layout_height="wrap_content"
android:layout_weight="1"/>
<Button
android:id="#+id/btnTwo"
android:background="#android:color/transparent"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"/>
<Button
android:text="3"
android:id="#+id/btnThree"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"/>
You don't have to set the android:weightSum attribute, just assign android:layout_weight=1 to every child.
https://developer.android.com/guide/topics/ui/layout/linear.html
To create a linear layout in which each child uses the same amount of space on the screen, set the android:layout_height of each view to "0dp" (for a vertical layout) or the android:layout_width of each view to "0dp" (for a horizontal layout). Then set the android:layout_weight of each view to "1" .
Use android:weightSum if you want to define the maximum weight sum. If unspecified, the sum is computed by adding the layout_weight of all of the children.
Code example:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"/>
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:visibility="gone"/>
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"/>
</LinearLayout>
android:visibility="invisible" Set this attribute for middle view.
And make sure that your child view (i.e Button) width is set to 0dp. Because you are using weight for width.
Try this-
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/activity_splash"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/white"
tools:context="com.augmented.wiki.SplashActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:weightSum="3">
<Button
android:id="#+id/activity_splash_btnImage"
android:layout_width="0dp"
android:text="Button 1"
android:layout_height="wrap_content"
android:layout_weight="1" />
<Button
android:id="#+id/activity_splash_btnImage1"
android:layout_width="0dp"
android:text="Button 2"
android:layout_height="wrap_content"
android:layout_weight="1"
android:visibility="invisible" />
<Button
android:id="#+id/activity_splash_btnImage2"
android:layout_width="0dp"
android:text="Button 3"
android:layout_height="wrap_content"
android:layout_weight="1"/>
</LinearLayout>
</RelativeLayout>
Related
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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/btn1"
android:layout_width="wrap_content"
android:layout_height="match_parent" />
<Button
android:id="#+id/btn2"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_toRightOf="#+id/btn1"/>
<Button
android:id="#+id/btn2"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_toRightOf="#+id/btn1"/>
<!--x7-->
I put 7 buttons in its relativelayout. And I'd like to adjust their 'width' to the same size to fit the screen. What should I do
You can use LinearLayout as a parent and can give weight and weightsum to achieve that, Using Relative layout you can't fit the entire screen or it may exceed the screen based on the device.
You can achieve this using LinearLayout like below,
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:weightSum="7"
android:layout_height="match_parent">
<Button
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content" />
<Button
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content" />
<Button
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content" />
<Button
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content" />
<Button
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content" />
<Button
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content" />
<Button
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content" />
</LinearLayout>
If you're thinking of displaying each button (height= match_parent), then use scrollview. I hope this helps
In some ListView's holder I got empty spaces even it has a small text in it.
TextView is set to wrap_content. My listview layout xml item has several buttons. I just set these buttons VISIBILITY.GONE.
<?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="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:id="#+id/textView"
android:gravity="center" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="photo"
android:id="#+id/photo"
android:layout_gravity="center_horizontal" />
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:baselineAligned="false"
android:clickable="false"
android:focusable="false">
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="New Button"
android:id="#+id/left" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="New Button"
android:id="#+id/right" />
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:baselineAligned="false"
android:clickable="false"
android:focusable="false" >
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/editText"
android:layout_gravity="center_horizontal"
android:layout_weight="4"
android:gravity="center_horizontal"
android:hint="#string/answer"
android:maxLength="4" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/ok"
android:id="#+id/ok" />
</LinearLayout>
</LinearLayout>
Put the root as wrap_content instead of match_parent for the height.
What will happen in a vertically scrolling listview (read, infinite height available for children) if it's children say they want match_parent?
Can't see your image, but in a RecyclerView, each item's height would be the height of the RecyclerView.
Instead of using "match_parent" in the top use "wrap_content" for height
My layout is like this
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<EditText
android:id="#+id/searchKey"
android:gravity="center_horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="xx" />
<ScrollView
android:layout_weight="1"
android:fillViewport="true"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/search_results"
android:textSize="#dimen/text_font_size"
android:layout_gravity="center_horizontal"
android:gravity="center_horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</ScrollView>
<LinearLayout
android:orientation="horizontal"
android:layout_gravity="center|bottom"
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/lastCharacterButton"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/lastChar_btn" />
<Button
android:id="#+id/nextCharacterButton"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/nextChar_btn" />
</LinearLayout>
</LinearLayout>
However, when there are little or no text, the buttons are pulled up, when there are too many text in search_results TextView, the buttons won't show up because scrollview takes the space all the way to the bottom. Any suggestion to always keep the buttons at the bottom and always visible?
First of all you have to set the ScrollView's height to 0dp.
<ScrollView
android:layout_weight="1"
android:fillViewport="true"
android:layout_width="match_parent"
android:layout_height="0dp">
<TextView
android:id="#+id/search_results"
android:textSize="#dimen/text_font_size"
android:layout_gravity="center_horizontal"
android:gravity="center_horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</ScrollView>
You have to do this because the weight param is going to control the size of the view depending on how much space is available. If you set it to wrap content, it will take how much space it needs to wrap everything within.
Then you need to remove your LinearLayout's weight param:
<LinearLayout
android:orientation="horizontal"
android:layout_gravity="center|bottom"
android:id="#+id/LL1"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/lastCharacterButton"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Last_Char" />
<Button
android:id="#+id/nextCharacterButton"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="next_char" />
</LinearLayout>
And the reason for doing that is just the opposite of the previous explanation: in this case the wrap content is going to take the space necessary to always display the buttons within.
Here is some sample code I put together for you. You basically need to take out the linear layout you have wrapping you xml layout and use a relative layout instead. Once you do that you can add ids to the linear layout with the buttons and then have the edit text align to the parent top. Then you can put the scrollview below the edittext and then put the scrollview above to the linear layout containing the buttons. This should work!
<?xml version="1.0" encoding="utf-8"?>
<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"
tools:context="com.example.thegamefan93.loginregister.LoginActivity">
<EditText
android:id="#+id/searchKey"
android:gravity="center_horizontal"
android:layout_width="match_parent"
android:layout_alignParentTop="true"
android:layout_height="wrap_content"
android:hint="xx" />
<ScrollView
android:layout_weight="1"
android:fillViewport="true"
android:layout_below="#id/searchKey"
android:layout_width="match_parent"
android:layout_above="#+id/LL1"
android:layout_height="wrap_content">
<TextView
android:id="#+id/search_results"
android:textSize="20sp"
android:layout_gravity="center_horizontal"
android:gravity="center_horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</ScrollView>
<LinearLayout
android:orientation="horizontal"
android:layout_gravity="center|bottom"
android:layout_weight="1"
android:id="#+id/LL1"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/lastCharacterButton"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Last_Char" />
<Button
android:id="#+id/nextCharacterButton"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="next_char" />
</LinearLayout>
</RelativeLayout>
Try 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:orientation="vertical">
<EditText
android:id="#+id/searchKey"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:hint="xx" />
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/linear"
android:layout_below="#+id/searchKey"
android:layout_weight="1"
android:fillViewport="true">
<TextView
android:id="#+id/search_results"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:gravity="center_horizontal"
android:textSize="#dimen/text_font_size" />
</ScrollView>
<LinearLayout
android:id="#+id/linear"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="horizontal">
<Button
android:id="#+id/lastCharacterButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/lastChar_btn" />
<Button
android:id="#+id/nextCharacterButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/nextChar_btn" />
</LinearLayout>
</RelativeLayout>
I have a linear layout with two listviews, a text view, and another linear layout to hold some buttons. I want the second listview to be twice the height of the first. I have set the height of both list views to 0dp and gave the first a layout_weight of 1 and the second a weight of 2, and then set the weightSum of the containing view to 3. Here is the actual layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:weightSum="3"
android:layout_height="match_parent">
<ListView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:id="#+id/categoryList" />
<ListView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="2"
android:id="#+id/itemList" />
<TextView
android:id="#+id/walletStr"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/cancelBtn"
android:text="cancel"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<Button
android:id="#+id/buyBtn"
android:text="buy"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
On the simulator, this produces the desired effect, but on the actual device almost all of the space goes to the top listview.
Any ideas? Thanks in advance.
linear layout not have only 2 list, also have more component and you have to consider.
The weightSum should be divided all component of this linear layout.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:weightSum="7"
android:layout_height="match_parent">
<ListView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="2"
android:id="#+id/categoryList" />
<ListView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="4"
android:id="#+id/itemList" />
<TextView
android:id="#+id/walletStr"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.5"/>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.5">
<Button
android:id="#+id/cancelBtn"
android:text="cancel"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<Button
android:id="#+id/buyBtn"
android:text="buy"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
I'm trying to align LinearLayout's vertical center which shows following pic (skycolor border) to delete button's vertical center.
so I set the gravity of id:groupNumbers to center_vertical.
but no changed.
How to align id:groupNumbers to button's center?
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/groupNumbers"
android:orientation="horizontal"
android:gravity="center_vertical"
android:layout_weight="0.7"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="horizontal"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="#+id/txtSelected01"
android:text="00"
android:textSize="30dp"
android:gravity="center_horizontal"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="#+id/txtSelected02"
android:text="00"
android:textSize="30dp"
android:gravity="center_horizontal"
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"/>
</LinearLayout>
</LinearLayout>
<Button
android:id="#+id/btn_deleteNum"
android:text="Delete"
android:textSize="20dp"
android:layout_weight="0.2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
Change orientation and gravity in
<LinearLayout
android:id="#+id/groupNumbers"
android:orientation="horizontal"
android:gravity="center_vertical"
android:layout_weight="0.7"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
to
android:orientation="vertical"
android:layout_gravity="center_vertical"
You are adding orientation: horizontal, so the layout will contain all elements in single horizontal line. Which won't allow you to get the element in center.
use android:layout_gravity instead of android:gravity
android:gravity sets the gravity of the content of the View its used on.
android:layout_gravity sets the gravity of the View or Layout in its parent.
Use layout_gravity instead of gravity. layout_gravity tells the parent where it should be positioned, and gravity tells its child where they should be positioned.
<LinearLayout
android:id="#+id/groupNumbers"
android:orientation="horizontal"
android:layout_gravity="center_vertical"
android:layout_weight="0.7"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
For me, I have fixed the problem using android:layout_centerVertical="true" in a parent RelativeLayout:
<RelativeLayout ... >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_centerVertical="true">
</RelativeLayout>
For a box that appears in the center - horizontal & vertical - I got this to work with just one LinearLayout. The answer from Viswanath L was very helpful
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#drawable/layout_bg"
android:gravity="center"
android:orientation="vertical"
android:padding="20dp">
<TextView
android:id="#+id/dialog_header"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:padding="10dp"
android:text="Error"
android:textColor="#000" />
<TextView
android:id="#+id/message_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:padding="10dp"
android:text="Error-Message"
android:textColor="#000" />
<Button
android:id="#+id/dialogButtonOK"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/message_text"
android:layout_gravity="center_horizontal"
android:layout_marginTop="5dp"
android:text="Ok" />
</LinearLayout>
use RelativeLayout inside LinearLayout
example:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:text="Status"/>
</RelativeLayout>
</LinearLayout>
Use android:weightSum property to the parent LinearLayout and give value 3. Then in the children LinearLayout use android:layout_weight 2 and 1 respectively. Then in the First Chil LinearLayout use android:layout_gravity="center_vertical". As shown in the following code
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="3"
android:orientation="horizontal">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="2"
android:layout_gravity="center_vertical"
android:orientation="horizontal">
<TextView
android:id="#+id/status_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="00"
android:textColor="#color/red"
android:textSize="#dimen/default_text_size"
/>
<TextView
android:id="#+id/status_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="00"
android:textColor="#color/red"
android:textSize="#dimen/default_text_size"
/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1">
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Delete"/>
</LinearLayout>
</LinearLayout>
You can change set orientation of linearlayout programmatically by:
LinearLayout linearLayout =new linearLayout(this);//just to give the clarity
linearLayout.setOrientation(LinearLayout.VERTICAL);