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>
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 am creating one Layout and in that I am putting divider via View. But Both Divider is not looking same. which have all property same.
Take a close look at screenshot :
The First one looked well as I want. But the second one is thin as you can close look.
Code :
<TextView
android:id="#+id/txt_security_currentRole"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="#dimen/normal_margin8"
android:text="#string/security_current_role"
android:textColor="#DE000000"
android:fontFamily="sans-serif"
android:textSize="#dimen/textsize14" />
<View
android:id="#+id/view_currentRole"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_below="#+id/txt_security_currentRole"
android:background="#61000000" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/view_currentRole"
android:layout_marginLeft="#dimen/normal_margin8"
android:paddingBottom="#dimen/normal_margin8"
android:paddingTop="#dimen/normal_margin5"
android:text="#string/security_user"
android:textColor="#8A000000"
android:fontFamily="sans-serif"
android:textSize="#dimen/textsize14" />
<TextView
android:id="#+id/txt_upgraderole"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_below="#+id/view_currentRole"
android:paddingTop="#dimen/normal_margin8"
android:text="#string/security_upgrade_role"
android:textColor="#color/colorPrimary"
android:textSize="#dimen/textsize14"
android:textStyle="italic"
android:fontFamily="sans-serif" />
<TextView
android:id="#+id/txt_viewpassword"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/txt_upgraderole"
android:paddingBottom="#dimen/normal_margin8"
android:text="#string/password"
android:textColor="#DE000000"
android:fontFamily="sans-serif"
android:textSize="#dimen/textsize14" />
<View
android:id="#+id/view_password"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_below="#+id/txt_viewpassword"
android:background="#61000000" />
If any one know what about that it can tell me.
Any Help be Highly Appreciated.
You can create a separate layout with the view you want and include it in the places where ever you need...I think this solution would help you...
I am agree with #Ironman that Textview is for displaying Text. You can check this:
<View
android:layout_width="match_parent"
android:layout_height="2dp"
android:background="?android:attr/listDivider"/>
Try using Textview instead of View. Using textview gives same divider as view.
<TextView
android:id="#+id/txt_security_currentRole"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="#dimen/normal_margin8"
android:text="#string/security_current_role"
android:textColor="#DE000000"
android:fontFamily="sans-serif"
android:textSize="#dimen/textsize14" />
<TextView
android:id="#+id/view_currentRole"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_below="#+id/txt_security_currentRole"
android:background="#61000000" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/view_currentRole"
android:layout_marginLeft="#dimen/normal_margin8"
android:paddingBottom="#dimen/normal_margin8"
android:paddingTop="#dimen/normal_margin5"
android:text="#string/security_user"
android:textColor="#8A000000"
android:fontFamily="sans-serif"
android:textSize="#dimen/textsize14" />
<TextView
android:id="#+id/txt_upgraderole"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_below="#+id/view_currentRole"
android:paddingTop="#dimen/normal_margin8"
android:text="#string/security_upgrade_role"
android:textColor="#color/colorPrimary"
android:textSize="#dimen/textsize14"
android:textStyle="italic"
android:fontFamily="sans-serif" />
<TextView
android:id="#+id/txt_viewpassword"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/txt_upgraderole"
android:paddingBottom="#dimen/normal_margin8"
android:text="#string/password"
android:textColor="#DE000000"
android:fontFamily="sans-serif"
android:textSize="#dimen/textsize14" />
<TextView
android:id="#+id/view_password"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_below="#+id/txt_viewpassword"
android:background="#61000000" />
I've just replaced <View> by <Textview>
After lots of try like
1. Clean the Project and Rebuild it
2. Restart The Studio.
3. Restart the whole System
nothing is work well.
Finally Uninstall the App and reinstall is work for me.
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.
I am trying to develop a Chat Application in Android. I need to create a layout similar to WhatsApp. Two TextViews - One for message and another one for time. They both should be wrapped to the width and height. I am using a RelativeLayout to align them so that when long message is inserted, the 'Time' view doesnt get pushed to the side.
<?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:layout_gravity="right"
android:gravity="right"
android:paddingLeft="40dp"
android:orientation="horizontal"
>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dp"
android:background="#drawable/chat_bubble_sent">
<TextView
android:id="#+id/dateView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignBottom="#+id/msgTextView"
android:text="Date"
android:layout_marginRight="10dp"
android:textSize="12sp"
android:textColor="#343434"
/>
<TextView
android:id="#+id/msgTextView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_toLeftOf="#id/dateView"
android:text="Text goes here"
android:textColor="#040404"
android:typeface="sans"
android:textSize="15sp"
/>
</RelativeLayout>
</LinearLayout>
But using this code, I am getting some empty space between those two views. I have seen some of the questions regarding this but i couldnt get the right solution..
if i use "layout_width:wrap_content" in "msgTextView" they are wrapped side by side, but there is empty space before those two views..
In any case I need to get rid of that empty space so that the background is just applied for those wrapped TextViews. Hope i didnt confuse u
Any ideas how to get it? Thanks in advance..
Try this..
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="40dp" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:background="#drawable/chat_bubble_sent"
android:padding="10dp" >
<TextView
android:id="#+id/msgTextView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:layout_weight="1"
android:text="Text goes here"
android:textColor="#040404"
android:textSize="15sp"
android:typeface="sans" />
<TextView
android:id="#+id/dateView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_marginRight="10dp"
android:text="Date"
android:textColor="#343434"
android:textSize="12sp" />
</LinearLayout>
</RelativeLayout>
I have a vertical layout: 2 text field and a horizontal bar of buttons:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#ff00ff00"
android:orientation="vertical"
android:padding="4dp" >
<EditText
android:id="#+id/et_email"
android:layout_width="fill_parent"
android:layout_weight="1"
android:layout_height="wrap_content"
android:layout_marginTop="2dp"
android:background="#ff00ffff"
android:inputType="textEmailAddress" >
</EditText>
<EditText
android:id="#+id/et_comment"
android:layout_width="fill_parent"
android:layout_weight="1"
android:layout_height="wrap_content"
android:layout_marginTop="2dp"
android:background="#ff00ffff"
android:inputType="textMultiLine"
android:maxLines="5"
android:minLines="5" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Button
android:id="#+id/btn_send"
android:layout_weight="0"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="OK" />
<Button
android:id="#+id/btn_show"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Some very long text" />
<Button
android:id="#+id/btn_cancel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Cancel" />
</LinearLayout>
</LinearLayout>
I want the button bar to have wrap_content size policy (can't even have them fixed size because this app has different localizations). I also want the text fields to have the same width as the button box. Here's how the above xml looks in designer (Eclipse + ADT) with platform 17 selected (and how I want it to look). Colors are just for easy debugging:
And here's how it looks on an Android 4.1 tablet:
This layout is used as a custom layout to a Dialog. No manipulations has been done to the Dialog apart from setting content and title.
Interesting fact: it looks exactly as I want it to (and same as ADT designer shows) on Android 3.1 tablet. But not on 4.1.
How can I achieve the desired layout?
You might want to use RelativeLayout to accomplish what you're looking for. Try changing your xml to the following:
<?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="wrap_content"
android:background="#ff00ff00"
android:padding="4dp" >
<EditText
android:id="#+id/et_email"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/buttonbar"
android:layout_alignRight="#+id/buttonbar"
android:layout_marginTop="2dp"
android:background="#ff00ffff"
android:inputType="textEmailAddress" >
</EditText>
<EditText
android:id="#+id/et_comment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/buttonbar"
android:layout_alignRight="#+id/buttonbar"
android:layout_below="#+id/et_email"
android:layout_marginTop="2dp"
android:background="#ff00ffff"
android:inputType="textMultiLine"
android:maxLines="5"
android:minLines="5" />
<RelativeLayout
android:id="#+id/buttonbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/et_comment" >
<Button
android:id="#+id/btn_send"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/btn_show"
android:layout_alignTop="#+id/btn_show"
android:layout_toLeftOf="#+id/btn_show"
android:text="OK" />
<Button
android:id="#+id/btn_show"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="Some very long text" />
<Button
android:id="#+id/btn_cancel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/btn_show"
android:layout_alignTop="#+id/btn_show"
android:layout_toRightOf="#+id/btn_show"
android:text="Cancel" />
</RelativeLayout>
</RelativeLayout>
This seems silly but it seems to work. Try putting in a nested layout. Change your outer layout width/height to fill parent. Then, inside that make another linear layout with all of your views and such. Give the inner LinearLayout the wrap_content values and that should do it. There's got to be a better way to do it than this but I can't think of it at the moment.