ListView items gone off screen - android

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"

Related

Android Recycler View Item Layout Problem

I'm designing an app in Android Studio. In the preview it looks like I want but when building the application there is a LinearLayout that contains two TextViews that looks smaller and I do not understand why
This is the Recycler View Item:
<?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:id="#+id/friend_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/profile_picture"
android:layout_width="44dp"
android:layout_height="44dp"
android:src="#drawable/head" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="1dp"
android:gravity="left"
android:paddingLeft="2dp"
android:paddingRight="2dp"
android:textColor="#color/white"
android:textSize="16sp"
android:textStyle="bold"
tools:text="Guillermo Rodriguez" />
<TextView
android:id="#+id/friend_position"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="left"
android:text="delantero"
android:textColor="#color/white"
android:textSize="13sp" />
</LinearLayout>
This is how it looks: https://photos.app.goo.gl/BgNQhgpNKbgEGCCR6 and I need to the text fill the entirety width
I expect to see both TextView until the end of the screen but they end before the middle. Any ideas?
If I understood your question correctly, you must want the two TextViews to fill the entirety of the height, is that it?
In that case, in both your TextViews, change your layout_height attribute to 0dp and add android:layout_weigth=0.5 to them. This will make them fill the entire height of your LinearLayout, whichever height that might be, and they will be dividing the space right in the middle.
I recommend you utilize LinearLayout's weight attribute. set your root LinearLayout's to match_parent. and your nested LinearLayout and both TextView's layout_height to 0dp and their weight to 1
here's the edited code:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/friend_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/profile_picture"
android:layout_width="44dp"
android:layout_height="44dp"
android:src="#drawable/head" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:id="#+id/name"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_marginStart="1dp"
android:gravity="left"
android:paddingLeft="2dp"
android:paddingRight="2dp"
android:textColor="#color/white"
android:textSize="16sp"
android:textStyle="bold"
tools:text="Guillermo Rodriguez" />
<TextView
android:id="#+id/friend_position"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="left"
android:text="delantero"
android:textColor="#color/white"
android:textSize="13sp" />
</LinearLayout>
</LinearLayout>
Please check if your RecycleView has the proper width set (e.g. match_parent) and it can stretch to the whole width. Could you provide the xml code with the RecycleView?
i think you set the recyclerview to specific width. try to cahngethe width into match parent.
I recommend to user constraintlayout to avoid nested viewgroup. like this:
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/friend_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/profile_picture"
android:layout_width="44dp"
android:layout_height="44dp"
android:src="#drawable/patient"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"/>
<TextView
android:id="#+id/name"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="1dp"
android:gravity="left"
android:paddingLeft="2dp"
android:paddingRight="2dp"
android:textColor="#android:color/white"
android:textSize="16sp"
android:textStyle="bold"
tools:text="Guillermo Rodriguez"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/profile_picture"/>
<TextView
android:id="#+id/friend_position"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:gravity="left"
android:text="delantero"
android:textColor="#android:color/white"
android:textSize="13sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/profile_picture"
app:layout_constraintTop_toBottomOf="#+id/name"/>
I solved it! Someone configured it whit GridLayoutManager and it had to be with LinearLayoutManager.. I changed it and it was fixed

RelativeLayout doesn't wrap_content on width on Android 6

I have 2 devices: Asus Zenfone 2 (6.0.1) and Galaxy Note 3 (5.0)
In my app I take photo and on the next screen I show it on ImageView and add some information on it. Here is xml layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:keepScreenOn="true"
android:background="#android:color/black">
<LinearLayout
android:id="#+id/preview_buttons"
android:orientation="horizontal"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="visible"
android:background="#android:color/black">
<TextView
android:id="#+id/tv_cancel"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:textColor="#android:color/white"
android:paddingTop="8dp"
android:paddingBottom="8dp"
android:textSize="16sp"
android:text="CANCEL"/>
<View
android:layout_width="1dp"
android:layout_height="match_parent"
android:background="#android:color/darker_gray"/>
<TextView
android:id="#+id/tv_accept"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:textColor="#android:color/white"
android:paddingTop="8dp"
android:paddingBottom="8dp"
android:textSize="16sp"
android:text="ACCEPT"/>
</LinearLayout>
<RelativeLayout
android:id="#+id/preview_container"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:background="#android:color/holo_blue_bright"
android:layout_above="#id/preview_buttons">
<ImageView
android:id="#+id/image_preview"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:adjustViewBounds="true"
android:scaleType="fitCenter"
/>
<TextView
android:id="#+id/preview_top_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingRight="16dp"
android:paddingTop="8dp"
android:paddingBottom="8dp"
android:layout_alignRight="#id/image_preview"
android:layout_alignTop="#id/image_preview"
android:gravity="right"
android:background="#drawable/top_text_background"
android:textSize="16sp"
android:textColor="#android:color/white"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="16dp"
android:layout_marginBottom="8dp"
android:layout_alignLeft="#id/image_preview"
android:layout_alignBottom="#id/image_preview"
android:src="#drawable/ic_verified_grey600"/>
<TextView
android:id="#+id/preview_bottom_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingRight="16dp"
android:paddingBottom="8dp"
android:paddingTop="8dp"
android:layout_alignRight="#id/image_preview"
android:layout_alignBottom="#id/image_preview"
android:gravity="right"
android:background="#drawable/bottom_text_background"
android:textSize="16sp"
android:textColor="#android:color/white"/>
</RelativeLayout>
</RelativeLayout>
UPD. I have problem with RelativeLayout "preview_container"
From this layout I expect its width would wrap, if ImageView's width doesn't fill whole screen and be on the screen center. And it works nice on GN3, but on my AZ2 I get space at right side (No reputation to insert image, it's here http://i.imgur.com/cSujbAp.png)
UPD2. What I expect: RelativeLayout wraped correctly, so I don't see background. Example from my GN3 here (http://i.imgur.com/vKGQq8r.jpg). Transparent background also can't help because after that I need to get drawing cache of this layout and work with it
I know about alignParent issue, but I don't use it now and my extra views placed correct.
Please help me, what's wrong?
<ImageView
android:id="#+id/image_preview"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:adjustViewBounds="true"
android:scaleType="fitCenter"
/>
android:layout_height="match_parent" should not be match_parent.
Your preview_top_text has the width set to match_parent so it means that, since her container is the same of the image, it will stretch way to contain also the textview and not only the imageview.
Add the android:layout_centerHorizontal="true" parameter to the imageview and it should be centered.
Hope it helped
UPDATE POINT 2
two possibilities:
change the sizes of the TextViews to wrap_content
change the background of the second relativelayout to transparent

Resize TextView to wrap content using XML

This question has been asked tonnes of times, but I didn't get any of the answers work from me.
How do i get the textview to resize itself to accommodate the text that is larger than single line(may be around 5 lines)? Please note that I am looking at solutions to work with XML ONLY.
<TextView
android:id="#+id/item_comments_textview_comment"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:text="#string/comments_comment"
android:textAppearance="?android:attr/textAppearanceSmall" />
Here are the attributes that i tried without any effect.
android:singleLine="false"
android:maxLines="5"
android:scrollHorizontally="false"
android:layout_height="0dip"
android:layout_weight="1"
android:inputType="textMultiLine"
Can someone let me know how to make textview grow in size, without specify a constant height?
My total XML:
<?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:background="#android:color/white"
android:orientation="horizontal"
android:paddingBottom="24dp"
android:paddingTop="20dp" >
<ImageView
android:id="#+id/item_comments_imageview"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:contentDescription="#string/empty"
android:scaleType="fitXY"
android:src="#drawable/ic_launcher" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginRight="16dp"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/item_comments_author"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_marginRight="20dp"
android:layout_weight="0.50"
android:ellipsize="end"
android:maxLines="1"
android:gravity="top"
android:text="#string/comments_author"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textStyle="bold" />
<TextView
android:id="#+id/item_comments_comment_date"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="0.50"
android:gravity="right"
android:text="#string/comments_date"
android:textAppearance="?android:attr/textAppearanceSmall" />
</LinearLayout>
<TextView
android:id="#+id/item_comments_textview_comment"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:text="#string/comments_comment"
android:textAppearance="?android:attr/textAppearanceSmall" />
</LinearLayout>
</LinearLayout>
I want the textview with id "item_comments_textview_comment" to grow to accommodate the comment given by the user, to upto a maximum of 5 lines. Currently it only displays 1 line and cuts the rest of the text.
I think your comment textview (item_comments_textview_comment) is being limited by its parent LinearLayout height attribute. Change that height value from match_parent to wrap_content
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginRight="16dp"
android:orientation="vertical" >
...
You should try using RelativeLayout for the design of the row elements. It can help you to designate position of each of the elements relative to components to manage your design.
Not only that it can also help in boosting the performance of your application. There is an analysis available on this and this one particularly inspects a design similar to yours. Check here: Optimizing Layout Hierarchies

text sizes different Android phones

Since I have a Nexus 5, I'm seeing strange stuff regarding text sizes.
An example: I am creating listview items. I put a bigger text at 22sp, a smaller one at 17sp.
On my HTC One X it looks like this:
So I think "ok, that's nice!"
Then I run it on my Nexus 5:
I do not understand why this is happening? Shouldn't the 'sp' part make sure it will look ok
with the default values? I am not talking about the user increasing the font sizes in the settings, I've left everything to defaults.
Eventhough, if I would (don't hit me) use DP here to disable the font size changes for text, it will give the same result (not tested, but I am fairly certain this is the case from other tests).
What is the problem here? Is it the newer Android version, or is it the 1080p screen vs the 720p ?
Should I use different values for different DP using 'values' folder?
here is de layout:
<?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="80dp"
android:orientation="horizontal">
<LinearLayout
android:id="#+id/background"
android:layout_marginTop="10dp"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<com.android.volley.toolbox.NetworkImageView
android:id="#+id/image"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:adjustViewBounds="true"
android:scaleType="centerCrop" />
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="5dp"
android:layout_weight="2">
<ImageView
android:id="#+id/arrow"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:adjustViewBounds="true" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="3dp"
android:layout_toLeftOf="#id/arrow"
android:gravity="center"
android:orientation="vertical">
<TextView
android:id="#+id/name"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:fontFamily="sans-serif-condensed"
android:textSize="22sp"
android:textStyle="bold" />
<TextView
android:id="#+id/address"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:textSize="17sp" />
</LinearLayout>
</RelativeLayout>
</LinearLayout>
</LinearLayout>
For instance, the default size for same SP value may vary depending on device, just to match its readability designed for the device.
The problem you got is because you have some elements sized to fixed size, post your XML code you use for the row and we can make a deep analyse.
Edit -- After xml
Well, instead of point you the wrongs, I did prefer to rebuild your layout, take a look:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:orientation="horizontal" >
<com.android.volley.toolbox.NetworkImageView
android:id="#+id/image"
android:layout_width="wrap_content"
android:layout_height="match_parent" />
<TextView
android:id="#+id/name"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/image"
android:layout_toLeftOf="#+id/arrow"
android:fontFamily="sans-serif-condensed"
android:textSize="22sp"
android:textStyle="bold" />
<TextView
android:id="#+id/address"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/image"
android:layout_toLeftOf="#id/arrow"
android:layout_below="#id/name"
android:textSize="17sp" />
<ImageView
android:id="#id/arrow"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentRight="true" />
</RelativeLayout>
Your layout was too complex to a simple row... now the layout will be as tall as the TextViews needs it to be, and it is not a problem, as the user is already used with his text size.
you have to Create two different layout folder and see the result

Custom dialog height to match content

This is my custom dialog, there are some textboxs and two buttons.
I'm using a RelativeLayout on it.
I'd like the dialog size to match the content, not all that blank space under there.
I don't want to use explicit pixel heights (it's not good practice).
Another thing, there's a way to have some space between every view?
This is my XML
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:id="#+id/txt_desc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="8pt"
android:textStyle="italic" />
<TextView
android:id="#+id/txt_date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_below="#+id/txt_desc"
android:textSize="8pt" />
<TextView
android:id="#+id/txt_place"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_below="#+id/txt_date"
android:textSize="8pt" />
<Button
android:id="#+id/btn_close"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#+id/txt_place"
android:layout_toRightOf="#+id/view"
android:text="#string/btn_close" />
<View
android:id="#+id/view"
android:layout_width="0dp"
android:layout_height="1dp"
android:layout_centerHorizontal="true" />
<Button
android:id="#+id/btn_edit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/txt_place"
android:layout_toLeftOf="#+id/view"
android:drawableLeft="#android:drawable/ic_menu_edit"
android:text="#string/btn_edit" />
</RelativeLayout>
First question
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
Second question
Plus use android:marginTop="5dp" if you want to separate a View from Top for 5 dp.
marginLeft|Right|Bottom are also available.
<TextView
android:id="#+id/txt_place"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="5dp" <-----------------
android:layout_below="#+id/txt_date"
android:textSize="8pt" />
By the way, if I were you, I'd nest some layouts to make order. You can have a general Relative Layout, then 2 linear layouts: one horizontal for TextViews and one vertical for Buttons. You can definely play with your editor and try to make the best appearance for your dialog.
EDIT
Try this one:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#0000"
android:orientation="vertical"
android:paddingBottom="50dp" >
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:id="#+id/txt_desc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="prova"
android:textSize="8pt"
android:textStyle="italic" />
<TextView
android:id="#+id/txt_date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:text="prova"
android:textSize="8pt" />
<TextView
android:id="#+id/txt_place"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:text="prova"
android:textSize="8pt" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<Button
android:id="#+id/btn_edit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableLeft="#android:drawable/ic_menu_edit"
android:text="btn_edit" />
<Button
android:id="#+id/btn_close"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="btn_close" />
<View
android:id="#+id/view"
android:layout_width="0dp"
android:layout_height="1dp" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
I've hard-coded the texts. The main idea is to use a big container layout in background, which is trasparent (background=#0000) and in top of that a layout in wrap_content containing your Views.
If this solution doesn't resolve your problem, I think you could edit height directly in your code. Try to relate to this question
Set your relative layout's height to wrap_content.
For example:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!-- More XML -->
</RelativeLayout>
Also be aware that fill_parent is deprecated for widths and heights.
You can add either margin (extra space outside a view) or padding (extra space inside a view) with android:layout_margin or android:padding respectively. There are also variants such as layout_marginTop that only apply to a specific side of the view.

Categories

Resources