I'm a bit new to Android, so please bear with me. I have two layout XML files which are practically the same. However, on my test device, they look totally different. They are files for List elements, and I know they should look the same because I copied the first one to make the second one. Here's the first one:
<?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">
<ImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_margin="16dp"
android:id="#+id/arrival_icon"
android:src="#drawable/red_circle"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="40dp"
android:id="#+id/arrival_dest"
android:text = "Red Line"
android:textSize="16sp"
android:textColor="#000000"
android:gravity="center_vertical"
android:layout_marginTop="16dp"
android:layout_marginLeft="16dp"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="40dp"
android:id="#+id/arrival_time"
android:text = "Red Line"
android:textSize="16sp"
android:textColor="#000000"
android:gravity="right"
android:layout_marginTop="16dp"
android:layout_marginLeft="16dp"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="40dp"
android:id="#+id/_id"
android:text = "Red Line"
android:textSize="16sp"
android:textColor="#000000"
android:gravity="center_vertical"
android:layout_marginTop="16dp"
android:layout_marginLeft="16dp"
/>
</LinearLayout>
And here's the second one:
<?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">
<View
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_margin="16dp"
android:id="#+id/line_icon"
android:background="#drawable/red_circle"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="40dp"
android:id="#+id/line_name"
android:text = "Red Line"
android:textSize="16sp"
android:textColor="#000000"
android:gravity="center_vertical"
android:layout_marginTop="16dp"
android:layout_marginLeft="16dp"
/>
</LinearLayout>
I'm not sure where else there could be an issue. If there's another XML or Java file that I need to post to determine the cause, please tell me, I'm lost. Can anyone please help?
Thanks in advance :)
Edit 1:
Here are the screenshots for the first and second layouts, respectively:
Not much of a difference; the second layout had a strange margin on the left and right, as well as padding in the list element.
Related
I am trying to get the TextView, "tv_amount" to stay on the right side of the screen. I have tried using android:gravity="right" but that hasn't been working for me. Anyone have any suggestions?
Image of emulator running this 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="45dp"
android:gravity="center_vertical"
android:orientation="horizontal">
<ImageView
android:id="#+id/iv_icon"
android:layout_width="40sp"
android:layout_height="40sp"
android:background="#drawable/circle_border"
android:padding="6sp"
android:layout_marginLeft="6dp"
android:src="#drawable/food"/>
<TextView
android:id="#+id/tv_label"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_marginStart="12dp"
android:text="Yummy Pizza"
android:textSize="20sp" />
<TextView
android:id="#+id/tv_amount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="12dp"
android:gravity="end"
android:text="$25"
android:textSize="25sp" />
</LinearLayout>
I am expecting the transaction or "tv_amount" to stay be right justified so that end of the number is staying towards the right side of the screen.
I tried using :
android:layout_weight="0"
android:layout_gravity="end"
android:gravity="right"
but these don't seem to work obviously. I am a beginner when it comes to android development and can't seem to find any answers that have helped anywhere else. They all say to use android:gravity or some other alternative. Maybe there is something in my code that doesn't allow that.
Try it like this:
Splitting the content into left and right will result in the weight and gravity properties working. Check out this layout below.
<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/tv_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Title"
android:textSize="20sp" />
<!--Separate layout aligned to the left, containing an image and a yummy pizza label. -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal">
<ImageView
android:id="#+id/iv_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<TextView
android:id="#+id/tv_text_left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Text Left"
android:textSize="16sp" />
</LinearLayout>
<!--Display the pizza price on a separate label aligned to the right -->
<TextView
android:id="#+id/tv_text_right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="right"
android:text="Text Right"
android:layout_weight="1"
android:textSize="16sp" />
</LinearLayout>
</LinearLayout>
I am dumb. The issue wasn't with the code in my individual recycler view layout code. It was with my activity_main.xml. I set the recycler_view width to "wrap_content" when it should have been "match_parent." Rookie mistake.
I know that Start = Left and End = Rignt in ConstraintLayout.
However, apart from this, what appears on the preview screen was slightly different.
When constraint is used as layout_constraintLeft_toLeftOf="parent" (and Right)
When constraint is used as layout_constraintStart_toStartOf="parent" (and End)
As you can see the difference in the image, when Left and Right are used, they are not completely attached to the parent, but are slightly apart.
But Start and End are attached to parent.
Up until this point, I thought they were the same thing.
What is the difference between the two?
Currently, what I want to do is to attach only the first LinearLayout to the left in the first image. (Leave the positions of the second and third LinearLayout fixed)
XML
<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginHorizontal="10dp"
android:layout_marginVertical="8dp">
<LinearLayout
android:id="#+id/ll_set"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintRight_toLeftOf="#id/ll_weight"
app:layout_constraintTop_toTopOf="parent">
<TextView
android:id="#+id/set"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1"
android:textSize="16dp" />
<TextView
android:id="#+id/unit_set"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="set"
android:textSize="16dp" />
</LinearLayout>
<LinearLayout
android:id="#+id/ll_weight"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintLeft_toRightOf="#+id/ll_set"
app:layout_constraintRight_toLeftOf="#id/ll_rep">
<EditText
android:id="#+id/weight"
android:layout_width="53dp"
android:layout_height="wrap_content"
android:inputType="numberDecimal"
android:maxLength="5"
android:textSize="16dp" />
<TextView
android:id="#+id/unit_kg"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="lb"
android:textSize="16dp" />
</LinearLayout>
<LinearLayout
android:id="#+id/ll_rep"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintLeft_toRightOf="#id/ll_weight"
app:layout_constraintRight_toRightOf="parent">
<EditText
android:id="#+id/rep"
android:layout_width="55dp"
android:layout_height="wrap_content"
android:inputType="numberDecimal"
android:maxLength="5"
android:textSize="16dp" />
<TextView
android:id="#+id/unit_rep"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="rep"
android:textSize="16dp" />
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</layout>
Your problem is you are using app:layout_constraintLeft_toLeftOf and app:layout_constraintRight_toLeftOf. If you want to change it you should change both of them to layout_constraintStart_toStartOf and layout_constraintEnd_toStartOf.
You should use one of these combinations(left and right) or (start and end).
You should not use app:layout_constraintStart_toStartOf with app:layout_constraintRight_toLeftOf
Also, when you have to support RTL languages such as Arabic, the start!=left and end!=right
The problem is when I run the program the view cuts like what shown in the picture above
I don't know what the exact sort of problem, so if you need anything to show just ask
I am using kotlin by the way
EDIT 1:
result_row.xml this is the XML for the row that shows in the ListView
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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:id="#+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<TextView
android:id="#+id/itemName"
android:layout_width="200dp"
android:layout_height="40dp"
android:gravity="center"
android:text="Name"
android:textColor="#000000"
android:textSize="16sp" />
<View
android:id="#+id/lineView2"
android:layout_width="2dp"
android:layout_height="40dp"
android:background="#010101" />
<TextView
android:id="#+id/itemWeight"
android:layout_width="100dp"
android:layout_height="40dp"
android:gravity="center"
android:text="Item Weight"
android:textColor="#000000"
android:textSize="16sp" />
<View
android:id="#+id/lineView1"
android:layout_width="2dp"
android:layout_height="40dp"
android:background="#010101" />
<TextView
android:id="#+id/itemPrice"
android:layout_width="100dp"
android:layout_height="40dp"
android:gravity="center"
android:text="Price"
android:textColor="#000000"
android:textSize="16sp" />
</LinearLayout>
</FrameLayout>
Your TextViews have fixed widths that total greater than the width of the screen:
android:layout_width="200dp"
...
android:layout_width="100dp"
...
android:layout_width="100dp"
Android phones can be as narrow as 320dp, so it'll get cut off. You need to modify your layout to use the available space, not hardcode fixed widths. Or, if you really want to use fixed widths, they need to be smaller (shouldn't add up to more than 320dp).
in your layout xml file edit
layout_width="0dp"
layoyt_height="0dp"
In my app I currently have two text views in an alert dialog to display the temperature and the weather description. The problem with this is that whenever the description changes, the alignment changes.
I tried having my layout as a relative layout and move around both of them with one depending on the other but this does not help me out. Any suggestions?
This is my current code:
<?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"
android:orientation="vertical">
<TextView
android:id="#+id/climaText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignStart="#+id/desc"
android:layout_marginTop="18dp"
android:layout_marginStart="120dp"
android:textColor="#android:color/white" />
<TextView
android:id="#+id/desc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/climaText"
android:layout_centerHorizontal="true"
android:layout_marginTop="13dp"
android:textColor="#android:color/white" />
</RelativeLayout>
It is happening due to change in data size , when the data is increased it will wrap the data when you will use wrap_content . I suggest you can use a parent view and fix the height.here is the code, let me know if its working. thanks
<?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">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="250px">
<TextView
android:id="#+id/climaText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignStart="#+id/desc"
android:layout_marginStart="120dp"
android:layout_marginTop="18dp"
android:textColor="#android:color/white" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="250px">
<TextView
android:id="#+id/desc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/climaText"
android:layout_centerHorizontal="true"
android:layout_marginTop="13dp"
android:textColor="#android:color/white" />
</LinearLayout>
</LinearLayout>
Hope you can help me with my question, I have three TextViews and a sepparator, on my relative layout, on the designer I have aranged them , but after I run it on a phisical device , only one item appear and even that item is misplaced. I have to tell you that i have searched for many many hours before coming here to ask this question, so please help me!
Here it is the XML file
<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="wrap_content"
android:paddingBottom="44dp"
android:paddingTop="24dp"
tools:ignore="RtlSymmetry">
<TextView
android:id="#+id/tv_time"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignStart="#+id/tv_today_date"
android:gravity="end|center_vertical"
android:paddingEnd="16dp"
android:textAlignment="center"
android:textSize="56sp"
android:visibility="visible"
tools:text="12:34" />
<TextView
android:id="#+id/tv_today_date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="end"
android:paddingEnd="16dp"
android:text="Tue, 20 Apr"
android:textSize="16sp"
android:layout_below="#+id/tv_today_time"
android:layout_toStartOf="#+id/separator" />
<View
android:id="#+id/separator"
android:layout_width="0.05dp"
android:layout_height="0.05dp"
android:layout_alignBottom="#+id/tv_today_date"
android:layout_alignTop="#+id/tv_today_time"
android:layout_centerHorizontal="true"
android:background="#66FFFFFF" />
<TextView
android:id="#+id/tv_location"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="start"
android:paddingStart="16dp"
android:textSize="16sp"
tools:text="Bucharest"
android:layout_below="#+id/tv_today_time"
android:layout_toEndOf="#+id/separator" />
If needed, i will post some screenshots.
Also I have also some other questions, so if anyone wants to help me, tell me :)
EDIT
Here iis what I would like it to be:Designer
Here is what i get:Phisical device
Option 1: Use constraint layout (Material design)
Option 2: Wrap tv_today_date separator & tv_location in LinearLayout with horizontal orientation. Place this LinearLayout below tv_time
This is working fine for me.Check it and let me know.
<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="wrap_content"
android:paddingTop="24dp"
>
<TextView
android:id="#+id/tv_time"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:gravity="end|center_vertical"
android:paddingRight="16dp"
android:textAlignment="center"
android:textSize="56sp"
android:visibility="visible"
android:text="12:34" />
<View
android:id="#+id/separator"
android:layout_width="0.05dp"
android:layout_height="0.05dp"
android:layout_alignBottom="#+id/tv_today_date"
android:layout_alignTop="#id/tv_time"
android:layout_centerHorizontal="true"
android:background="#66FFFFFF" />
<TextView
android:id="#+id/tv_today_date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="end"
android:paddingRight="16dp"
android:text="Tue, 20 Apr"
android:textSize="16sp"
android:layout_below="#id/tv_time"
android:layout_toLeftOf="#id/separator" />
<TextView
android:id="#+id/tv_location"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="start"
android:paddingLeft="16dp"
android:textSize="16sp"
android:text="Bucharest"
android:layout_below="#id/tv_time"
android:layout_toRightOf="#id/separator" />
</RelativeLayout>