I am having a problem with my listview, if there is something with a long name it creates a huge gap between list items. the view should display a name and date
as you can see there is a huge space after monthly event and the date is missing, why is it doing that?
listview xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView android:text="#+id/calendarEntryText"
android:id="#+id/calendarEntryText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dp"
android:textSize="25sp"/>
<TextView android:text="#+id/dateEntryText"
android:id="#+id/dateEntryText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="15dp"
android:textSize="20sp"/>
</LinearLayout>
I can tell you about the missing part, it's because you are using horizontal linear layout and it's first child is occupying the whole width of the parent. so there is not place for the second child. I suggest you to use relative layout. HTH.
Related
I have created a grid layout Like this:
But I want my grid layout some thing like this:
I want my text to be appear on right side. Like Contacts List. Please tell me what changes I must have to do in my layout file. Waiting for a good response.
Since you seem to want a list and not a grid, you should use a LinearLayoutManager, not a GridLayoutManager.
See the official documentation for examples.
Try changing the orientation of your linerlayout to horizontal.
this the xml code just copy and past
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/android_list_view_tutorial_with_example"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal"
android:padding="5dp">
<ImageView
android:id="#+id/album"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/app_name"
android:padding="5dp"
android:src="#drawable/pic1" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="YOUR TEXT"
android:id="#+id/album_title">
</TextView>
</LinearLayout>
I have a ListView in my Android app. The ListView supposed to be a catalog of items. Right now, it doesn't look very much like catalog, since it is shown as rows list.
Is there a way to create some sort of a table view with 3 vertical rows and as many horizontal rows as the items count in the catalog, and still use the same data which I'm using in the ListView? Also, how to change the cell layout to be shown well as a rectangle cell?
CellLayout.xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/itemNameList"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/itemPriceList"
android:layout_below="#+id/itemNameList"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/itemImageList"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />
I solved it in a very easy method: I've just changed the type of the ListView to GridView and fixed the cell layout, so it will be shown vertically instead of horizontally.
I am creating a messaging app and am currently working on the inbox. I'm using a RecyclerView to display the list of conversations and would like each list item to look like this:
Leftmost is the contact image at 90dp x 90dp
The first row has two columns--the contact name and the date. The date should not be a fixed size as I currently have it, but fit at most DD/MM/YYYY (can be smaller in the case of something like "Sunday") and should be anchored to the right margin. The contact(s) should expand as necessary to fill any space up to the date.
The second row contains as much text of the last message as will fit.
I was going to use layout_weight but that doesn't work in a RelativeLayout (and doesn't allow the contact names to elongate in the case of a shorter date) and LinearLayout doesn't let me use layout_toEndOf. I'm a newbie at Android development so I'm not sure if one of those is the "right" answer.
What's the proper way of accomplishing the layout I'm looking for?
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:id="#+id/conversation_info"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="#dimen/activity_horizontal_margin">
<RelativeLayout
android:id="#+id/conversation_image_layout"
android:layout_width="90dp"
android:layout_height="90dp">
<ImageView
android:id="#+id/conversation_contact_image"
android:layout_width="fill_parent"
android:layout_height="fill_parent" />
</RelativeLayout>
<TextView
android:id="#+id/conversation_contact_name"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/activity_vertical_margin"
android:gravity="center_vertical"
android:textSize="#dimen/conversations_contact_font_size"
android:layout_toEndOf="#id/conversation_image_layout" />
<TextView
android:id="#+id/conversation_date"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_toEndOf="#id/conversation_contact_name"
android:gravity="right"
android:paddingRight="#dimen/activity_horizontal_margin"
android:textSize="#dimen/conversations_date_font_size" />
<TextView
android:id="#+id/conversation_snippet"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/conversation_contact_name"
android:textSize="#dimen/conversations_snippet_font_size"
android:layout_toRightOf="#id/conversation_image_layout" />
</RelativeLayout>
</LinearLayout>
This is what a list item currently looks like (I haven't loaded contact images yet). It's fine for the most part (though my layout code is probably incredibly bloated so I'd appreciate if anyone could point out ways to make it more concise) but notice how the date isn't on the same level as the contact name and wraps:
One of the textView in question has the MarginTop attribute, and the other one doesn't. Either remove it on both or add it to both:
<TextView
android:id="#+id/conversation_contact_name"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/activity_vertical_margin"
android:gravity="center_vertical"
android:textSize="#dimen/conversations_contact_font_size"
android:layout_toEndOf="#id/conversation_image_layout" />
<TextView
android:id="#+id/conversation_date"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_toEndOf="#id/conversation_contact_name"
android:gravity="right"
android:layout_marginTop="#dimen/activity_vertical_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:textSize="#dimen/conversations_date_font_size" />
Also, I'd recommend that you use Linear Layouts with nested Linear Layouts and weights, for better performance on different screens and devices. This may all fall apart if you run it on a different device. Don't trust me, try it :)
After it became clear to me that some of the layout parameters didn't mean what I thought they did, I spent some more time looking at my choices.
It is not recommended to nest LinearLayouts/use layout_weight within a list item, as the number of views created increases rapidly as more items are added. I managed to minify my code and keep it in a single RelativeLayout with the following code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/conversation_info"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="#dimen/activity_horizontal_margin">
<ImageView
android:id="#+id/conversation_contact_image"
android:layout_width="64dp"
android:layout_height="64dp"/>
<TextView
android:id="#+id/conversation_contact_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="#dimen/conversations_contact_font_size"
android:layout_toEndOf="#id/conversation_contact_image"/>
<TextView
android:id="#+id/conversation_date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignBaseline="#id/conversation_contact_name"
android:textSize="#dimen/conversations_date_font_size"/>
<TextView
android:id="#+id/conversation_snippet"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/conversation_contact_name"
android:textSize="#dimen/conversations_snippet_font_size"
android:layout_toEndOf="#id/conversation_contact_image"/>
</RelativeLayout>
Notable changes:
No nested tags - It was unnecessary to group the first line in its own layout
Used layout_alignBaseline - #Vucko pointed out that I was using marginTop on the contact name but not the date. Even after removing it, the two were still misaligned. android:gravity had no effect and it turns out none of these actually affect the text inside the layout
Used layout_alignParentEnd to fix the date issue. I've realized that in my case, a layout component usually only needs to reference one other in order to properly align itself relative to the rest of the layout.
I have a simple fragment dialog with a listview, EditText and two button (accept and cancel).
I want my layout to look like this:
Listview on top
EditText right below
and
Buttons side by side below edittext.
Now my problem is that listview can have 0 or a 100 elements.
So if I put everythis in a vertical LinearLayout and listview has a lot of elements the edittext and buttons get pushed out of view. And if I use relative layout and say that edit text is aligned parent bottom and below the listview that it looks ok for 100elements but when the listview is empty the dialog uses all of the screen space.
Here is an example of my code when using relativeLayout. Is there another way to make is so that linearLayout with id "below" is below the listview but will still be visible(if list view has a lot of items) without using alignParentBottom="true" because that is the reason the layout stretches to full screen.
<?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:orientation="vertical" >
<ListView
android:id="#+id/ListViewPreNotes"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/bottom" />
<LinearLayout
android:id="#+id/below"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_alignParentBottom="true">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:padding="3dp">
<TextView
android:layout_height="#dimen/label_height"
android:layout_width="130dip"
android:text="#string/note"
android:layout_marginLeft="10dip"
android:gravity="center_vertical"
android:textSize="#dimen/text_size_large"/>
<EditText
android:id="#+id/OMnote"
android:layout_height="wrap_content"
android:layout_width="200dp"
android:textSize="#dimen/text_size_large"
android:inputType="textNoSuggestions|textCapSentences"
android:selectAllOnFocus="true"
android:hint="#string/note"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:baselineAligned="false">
<Button
android:id="#+id/dialogButtonClose"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="50dp"
android:text="#string/ok"
style="?android:attr/borderlessButtonStyle"
android:textStyle="bold" />
<Button
android:id="#+id/dialogButtonCancel"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="50dp"
android:text="#string/cancel"
android:textStyle="bold"
style="?android:attr/borderlessButtonStyle" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
Set ListView.Visibility to Gone when no records found and use RelativeLayout and align parent bottom.
you can add what you need to show below the ListView in its footer. You can add it like this.
View footerView = ((LayoutInflater) ActivityContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE)).inflate(R.layout.footer_layout, null, false);
ListView.addFooterView(footerView);
You can use FrameLayout as the root and then you can place your LinearLayouts on top of the ListView.
http://developer.android.com/reference/android/widget/FrameLayout.html
Some credit goes to Arsalan Shah for his suggestions.
This is the final version of how I solved my problem (kind of hacky):
First I check how many elements I have in a list view then depending on that and depending on the device and orientation mode (portrait or landscape) I inflate eather the layout in my question or another layout with listview footer that Arsalan Shah suggested.
Example:
If the device is below 7" and it is in landscape mode and the number of items in my list is above 4 I will use my layout otherwise I will use Arsalan Shah suggestion. I sort of tested for what the number of items on which layout/device should be for what layout to find the best case scenario for my design.
Hope this helps anyone else that might have the same problem.
If anyone has a suggestion how to do all this in only one layout then please comment below.
Here is my layout
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:id="#+id/LinearLayout01"
android:layout_height="wrap_content">
<Spinner android:text="#+id/AutoCompleteTextView01"
android:id="#+id/Spinner01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:width="130dp"></Spinner>
<EditText android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:id="#+id/Chapter" android:width="30dp"></EditText>
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/TextView01" android:text=":"></TextView>
<EditText android:layout_height="wrap_content"
android:layout_width="wrap_content" android:id="#+id/Verse"
android:width="40dp"></EditText>
</LinearLayout>
I inflate this layout as an AlertDialog's view. But when I pick a large element, the text fields get pushed out to the right. Is there any way to set the maximum size of the spinner so after choosing an element, it shortens the choice with an ellipsis ("...") or something?
No need to use a custom adapter. Use the android.R.layout.simple_spinner_item and then change it from ellipse marquee to end ellipse. Then set your new change layout file as layout id or use this layout file
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#android:id/text1"
style="?android:attr/spinnerItemStyle"
android:singleLine="true"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingRight="10dp"
android:ellipsize="end" />
The size of a Spinner set have android:layout_width="wrap_content" is determined by its content. If you want things ellipsized, that's up to you in your SpinnerAdapter, when you create your row Views.
Or, hard-wire an android:layout_width that is fixed in size.
Or, instead of using LinearLayout, use RelativeLayout and structure your rules such that the Spinner takes up the remaining space on the row, by anchoring it to the left side of the screen and to the left side of the first EditText. Though I'm not 100% certain what then happens if the content is too big -- it probably just gets truncated.
Set spinner android:background="#null" to solve the problem.
This will also hide the dropdown icon visibility