I'm new to android studio and this is my first app.
It works correctly but having an issue with the emulator, it shows the button in the wrong place.
<android.support.constraint.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"
tools:context="com.example.dell_pc.myapplication.MainActivity">
<EditText
android:id="#+id/txtyear"
android:layout_width="193dp"
android:layout_height="60dp"
android:ems="10"
android:hint="Enter year of birth"
android:inputType="number"
tools:layout_editor_absoluteY="129dp"
tools:layout_editor_absoluteX="96dp" />
<Button
android:id="#+id/butage"
android:layout_width="115dp"
android:layout_height="41dp"
android:onClick="BuGetAge"
android:text="Show Age"
tools:layout_editor_absoluteY="277dp"
tools:layout_editor_absoluteX="135dp" />
</android.support.constraint.ConstraintLayout>
How can I make it to appear in the right place?
Select Component/Item(such as BUTTON) in activity_main.xml -> click on "Infer Constrains(as I show in attached file)"
Your item will take right place in ASE
Do same for the rest Component/Items
Click on an element and click the Magic Wand icon in the toolbar above the design view to Infer Constraints so the element will not jump to the (0, 0) position at runtime.
Do you absolutely need to use constraint layout? If not, you can use a relative layout, and use layout_centerHorizontal and layout_centerVertical like this:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent">
<EditText
android:id="#+id/edittext"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="blah blah"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
/>
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="press"
android:layout_centerHorizontal="true"
android:layout_below="#id/edittext"
/>
</RelativeLayout>
tools:layout_editor_absoluteY and other attributes from tools namespace only have effect in layout editor. Your working code does not use these attributes, so your views are in upper left corner, because this is default. As noted above RelativeLayout or even LinearLayout suits better such simple layout.
Just change:
</android.support.constraint.ConstraintLayout>
to
</RelativeLayout>
Problem solved! Be happy :D
Related
I'm trying to make a imperial to metric conversion app, which is going fine, until I ran into problems with the Android Emulator. The layout is totally screwed up in the Emulator, and I have no idea why. http://imgur.com/a/IBOcs
EDIT:
The whole activity_main.xml code:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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"
tools:context="com.example.daniel.converter.MainActivity"
tools:layout_editor_absoluteY="73dp"
tools:layout_editor_absoluteX="0dp">
<TextView
android:id="#+id/textViewMPH"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="MPH"
tools:layout_editor_absoluteX="55dp"
tools:layout_editor_absoluteY="90dp" />
<EditText
android:id="#+id/editTextMPH"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ems="10"
android:inputType="number"
tools:layout_editor_absoluteX="85dp"
tools:layout_editor_absoluteY="77dp" />
<TextView
android:id="#+id/textViewTO"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="To"
tools:layout_editor_absoluteX="55dp"
tools:layout_editor_absoluteY="132dp" />
<TextView
android:id="#+id/textViewKMH"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="KMH"
tools:layout_editor_absoluteX="55dp"
tools:layout_editor_absoluteY="168dp" />
<EditText
android:id="#+id/editTextKMH"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ems="10"
android:inputType="number"
tools:layout_editor_absoluteX="85dp"
tools:layout_editor_absoluteY="156dp" />
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Convert!"
tools:layout_editor_absoluteX="146dp"
tools:layout_editor_absoluteY="229dp" />
</android.support.constraint.ConstraintLayout>
Issue is happening because you are using constraint layout but you have not provided any constraints for your items. Thus, every item is shown at (0,0) position.
Contraint Layout description:
The layout editor allows you to place widgets anywhere on the canvas, and it records the current position with designtime attributes (such as layout_editor_absoluteX.) These attributes are not applied at runtime, so if you push your layout on a device, the widgets may appear in a different location than shown in the editor. To fix this, make sure a widget has both horizontal and vertical constraints by dragging from the edge connections.
So either assign x and y values or use LinearLayout/RelativeLayout.
this .xml will be the layout of the item in the RecycleView list, but the last two Buttons are overlaying
<?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:background="#Ffffff"
android:baselineAligned="false"
android:weightSum="1">
<LinearLayout android:id="#+id/thumbnail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="3dip"
android:layout_alignParentLeft="true"
android:background="#drawable/favorite"
android:layout_marginRight="5dip">
<ImageButton
android:id="#+id/imageButton"
android:layout_width="25dip"
android:layout_height="25dip"
android:background="#null"
android:src="#drawable/nofavorite"/>
</LinearLayout>
<TextView
android:id="#+id/text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/thumbnail"
android:layout_toRightOf="#+id/thumbnail"
android:text="Rihanna Love the way lie"
android:textColor="#040404"
android:typeface="sans"
android:textSize="15dip"
android:textStyle="bold"/>
<TextView
android:id="#+id/artist"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textColor="#343434"
android:textSize="10dip"
android:layout_toRightOf="#+id/thumbnail"
android:text="Just gona stand there and ..."
android:layout_below="#+id/text_view" />
<ImageButton android:layout_width="wrap_content"
android:id="#+id/update"
android:layout_height="wrap_content"
android:src="#drawable/nofavorite"
android:background="#null"
android:layout_alignRight="#+id/artist" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#null"
android:id="#+id/delete"
android:src="#drawable/favorite"
android:layout_alignRight="#+id/artist"
/>
</RelativeLayout>
they should be in the end of the right, in the end the DELETE button and in the left of this button but in the right end of the screen the UPDATE button, i will bind something to this buttons later
and another question, how can i make a divider btw the items?
thank you =)
It is because you use layout_alignRight="#+id/artist" on both images which essentially align right edges of the 2 images with the right edge of the View with id artist. To achieve what you want, use layout_alignParentRight="true" on the DELETE button and layout_toLeftOf="#+id/delete" on the UPDATE button. By the way, why do you need layout_weightSum on the parent. It only works with LinearLayout.
For making divider between items, you can either use a background with the left (right) border on one of the items or put a view between them.
Your buttons need to have attributes setting their position relatively to each other. At the moment, the only indication regarding their position is:
android:layout_alignRight="#+id/artist"
That is not enough to place your components since you are using a RelativeLayout (which is good). I suggest you play around with the parameters using the visual editor in you IDE.
One thing to keep in mind is that the component described last in your XML file is the one which should have the position attributes relativ to the other component. So in your case, your DELETE button.
I am new to Android development. I have been working in iOS since long. As in iOS when we want to put VIEW on xib on some exact position, we simply put it there, drag it up to that point.
For example say Two buttons at lower area in iOS, which look like below
As, I simply want them in middle, I will put them their. as below
Now same thing in Android environment, I go for following code,
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/db1_root"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:id="#+id/myAwesomeTextView"
android:layout_width="wrap_content"
android:layout_height="1dip"
android:layout_centerInParent="true"
android:text="Veer Suthar" />
<TextView
android:id="#+id/myAwesomeTextView1"
android:layout_width="wrap_content"
android:layout_height="100dip"
android:layout_below="#id/myAwesomeTextView"
android:layout_centerInParent="true" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/myAwesomeTextView1"
android:gravity="center_vertical"
android:orientation="vertical" >
<Button
android:id="#+id/button1"
style="?android:attr/buttonStyleSmall"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center"
android:onClick="buttonPressed"
android:text="Button One" />
<Button
android:id="#+id/button2"
style="?android:attr/buttonStyleSmall"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center"
android:onClick="buttonPressed"
android:text="Button Two" />
</LinearLayout>
</RelativeLayout>
It shows Activity Screen, like below
Now If I want to drag buttons, using GRAPHICAL LAYOUT, I can't move them as I want, and for spacing to put them into lower area, I need to put extra TextView .
Is there any better way to organise Android Activity GUI properly, like iOS?
I'll give you a brief example, since Android graphical layout is not as smooth as XCode.
To accomplish what you need, centering the two buttons in the screen, you can use a XML code like 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" >
<LinearLayout
android:id="#+id/layout_center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_centerInParent="true">
<Button
android:id="#+id/button_one"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button One"/>
<Button
android:id="#+id/button_two"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button Two"/>
</LinearLayout>
</RelativeLayout>
The trick is to use android:layout_centerInParent="true" for the only component that you want to be centered in the screen all other components can use that one for reference to be placed in the screen.
For example
<TextView
android:id="#+id/myAwesomeTextView1"
android:layout_width="wrap_content"
android:layout_height="100dip"
android:layout_above="#+id/layout_center"
android:text="Veer Suthar"/>
This is one way for doing this, you can always find a better and more comprehensible way to do things.
Hope this helped.
Add this to your LinearLayout:
android:layout_alignParentBottom = "true"
Childs in a RelativeLayout can be "glued" to a particular position relative to the parent layout or to other elements in the same layout using the xml tags listed here: http://developer.android.com/reference/android/widget/RelativeLayout.LayoutParams.html
UPDATE: Thanks everyone for your help, layout_weight is what I was after.
I am currently working on my first android project in java. I am trying to use a linearlayout which has a listview spanning most of the page but has a load more button at the bottom of the app.
This is what it SHOULD look like and is what is previewed to me in Eclipse
and this is what is happening when I actually run the application
The button for some reason is moved a lot higher then I would like, I would like it to stick to the bottom of the page and have the listview take up the rest of the screen...
Here is my layout xml...
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#000000">
<ListView
android:id="#+id/listview"
android:layout_width="fill_parent"
android:layout_height="434dp"
android:maxHeight="434dp"
android:minHeight="434dp"
android:background="#000000" >
</ListView>
<Button
android:id="#+id/button1"
style="?android:attr/buttonStyleSmall"
android:layout_width="fill_parent"
android:layout_height="27dp"
android:maxHeight="27dp"
android:text="Load More..."
android:textSize="#dimen/dp12" />
</LinearLayout>
So my question is,
What have I done wrong or not done at all which is required to keep the button at the bottom of the page?
Thanks.
<ListView
android:id="#+id/listview"
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="1.00"
android:background="#000000" >
</ListView>
<Button
android:id="#+id/button1"
style="?android:attr/buttonStyleSmall"
android:layout_width="fill_parent"
android:layout_height="27dp"
android:maxHeight="27dp"
android:text="Load More..."
android:textSize="#dimen/dp12" />
It looks like you are setting up the layout using dp measurements. Try using the weight attribute instead. It should do what you want and scale nicely.
http://www.chess-ix.com/blog/the-use-of-layout_weight-with-android-layouts/
What does android:layout_weight mean?
Good Luck!
I'm really pulling my hair out over this one. Some background. I have a list of items that all have checkboxes next to them. When you deselect a checkbox, a button appears that allows you to delete the item from the list. This seems backwards at first but we only want "selected" items to be eligible for further processing, etc. This is my layout:
<RelativeLayout android:id="#+id/rlBlahBlah"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:minHeight="?android:attr/listPreferredItemHeight"
xmlns:android="http://schemas.android.com/apk/res/android">
<CheckBox android:text=""
android:id="#+id/cbDeleteItem"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:focusable="false"
/>
<TextView android:text=""
android:id="#+id/tvItemText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="14dip"
android:paddingLeft="3dip"
android:paddingRight="3dip"
android:paddingTop="13dip"
android:gravity="fill_vertical"
android:layout_toRightOf="#id/cbDeleteItem"
/>
<Button android:layout_height="wrap_content"
android:id="#+id/btnDelete"
android:text="Delete"
android:layout_width="wrap_content"
android:layout_alignParentRight="true"
android:gravity="center_vertical"
android:focusable="false"
/>
</RelativeLayout>
I cannot get the 3 items to center vertically in my row to save my life. layout_gravity, gravity, layout_centerVertical, none of it works. I'm sure my issue is some tiny setting to flip somewhere, but I'm really at wits end on this.
edit: I know the textview is "fill_vertical", that's some random stuff I was trying.
This attribute worked for me centering a Button using RelativeLayout:
android:layout_centerInParent="true"
See this posting:
Can you center a Button in RelativeLayout?
Your problem is probably not due to the layout, but how you are inflating the layout. In fact, it might even be my fault, depending on where you learned your technique...
To quote the omnipresent Romain Guy:
the correct usage of inflate() in
adapters is:
inflate(layoutId, parent, false);
Passing the parent (given to you as a
parameter in getView()) allows the UI
toolkit to create the appropriate
LayoutParams object. Passing false
tells the toolkit to NOT call
parent.addView(theInflateChild), since
ListView will do its own magic later
on.
If you use inflate(layoutId, null), as I have traditionally advised, life is OK unless you try using RelativeLayout as the base layout of the rows and try to use vertical centering.
I will be updating my books and such to reflect the new advice in the coming weeks.
Using RelativeLayout, I had no luck with gravity nor layout_gravity.
But android:layout_centerVertical="true" worked for me positioned in the child of my RelativeLayout, so you can keep it if you need.
Here is a layout that ended up doing exactly what I wanted. I ditched RelativeLayout once I learned that it ignores layout_gravity attributes (of course now I can't find the post). Either way, nested LinearLayouts did the trick for me:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:minHeight="?android:attr/listPreferredItemHeight"
android:id="#+id/llBlahBlahRowMain"
android:padding="6dip">
<CheckBox android:text=""
android:id="#+id/cbDeleteItem"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:focusable="false"
/>
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_weight="1"
android:layout_gravity="center_vertical"
android:layout_height="wrap_content">
<TextView
android:text="blah blah dynamically replaced text"
android:id="#+id/tvItemText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textSize="14dip"
android:paddingLeft="3dip"
android:layout_gravity="center_vertical"
/>
</LinearLayout>
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/btnDelete"
android:text="Delete"
android:layout_gravity="center_vertical"
android:focusable="false"
/>
</LinearLayout>
Have you tried android:gravity="center_horizontal" as referenced here
I did an alternative solution, that worked for me. I put, on my textbox element, the property android:layout_height="fill_parent". This way, the text element filled all hieght of parent, so the contents were aligned correctly :)
<TextView android:id="#+id/principal_li_descricao"
android:layout_height="fill_parent"
android:layout_width="wrap_content"
android:layout_marginLeft="10dip"
android:textColor="#ff000000"
android:layout_centerVertical="true"
android:gravity="center_vertical"
android:layout_alignBottom="#+id/principal_li_icone"
android:layout_toRightOf="#+id/principal_li_icone"/>
Thanks