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.
Related
In a layout file I have a Listview whose size can grow/shrink dynamically. I have a button btn_rec_add and it's click event I add an item in the ListView. I have tried many changes in the Layout file but haven't been able to make the button shift its location based on number of items in the ListView. If I keep the button in the same RelativeLayout which has the ListView, then the button moves dynamically which is exactly how I want but I can't see the button after adding 5 or more elements in 4.3 inch display phones. If I keep the button outside the RelativeLayout of the ListView, then it is fixed on the screen.
Currently, the btn_rec_add is fixed to the bottom of the layout. Can someone please help me solve this problem.
Here is the XML code:
<?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="#drawable/bg" >
<ImageView
android:id="#id/top_bar_view"
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#drawable/top_bar"
android:contentDescription="#string/content" />
<TextView
android:id="#+id/txt_recipients"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="8dp"
android:padding="8dp"
android:text="#string/text_recipients"
android:textColor="#FFFFFF"
android:textSize="16sp" />
<ImageButton
android:id="#id/btn_back"
android:layout_width="80dp"
android:layout_height="50dp"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:contentDescription="#string/content"
android:paddingTop="6dp"
android:src="#drawable/ic_back" />
<RelativeLayout
android:id="#+id/Rlayout_recipients"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_above="#id/btn_rec_add"
android:layout_alignParentLeft="true"
android:layout_below="#id/top_bar_view" >
<ListView
android:id="#+id/rec_list"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:divider="#null"
android:dividerHeight="0dp"
android:paddingTop="20dp" />
</RelativeLayout>
<ImageButton
android:id="#+id/btn_rec_add"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:contentDescription="#string/content"
android:src="#drawable/icon_add" />
</RelativeLayout>
If I understand correctly, you want the behavior of the button to be as follows:
Appear below the last ListView item if the ListView does not extend to fill screen
If the ListView extends the full height of the screen, the button should be at the bottom of the screen, but the list should remain scrollable
If my understanding is correct, you should place your ListView and your button in a LinearLayout as follows:
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ListView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<Button
android:layout_width="match_parent"
android:layout_height="#dimen/button_height"
android:background="#drawable/button_image" />
</LinearLayout>
The effect of the above layout is as follows:
Layout in which items are vertically placed
Layout which will be as wide as parent, but as tall as ListView and Button
ListView will take up all of the space in the layout that the button does not occupy (this is layout_weight="1" whereas Button has no layout weight so it will simply fill as much space as it needs as defined in this case by #dimen/button_height)
Great Android layout question!
Your Problem is related to User Experience.
You have to decide whether user will like to scroll to end of the list to press add button
or user want to add without scrolling to end of list.
Since you only have two options with our scenario,
either keep add button fixed or add it as footer of listview.
This question already has answers here:
ListView inside ScrollView is not scrolling on Android
(27 answers)
Closed 3 months ago.
I am having a xml file in which UI elements are arranged in the following sequence. The data I am parsing is being populated on the listView but the listView is not scrollable.Please help me
ImageView
TextView
imageView
ListView
imageView
layout.xml
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scrollView_description"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fillViewport="true"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffffff"
android:focusableInTouchMode="true"
android:orientation="vertical" >
<ImageView
android:id="#+id/imageView_now_playing"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:scaleType="fitXY" />
<TextView
android:id="#+id/textView_DailyLimit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/imageView_now_playing"
android:layout_centerHorizontal="true"
android:layout_marginLeft="15dp"
android:layout_marginRight="15dp"
android:layout_marginTop="2dp"
android:textAppearance="?android:attr/textAppearanceMedium" />
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_below="#+id/button_PlayArea"
android:layout_marginTop="20dp"
android:background="#ffffff"
android:orientation="vertical" >
<ListView
android:id="#+id/listViewEpisodes"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:cacheColorHint="#000000"
android:divider="#android:color/black"
android:dividerHeight="5dp"
android:textColor="#000000" />
</LinearLayout>
<ImageView
android:id="#+id/button_Characters"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/linearLayout1"
android:layout_marginTop="20dp"
android:scaleType="fitXY"
android:src="#drawable/gallery" />
<ImageView
android:id="#+id/button_PlayArea"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/textView_DailyLimit"
android:layout_marginTop="20dp"
android:scaleType="fitXY" />
</RelativeLayout>
</ScrollView>
You are making a big mistake here by placing the Listview inside Scrollview. Remove Scrollview and UserRelativeLayout as the Top parent and the Listview will scroll.
Also a UX suggestion is never ever use two scrollable items in side
one another as user would never be able to know what has to be
scrolled. And similarly you won't be able to recognize what is user
trying to scroll.
Suggestion
You can do one thing. Just keep your TextView inside the Scrollview and below it keep your listview but don't make the whole layout scrollable. i.e. two elements can be scrolled but not the whole screen with scrollable elements.
Never put a listView inside a scrollView. Never ever.
Watch his great video to know more abt listView
http://www.youtube.com/watch?v=wDBM6wVEO70
ListView does not need inside the ScrollView to make it scrollable because ListView will be scrollable if the content is too long.
You can put listview inside scrollview. See this https://stackoverflow.com/a/18354096/942224
and set this value of listview
yourListView.setExpanded(true);
The row of my ListView is made of two TextViews:
I have to position the first TextView at the leftmost position and the second TextView at the rightmost position. How can I achieve this?
(Minimum API support should be at least 2.3 Gingerbread)
Simple make a layout xml file, which will be inflated into each row and in that layout you can use for example android:gravity="left" and android:gravity="right" for first and second TextView
You need to implement Custom List Adapter and in the Layout add RelativeLayout with two textview one aligning to left with parent and one with right.
See ListView Customization
and Custom List adapter
Best practice it is using RelativeLayout for this purpose
<?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"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:layout_gravity="center"
>
<TextView
android:id="#+id/txtViewTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<TextView
android:id="#+id/desk"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/txtViewTitle"
/>
</RelativeLayout>
Only the following markup worked for me:(tested on Android 2.3 device)
For the 1st TextView:
android:layout_alignParentLeft="true"
android:layout_alignParentRight="false"
For the 2nd TextView:
android:layout_alignParentLeft="false"
android:layout_alignParentRight="true"
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.
I'm looking to create a listview screen similar to the Sound Setting screen (in the built in Settings app, see image below), i.e I want some rows to have text + checkboxes, other rows to have text + "pop up" buttons, some rows should have text only etc.
What is the best way to accomplish this?
As pointed out by Falmarri, that isn't a ListView but a PreferenceActivity.
If you can't work with the PreferenceActivity, the simplest way to make a list of different items that will scroll if they out-grow the screen, is to place a ScrollView around a LinearLayout. You can read more about it here: http://developer.android.com/reference/android/widget/ScrollView.html
Below is a very simple example:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:text="Some text label here"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<Button
android:text="A button to click"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
/>
</RelativeLayout>
<EditText
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:hint="Perhaps an input field here"
/>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:text="Some more text, and a check box"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<CheckBox
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
/>
</RelativeLayout>
</LinearLayout>
</ScrollView>
Now this list doesn't contain enough items to scroll, but if you keep adding more elements to it it will start to scroll as soon as it gets bigger than the screen.
That's not a listview, that's a PreferenceActivity. Take a look at the PrefereceActivity class
http://developer.android.com/reference/android/preference/PreferenceActivity.html
If you really want to have a different view for each row in a listview (which is very valid), you'll have to create your own class that extends BaseAdapter. In the getView() method, just return the view you want to show. There are plenty of examples online.