Rearrange RelativeLayout child through java code in android - java

I'm working on a currency converter app. Everything is working fine. I'm using Nested Linear and Relative Layouts in my xml file. I have arranged the layouts one above the other in RelativeLayout like this. (SIMPLE IDEA)
--------------RelativeLayout----------
------FirstRow------
------Divider-------
-----secondRow------
--------------/RelativeLayout/----------
I've set the divider below firstRow and then secondRow below divider in xml. Now i want to rearrange the rows like this.
--------------RelativeLayout----------
------secondRow------
------Divider-------
-----firstRow------
--------------/RelativeLayout/----------
I'm trying to do like this divider below secondRow and firstRow below divider. but its giving me circular dependencies error. I know all about circular dependencies and i believe the java code is not reseting the above layoutparams, instead its something like merging the two layouts which will definitely shoot circular dependencies error.
XML CODE
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:id="#+id/firstRow"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/activity_horizontal_margin"
android:layout_marginRight="#dimen/activity_horizontal_margin"
android:orientation="horizontal">
<LinearLayout
android:id="#+id/namelayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:gravity="center_vertical"
android:orientation="horizontal">
<ImageView
android:id="#+id/img"
android:layout_width="40dp"
android:layout_height="40dp"
android:background="#drawable/ic_sampleicon" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_margin="#dimen/activity_horizontal_margin"
android:orientation="vertical">
<TextView
android:id="#+id/name"
style="#style/TextLableMyTheme"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="" />
<TextView
android:id="#+id/brand"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=""
android:textColor="#f7f7f7" />
</LinearLayout>
</LinearLayout>
<TextView
android:id="#+id/tvpoints"
style="#style/TextCurrencyMyTheme"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:text="" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/divider"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/firstRow"
android:layout_marginLeft="#dimen/activity_horizontal_margin"
android:layout_marginRight="#dimen/activity_horizontal_margin"
android:orientation="horizontal">
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_centerInParent="true"
android:background="#drawable/background_gradient_light" />
<ImageView
android:id="#+id/switcherImg"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_centerInParent="true"
android:src="#drawable/ic_settings"
android:tint="#f7f7f7" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/secondRow"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/divider"
android:layout_marginLeft="#dimen/activity_horizontal_margin"
android:layout_marginRight="#dimen/activity_horizontal_margin"
android:orientation="horizontal">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:gravity="center_vertical"
android:orientation="horizontal">
<ImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:src="#drawable/ic_cash"
android:tint="#ffe100" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_margin="#dimen/activity_horizontal_margin"
android:orientation="vertical">
<TextView
android:id="#+id/name2"
style="#style/TextLableMyTheme"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Riyal" />
<TextView
android:id="#+id/brand2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=""
android:textColor="#f7f7f7" />
</LinearLayout>
</LinearLayout>
<TextView
android:id="#+id/tv"
style="#style/TextCurrencyMyTheme"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:text="0.0" />
</RelativeLayout>
</RelativeLayout>
Java Code to update params
RelativeLayout.LayoutParams _firstRowParams =
(RelativeLayout.LayoutParams)_firstRow.getLayoutParams();
_firstRowParams.addRule(RelativeLayout.BELOW, R.id.divider);
RelativeLayout.LayoutParams _dividerParams =
(RelativeLayout.LayoutParams)_divider.getLayoutParams();
_dividerParams.addRule(RelativeLayout.BELOW, R.id.secondRow);
/* _firstRow.setLayoutParams(_firstRowParams);
_divider.setLayoutParams(_dividerParams);*/

Try adding below code:
RelativeLayout.LayoutParams _secondRowParams =
(RelativeLayout.LayoutParams)_secondRow.getLayoutParams();
_secondRowParams.addRule(RelativeLayout.ALIGN_PARENT_TOP);
_secondRowParams.removeRule(RelativeLayout.BELOW);
Try with above code. It worked for me. You need to remove previous Below rule to avoid circular dependency.

As #Luksprog have mentioned about removing the existing rules before adding the new ones this code snippet will work.
RelativeLayout.LayoutParams _firstRowParams =
(RelativeLayout.LayoutParams)_firstRow.getLayoutParams();
_firstRowParams.removeRule(EXISIING_RULE)//RelativeLayout.Below or RelativeLayout.Above or any other
_firstRowParams.addRule(RelativeLayout.BELOW, R.id.divider);
RelativeLayout.LayoutParams _dividerParams =
(RelativeLayout.LayoutParams)_divider.getLayoutParams();
_dividerRowParams.removeRule(EXISIING_RULE)//RelativeLayout.Below or RelativeLayout.Above or any other
_dividerParams.addRule(RelativeLayout.BELOW, R.id.secondRow);

Related

How can I conditionally 'remove' or hide a button?

I have a fragment containing a recyclerView.
When an item is clicked on in the recyclerView I set the recyclerview item background to green and change the "saveBtn" text to "Update".
I need to also be able to remove the "deletebtn" every time a user clicks on a recyclerView item, or hide it so that the UI looks somewhat like this:
How could this be done?
Method I am using to update UI on recyclerView click
public void onExerciseClicked(int position) {
saveBtn.setText("Update");
clearBtn.setText("Delete");
}
XML
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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="match_parent"
android:background="#drawable/gradientfrozen"
android:id="#+id/constraint_layout21">
<LinearLayout
android:layout_width="0dp"
android:layout_height="0dp"
android:background="#292929"
android:orientation="vertical"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/textView5"
android:layout_width="327dp"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:paddingLeft="20dp"
android:layout_marginTop="10dp"
android:text="WEIGHT (kgs)"
android:textColor="#android:color/background_light"
android:textSize="16dp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="75dp"
android:layout_marginLeft="30dp"
android:layout_marginRight="30dp"
android:orientation="horizontal">
<Button
android:id="#+id/dec_weight"
android:layout_width="1dp"
android:layout_height="50dp"
android:layout_weight="0.5"
android:background="#drawable/down22"
android:textColor="#color/design_default_color_background" />
<EditText
android:id="#+id/editTextWeight"
android:layout_width="80dp"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_weight="1"
android:backgroundTint="#color/green"
android:ems="10"
android:gravity="center"
android:hint="0.0"
android:inputType="numberDecimal"
android:singleLine="false"
android:textColor="#color/design_default_color_background"
android:textColorHint="#color/light_grey"
android:textSize="30sp" />
<Button
android:id="#+id/inc_weight"
android:layout_width="1dp"
android:layout_height="50dp"
android:layout_weight="0.5"
android:background="#drawable/up22" />
</LinearLayout>
<TextView
android:id="#+id/textView8"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="20dp"
android:text="REPS"
android:textColor="#android:color/background_light"
android:textSize="16dp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="80dp"
android:layout_marginLeft="30dp"
android:layout_marginRight="30dp"
android:orientation="horizontal">
<Button
android:id="#+id/dec_reps"
android:layout_width="1dp"
android:layout_height="50dp"
android:layout_weight="1.6"
android:background="#drawable/down22"
android:shadowColor="#color/design_default_color_background" />
<EditText
android:id="#+id/editTextReps"
android:layout_width="161dp"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_weight="1"
android:backgroundTint="#color/green"
android:ems="10"
android:gravity="center"
android:hint="0"
android:inputType="number"
android:textColor="#color/design_default_color_background"
android:textColorHint="#color/light_grey"
android:textSize="30sp" />
<Button
android:id="#+id/inc_reps"
android:layout_width="1dp"
android:layout_height="50dp"
android:layout_weight="1.6"
android:background="#drawable/up22" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:orientation="horizontal">
<Button
android:id="#+id/save_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_weight="1"
android:background="#drawable/my_small_green_shape"
android:text="Save"
android:textColor="#ffffff"
android:textSize="20sp" />
<Button
android:id="#+id/clear_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_weight="1"
android:background="#drawable/my_small_red_shape"
android:text="Clear"
android:textColor="#ffffff"
android:textSize="20sp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:orientation="horizontal">
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="Set"
android:textColor="#android:color/holo_green_light" />
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="Kgs"
android:textColor="#android:color/holo_green_light" />
<TextView
android:id="#+id/textView7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="Reps"
android:textColor="#android:color/holo_green_light" />
</LinearLayout>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/completed_exercise_ListView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginLeft="25dp"
android:layout_marginRight="25dp"
android:background="#292929"
tools:listitem="#layout/completed_exercise_item" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
Using LinearLayout as a direct child of ConstraintLayout defeats the whole purpose of using ConstraintLayout. It is not a good practice to use nested layout from the performance point of view. Besides, if deleteBtn is direct child of ConstraintLayout, then setting the layout_width of saveBtn to match_constraint will enable it to take up the whole space if we change the visibility of deleteBtn to gone.
cgb_pandey's answer is great and it is the recommended approach since your root viewgroup is ConstraintLayout. However, I wanted to present you an alternative way to do this using your current LinearLayout approach.
All you need to do is to set the width of both bottoms to 0dp. This way, their weight would determine how much space they occupy. If both view are visible, each of them would have 50% of the total width of the screen. If only one of the buttons is visible, it would occupy the entire screen. Here's a code snippet to guide you:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:orientation="horizontal">
<Button
android:id="#+id/save_btn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_weight="1"
android:background="#drawable/my_small_green_shape"
android:text="Save"
android:textColor="#ffffff"
android:textSize="20sp" />
<Button
android:id="#+id/clear_btn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_weight="1"
android:background="#drawable/my_small_red_shape"
android:text="Clear"
android:textColor="#ffffff"
android:textSize="20sp" />
</LinearLayout>
Not that this approach involves nesting layouts and this might affect performance in the long run and also complicate your layout code pretty fast.

How to align Two TextViews next to each other in LinnearLayouts?

I am trying to put two TextViews next to each other but somehow I can't get it to work. I wanted to have the following: txtViewAddress: txtAddress
I've tried putting android:layout_toRightOf="#id/txtViewAddress"
I also tried putting layout_toLeftOf, but both did not work.
Hope you guys can help me out. Thanks in advance.
<?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:id="#+id/CalendarID"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=""
android:textAppearance="?android:attr/textAppearanceMedium"
android:visibility="gone" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<LinearLayout
android:layout_width="480dp"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/txtViewAddress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Address: "
android:textAppearance="?android:attr/textAppearanceMedium"
android:textSize="22dp"
android:textStyle="bold"/>
<TextView
android:id="#+id/txtAddress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toEndOf="#id/txtViewAddress"
android:text="Hello"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textSize="22dp"
android:textStyle="bold"/>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:gravity="right"
android:orientation="horizontal">
<Button
android:id="#+id/btn_update"
android:layout_width="45dp"
android:layout_height="35dp"
android:layout_marginRight="5dp"
android:layout_marginTop="100dp"
android:background="#drawable/edit"
android:focusable="false"
android:focusableInTouchMode="false"
android:text="" />
<Button
android:id="#+id/btn_delete"
android:layout_width="38dp"
android:layout_height="24dp"
android:layout_marginRight="5dp"
android:layout_marginTop="100dp"
android:background="#drawable/delete"
android:focusable="false"
android:focusableInTouchMode="false"
android:text="" />
</LinearLayout>
</LinearLayout>
If you need views inside a linear layout next to each other, the orientation of your layout must be horizontal.
You can also use the constraint layout, it has much more flexibility in placing view on your screen.
android:layout_toRightOf="#id/txtViewAddress" is atrribute part of Relative Layout
Use this code
<LinearLayout
android:layout_width="480dp"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/txtViewAddress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Address: "
android:textAppearance="?android:attr/textAppearanceMedium"
android:textSize="22dp"
android:textStyle="bold"/>
<TextView
android:id="#+id/txtAddress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toEndOf="#id/txtViewAddress"
android:text="Hello"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textSize="22dp"
android:textStyle="bold"/>
</LinearLayout>
<LinearLayout
android:layout_width="480dp"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="2">
<TextView
android:id="#+id/txtViewAddress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Address: "
android:layout_weight="1"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textSize="22dp"
android:textStyle="bold"/>
<TextView
android:id="#+id/txtAddress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toEndOf="#id/txtViewAddress"
android:layout_weight="1"
android:text="Hello"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textSize="22dp"
android:textStyle="bold"/>
</LinearLayout>
change the android:orientation="vertical" to android:orientation="horizontal"
and you can also use android:weightSum="2" weightSum is used to define the priority of the view
if you give equal weight to all views inside linear layout then all the views take on equal amount of space inside the Linear Layout
this should be like following
<LinearLayout
android:layout_width="480dp"
android:layout_height="wrap_content"
android:orientation="horizontal">
.....
......
.....
</LinearLayout>
and also I suggest that do not give fix width to layout instead you set it releted to screen size

Android TextView being cut off by gravity=center

I'm displaying a lot of textviews in a linear layout and setting gravity to center causes the words to be cut off. I'm runnning a Nexus S in the emulator.
<LinearLayout
android:layout_width="585dp"
android:layout_height="810dp"
android:orientation="vertical"
tools:layout_editor_absoluteX="8dp"
tools:layout_editor_absoluteY="8dp">
<TextView
android:id="#+id/TeamName4"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Team 2 Name"
android:textAppearance="#android:style/TextAppearance.Theme"
android:textSize="20sp"
android:textStyle="bold|italic"/>
<EditText
android:gravity="center"
android:id="#+id/TeamScore1"
android:layout_width="40dp"
android:layout_height="wrap_content"
android:ems="10"
android:inputType="number" />
<TextView
android:id="#+id/TeamName2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Team 2 Name"
android:textAppearance="#android:style/TextAppearance.Theme"
android:textSize="20sp"
android:textStyle="bold|italic" />
<EditText
android:gravity="center"
android:id="#+id/TeamScore2"
android:layout_width="40dp"
android:layout_height="wrap_content"
android:ems="10"
android:inputType="numberSigned" />
That's a snippet of the code. I experience the same issue with all my other textViews. Any advice how to make the text appear in the center of the screen?
Don't use hardcoded height and width for linear layout
Use match_parent as height and width for LinearLayout for your particular code.
Always prefer to use match_parent or wrap_content, it will be helpful when your application runs on devices with different screen sizes
Go through below link for more understanding
https://developer.android.com/training/multiscreen/screensizes#TaskUseWrapMatchPar
Modify your LinearLayout Properties like:
(It will make your text appear in the center of the screen)
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/TeamName4"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Team 2 Name"
android:textAppearance="#android:style/TextAppearance.Theme"
android:textSize="20sp"
android:textStyle="bold|italic"/>
.......
.......
</LinearLayout>
Use code like this:
Why you set a height and width Static/Fixed. Generally use a height and width "wrapcontent" or "matchparent"
<LinearLayout 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:orientation="vertical"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
tools:layout_editor_absoluteX="8dp"
tools:layout_editor_absoluteY="8dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
tools:layout_editor_absoluteX="8dp"
tools:layout_editor_absoluteY="8dp">
<TextView
android:id="#+id/TeamName4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Team 2 Name"
android:textAppearance="#android:style/TextAppearance.Theme"
android:textSize="20sp"
android:textStyle="bold|italic" />
<EditText
android:id="#+id/TeamScore1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ems="10"
android:gravity="center"
android:inputType="number" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
tools:layout_editor_absoluteX="8dp"
tools:layout_editor_absoluteY="8dp">
<TextView
android:id="#+id/TeamName2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Team 2 Name"
android:textAppearance="#android:style/TextAppearance.Theme"
android:textSize="20sp"
android:textStyle="bold|italic" />
<EditText
android:id="#+id/TeamScore2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ems="10"
android:gravity="center"
android:inputType="numberSigned" />
</LinearLayout>
</LinearLayout>
</LinearLayout>

Different XML in mobile

I have this XML 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">
<EditText
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/editText"
android:hint="enter your name"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="button"
android:id="#+id/button"
android:layout_below="#+id/editText"
android:layout_centerHorizontal="true"
android:layout_marginTop="20dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="name"
android:id="#+id/textView8"
android:layout_below="#+id/button"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginLeft="20dp"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/button2"
android:text="copy"
android:layout_alignBottom="#+id/textView8"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />
</RelativeLayout>
In AVD, it looks like this:
And in mobile, it looks like this:
How can I make them look the same?
This discrepancy occurs because you're using the RelativeLayout quite carelessly. Relative Layout positions items relatively to one another, so it might look different across different devices.
I'd suggest that you use one vertical LinearLayout and to have it have 2 horizontal LinearLayouts as its children, as the rows in which you put these fields. I will provide some modified code of yours below, but keep in mind that this will look the same on each device, and you need to make it look prettier, as this is just an example. Something like this:
<LinearLayout 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:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="wawdsd"/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:baselineAligned="true">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="name"
android:id="#+id/textView8" />
<EditText
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/editText"
android:hint="enter your name" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="button"
android:id="#+id/button"
android:layout_marginTop="20dp"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/button2"
android:text="copy"/>
</LinearLayout>

Center button in a LinearLayout

I just want to center "CenterButton" (center of the root LinearLayout) but Androids just not cooperating..
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_gravity="center_horizontal"
android:layout_weight="0.00"
android:padding="5dp"
android:background="#zegerg"
android:id="#+id/LinearLayout1">
<ImageView
android:id="#+id/ImageView1"
android:layout_height="match_parent"
android:layout_width="151dp"
android:src="#mipmap/image_1"
android:contentDescription="#string/abcdef"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button"
android:id="#+id/CenterButton"
android:layout_gravity="center_horizontal|center_vertical|center"/>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="20dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Text !"
android:id="#+id/TextView"
android:paddingBottom="30dp"
android:textColor="#37a52c" />
<ProgressBar
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/ProgressBar"
android:paddingBottom="30dp"
android:progressTint="#37a52c" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/text_text"
android:id="#+id/Button2"
android:layout_gravity="center_horizontal" />
</LinearLayout>
</LinearLayout>
Tried putting it at the end of the XML but doesn't work because the other elements push it aside.. not really sure what's happening.
if you want to have all three first level children to be in equally-sized columns, then you need to add to all of them the followings attribute:
android:layout_width="0dp"
android:layout_weight="1"
(don't forget the dimension "dp" to the width parameter, otherwise the IDE will complain).
...
<ImageView
android:id="#+id/ImageView1"
android:layout_height="match_parent"
android:layout_width="0dp"
android:layout_weight="1"
android:src="#mipmap/image_1"
android:contentDescription="#string/abcdef"/>
<Button
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:text="Button"
android:id="#+id/CenterButton"
android:layout_gravity="center_horizontal|center_vertical|center"/>
<LinearLayout
android:orientation="vertical"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="match_parent"
android:padding="20dp">
....
EDITED:
If you want your CenterButton to overlap all the other views, then what you have to do is:
wrap everything in a relative layout with height equal to 200dp, as its first child
remove the button CenterButton from the current position and add it at the bottom of everything, still inside the relative layout, but below the linear layout
add those properties to the button to make it center in the parent
android:layout_centerInParent="true"
So finally you will have something like this (I have changed some resources):
<?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="200dp">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_gravity="center_horizontal"
android:layout_weight="0.00"
android:padding="5dp"
android:background="#android:color/holo_orange_dark"
android:id="#+id/LinearLayout1">
<ImageView
android:id="#+id/ImageView1"
android:layout_height="match_parent"
android:layout_width="0dp"
android:layout_weight="1"
android:src="#drawable/plus"
android:contentDescription="abcdef"/>
<LinearLayout
android:orientation="vertical"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="match_parent"
android:padding="20dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Text !"
android:id="#+id/TextView"
android:paddingBottom="30dp"
android:textColor="#37a52c" />
<ProgressBar
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/ProgressBar"
android:paddingBottom="30dp"
android:progressTint="#37a52c" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="text"
android:id="#+id/Button2"
android:layout_gravity="center_horizontal" />
</LinearLayout>
</LinearLayout>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="Button"
android:id="#+id/CenterButton"
android:layout_gravity="center_horizontal|center_vertical|center"/>
</RelativeLayout>
You can use weight for such purposes for child items. Make layout_width for all of them as 0dp and set layout_weight as 1.
Give the three children in the topmost linear layout a gravity of 1 and a width of 0.
It's not clear what exactly is your problem. However, here are some general notes :
To center a View or a Layout inside RelativeView use layout_centerInParent="true"
To make a Layout on top of other layouts use FrameLayout
The order of the views/layouts in your xml file is important. The one you write the last will be on the top (in our example : the FrameLayout or just the CenterButton should be written after the other views and layouts in your xml file)
To distribute the available space inside LinearLayout among its views use android:layout_weight="1" (change the value according to your needs)
you can play aground with this example :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="200dp">
<LinearLayout
android:id="#+id/LinearLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:background="#fff"
android:orientation="horizontal"
android:padding="5dp">
<ImageView
android:id="#+id/ImageView1"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="3"
android:src="#mipmap/ic_launcher" />
<View
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="3"
android:orientation="vertical">
<TextView
android:id="#+id/TextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingBottom="30dp"
android:text="Text !"
android:textColor="#37a52c" />
<ProgressBar
android:id="#+id/ProgressBar"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingBottom="30dp"
android:progressTint="#37a52c" />
<Button
android:id="#+id/Button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="text_text" />
</LinearLayout>
</LinearLayout>
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true">
<Button
android:id="#+id/CenterButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center_vertical|center"
android:text="Button" />
</FrameLayout>
</RelativeLayout>

Categories

Resources