Android - List view with single choice radio buttons - android

I have a list view with 2 radio button items. When inflated it from a layout, it is happening to be scrollable even if there is a lot of space as shown below.
As shown in screenshot, I have 2 radio buttons.
1. Distance
2. Rating
But the "rating" radio button is not visible and I have to scroll to see it. Why is this happening. I tried to setting the layout height to wrap content, fill parent and match parent. But that didn't solve the problem. Any idea why is this happening?
here i am referencing the list view :
ListView radio_list = (ListView) view.findViewById(R.id.RadioList);
radio_list.setAdapter(new ArrayAdapter<String>(this,
android.R.layout.simple_list_item_single_choice,
radio_list_items));
radio_list.setItemsCanFocus(true);
radio_list.setChoiceMode(ListView.CHOICE_MODE_SINGLE);
my xml:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ffffff"
android:paddingLeft="10dp"
android:text="SEARCH"
android:textColor="#FF3300"
android:textSize="20dp" >
</TextView>
</LinearLayout>
<RelativeLayout
android:id="#+id/searchTextLayout"
android:layout_width="match_parent"
android:layout_height="50dip"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginBottom="20dip"
android:layout_marginLeft="20dip"
android:layout_marginRight="20dip"
android:layout_marginTop="20dip"
android:orientation="horizontal" >
<ImageButton
android:id="#+id/searchTextButton"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:background="#685E5C"
android:contentDescription="Sample"
android:scaleType="fitCenter"
android:src="#drawable/abs__ic_search" />
<EditText
android:id="#+id/searchText"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_toRightOf="#id/searchTextButton"
android:background="#drawable/background_black_border_full"
android:padding="8dp"
android:textColor="#android:color/white" />
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ffffff"
android:paddingLeft="10dp"
android:text="SORT BY"
android:textColor="#FF3300"
android:textSize="20dp" >
</TextView>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<ListView
android:id="#+id/RadioList"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
/>
</LinearLayout>
</LinearLayout>

Your layout xml file is weird,
first of all you should simplify it :
there is no point of having one single element in a LinearLayout => it means the corresponding linear layout is useless.
second point : if there is 2 child in a linear layout, and the first one has a height of "match_parent" without any layout_weight set, the second one will be pushed out because there isn't any space left. ( its probably your problem here)
third point : your are using a relative layout as a linearlayout, proof is the android:orientation parameter you try to use on it. it is useless. position of relative layout childs are given by relative positioning between them. in your case you can use a LinearLayout with orientation horizontal instead of the RelativeLayout
best advise to help you : simplify your layout xml.
More on this topic.

Related

when adding views they go one below another even if width is wrap content

I have a Linear layout then programatically I'm adding some spinners and buttons and so on, but I have xml button Wrap content (width) and then on java I add spinner (or anything else) and it goes below this view even if both views are wrap content:
progBar = new ProgressBar(this);
pBarToca = new ProgressBar(this);
pBarToca.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT));
linToca = (LinearLayout) findViewById(R.id.tetoca);
linToca.addView(pBarToca);
and it's placed under the button of xml:
<LinearLayout android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" android:layout_marginTop="6dp"
android:id="#+id/tetoca">
<TextView style="#style/StylePartida"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/te_toca_jugar" />
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#A7E9A9" android:onClick="callJugar"
android:text="#string/jugar" />
</LinearLayout>
edit!!!!!!
I want textview on first line then on next line button + progressbar (for example)
You have android:orientation=vertical so the Views will be laid out starting at the top and going down.
If you want them to all be next to each other, remove that from your xml since the default orientation for a LinearLayout is horizontal. If you do this, you will obviously need to change the android:width to wrap_content for your TextView or else it will take up the entire screen.
After your comment, a RelativeLayout would work best here.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<TextView
style="#style/StylePartida"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/te_toca_jugar"
android:id="#+id/tvID" /> // give it an id
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="6dp"
android:id="#+id/tetoca"
android:layout_below="#/id=tvID"> // place it below the TV
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#A7E9A9" android:onClick="callJugar"
android:text="#string/jugar" />
</LinearLayout>
</RelativeLayout>
Note the changes in the comments. Now when you add your progressbar to the LL, it should be next to the Button. You may need some changes but this should give you approximately what you want.
<LinearLayout android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="6dp"
android:id="#+id/tetoca">
<TextView style="#style/StylePartida"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/te_toca_jugar"
android:text="#string/te_toca_jugar" />
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#A7E9A9" android:onClick="callJugar"
android:text="#string/jugar" />
</LinearLayout>
In your textView you are matching the parent
android:layout_width="match_parent"
This will cause the textview to take up the entire width of the parent view.
android:layout_width="wrap_content"
and
android:orientation="horizontal"
android:orientation="vertical" will cause the elements to be stacked.
If you are using "horizontal" it's important not to have a child element with width matching parent.
EDIT:
After OPs change to question:
I have used a textview, two buttons and listview to give you an idea of how you can format it. There are many ways to achieve the same thing, this is one suggestion.
The internal linearlayout has a horizontal orientation (by default).
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="6dp"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="te_toca_jugar"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#A7E9A9"
android:text="jugar"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#A7E9A9"
android:text="jugar2"/>
<ListView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/lv">
</ListView>
</LinearLayout>
</LinearLayout>

list view taking up more space than needed

This is my custom dialog which consist of the following
list view,button and finally a textview used when the list is empty.
My problem is the listview seems to take up more space than it needs to when only 1 item exists.
The image below shows this.
My 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" >
<ListView
android:id="#+id/lvRaffles"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/bCloseDialog"
android:layout_alignParentTop="true" >
</ListView>
<Button
android:id="#+id/bCloseDialog"
style="?android:attr/buttonStyleSmall"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:background="#drawable/alert_dialog_button_style"
android:text="Close" />
<TextView
android:id="#+id/tvRaffleEmpty"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:gravity="center"
android:text="No Raffle Code Found With That Search"
android:textAppearance="?android:attr/textAppearanceMedium"
android:visibility="gone" />
</RelativeLayout>
I have tried the following.
List View height on wrap_content, 0dp does not help.
I know you fixed this with LinearLayout but to answer your question, the reason it appears as if your listview is taking up too much space is because you used layout_alignParentBottom="true" if you want the button to appear below the listview you would need to use layout_below="#id/lvRaffles" You also have two elements aligned to parentTop, which can cause the elements to overlap.

ExpandableListView overlaps Text in RelativeLayout

I have relative layout ("relative") with clickable layout ("clickable") on top, expandable list view ("lview") under "clickable", and "footer" text view with version of my app on bottom of "relative":
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/relative"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/menu_background" >
<com.reconti.app.widgets.Logo
android:id="#+id/reconti_menu_tv_logo"
android:layout_width="fill_parent"
android:layout_height="?android:attr/actionBarSize"
android:layout_alignParentTop="true"
android:gravity="center_vertical"
android:paddingLeft="#dimen/standart_side_margin"
android:textSize="30sp" />
<RelativeLayout
android:id="#+id/clickable"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/menu_tv_logo"
android:layout_marginBottom="10dp"
android:layout_marginTop="10dp"
android:clickable="true"
android:paddingLeft="#dimen/standart_side_margin" >
<com.reconti.app.widgets.RoundedImageView
android:id="#+id/menu_profile_avatar"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:scaleType="fitCenter"
android:src="#drawable/com_facebook_profile_picture_blank_portrait" />
<TextView
android:id="#+id/menu_user_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:layout_toRightOf="#id/menu_profile_avatar"
android:singleLine="true"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#color/white" />
</RelativeLayout>
<ExpandableListView
android:id="#+id/lview"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:childDivider="#color/menu_divider_color"
android:divider="#color/menu_divider_color"
android:dividerHeight="1dp"
android:footerDividersEnabled="false"
android:groupIndicator="#null"
android:headerDividersEnabled="false"
android:listSelector="#drawable/expandable_row_background" />
<TextView
android:id="#+id/footer"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_alignParentBottom="true"
android:layout_marginTop="10dp"
android:gravity="center"
android:singleLine="true"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="#color/white" />
</RelativeLayout>
Everything looks good as long as user hit some option in expandable list. Then "lview" overlaps "footer". I would like to achive effect, that "lview" remains on top of "footer" and "footer" remains on bottom of "relative" and only bottom of "lview" is visible to user (so top goes under "clickable"). I hope I explained it clearly:)
Usually I like to work with linearlayout when needs to keep views above views. I don't like how relative layout works sometimes. Well, you can try my idea, I know this works with list, but didnt try with expandable list (but guess will work).
LinearLayout vertical #relative
Logo #reconti_menu_tv_logo
RelativeLayout #clickable
ListView weight 1 #lview
TextView #footer
In this, only your ListView will scroll. I don't know if is this what you want. Your logo, clickable and footer will be fixed.
The weight 1 is to keep your listivew using all not used space, so your footer will be always on "footer". Don't forget about height 0dp when using weight.
Now, if you want all scrolling, you have to use addHeader(View) and addFooter(View) on your list before set the adapter. (this is the better way)

100% height android listview

I am just starting to develop android apps. I have a layout question. I want to create the main screen for my app. It is a menu with 7 options, each options would be an icon at the left, a short text and a check at the left (on/off component).
I have written it in a list view element, I have created a simple adapter with this 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" >
<ImageView android:id="#+id/icon"
android:layout_width="?android:attr/listPreferredItemHeight"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:src="#drawable/ic_action_io"/>
<TextView android:id="#+id/title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/icon"
android:layout_alignParentTop="true"
android:textAppearance="?android:attr/textAppearanceLarge"
android:singleLine="true" />
</RelativeLayout>
Menu will have always 7 options, I would like that the listview filled the height of the screen. Each element with the same height. Is it possible that with listview? Or, perhaps would be better making the menu out of a list view?
I have been reading about linear layout and the weight property. Please, could you help me? It is my first layout, I would thank any advice aboput layout I should use.
Thanks a lot, best regards!
P.D: Sorry for my english.
I would use a Linearlayout and inside i put all the items to be displayed...
Something like this:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/LinearLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MainActivity" >
<RelativeLayout android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" >
<ImageView android:id="#+id/icon"
android:layout_width="?android:attr/listPreferredItemHeight"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:src="#drawable/ic_launcher"/>
<TextView android:id="#+id/title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/icon"
android:layout_alignParentTop="true"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Texto"
android:singleLine="true" />
</RelativeLayout>
<RelativeLayout android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" >
<ImageView android:id="#+id/icon"
android:layout_width="?android:attr/listPreferredItemHeight"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:src="#drawable/ic_launcher"/>
<TextView android:id="#+id/title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/icon"
android:layout_alignParentTop="true"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Texto"
android:singleLine="true" />
</RelativeLayout>
<!-- Repeat the item five times more -->
</LinearLayout>
if you want all the items to be displayed (without a scroll) then there's no use in a ListView. use a LinearLayout instead and set the layout_weight of each menu item to 1.
As the others guys said is better use the LinearLayout. And like you mentioned you can use weight attribute too.
Equally weighted children
To create a linear layout in which each child uses the same amount of space on the screen, set the android:layout_height of each view to "0dp" (for a vertical layout) or the android:layout_width of each view to "0dp" (for a horizontal layout). Then set the android:layout_weight of each view to "1".
As you are trying to implement a Menu, I think the best approach is substitute each RelativeLayout(with textview and imageview) for a button. So, your layout will be like that:
<?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"
android:weightSum="7.0" > //Defines the maximum weight sum
<Button
android:id="#+id/button1"
android:layout_width="match_parent"
android:height="0dp"
android:layout_weight="1"
android:text="Option 1"
android:drawableLeft="#drawable/icon1"
android:onClick="handleOption"/> // method to handle onClick
<Button
android:id="#+id/button2"
android:layout_width="match_parent"
android:height="0dp"
android:layout_weight="1"
android:text="Option 2"
android:drawableLeft="#drawable/icon2"
android:onClick="handleOption"/> // method to handle onClick
//Add more five buttons
.
.
.
In your activity, you should load this layout, using setContentView() and you must implement a method handleOption like below to handle onClick event of each button.
public view handleOption(View view)
{
switch(view.getId()) ....
}
In that way, you do not need implement onClickListener Interface, have one method to each button and set the onClickListener for each button.

RelativeLayout weight

In a layout resource XML, I have 3 RelativeLayout(s) which are inside a main RelativeLayout. The view will be shown vertically. These 3 RelativeLayout() are set next to each other, and I want them to fill the whole screen, doesnt matter what will be the screen size. My, layout view:
<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:background="#drawable/backg"
>
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginTop="#dimen/top_mr_image"
android:src="#drawable/temp" />
<RelativeLayout
android:id="#+id/r1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_below="#+id/imageView1"
android:layout_marginLeft="10dp"
android:background="#drawable/r1bg"
android:layout_weight="1"
>
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginLeft="#dimen/txt_mr_right"
android:layout_marginRight="#dimen/txt_mr_right"
android:layout_marginTop="39dp"
android:text="S"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#id/textView1"
android:layout_marginLeft="#dimen/txt_mr_right"
android:layout_marginRight="#dimen/txt_mr_right"
android:text="T"
android:textAppearance="?android:attr/textAppearanceLarge" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/r2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignTop="#+id/r1"
android:layout_toRightOf="#+id/r1"
android:layout_weight="1" >
</RelativeLayout>
<RelativeLayout
android:id="#+id/r3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignTop="#+id/r2"
android:layout_toRightOf="#+id/r2"
android:layout_weight="1" >
</RelativeLayout>
I set weight=1 and layout_width=0dp for each relativeLayout and this technique works with buttons, I thought the same will be with relativeLayout, seems my thoughts were wrong. Any idea?
UPD1: I have added an image of what I would like to have
RelativeLayout does not pay attention to android:layout_weight. (That's a property of LinearLayout.LayoutParams, but not of RelativeLayout.LayoutParams.)
You should be able to get the layout you want with a much simpler view hierarchy. It's not clear what you are trying to do, since the last two RelativeLayouts are empty. If you need a purely vertical organization, I'd suggest using LinearLayout instead of RelativeLayout.
EDIT Based on your edit, it looks like you want a horizontal layout of three compound views, each one clickable. I think something like the following will work:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<!-- First column -->
<LinearLayout
android:id="#+id/firstColumn"
android:orientation="vertical"
android:gravity="center_horizontal"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="..." />
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="text 1"
. . . />
</LinearLayout>
<!-- Second column -->
<LinearLayout . . . >
. . .
</LinearLayout>
</LinearLayout>
If the contents of the buttons aren't correct, you can replace the second-level LinearLayout views with RelativeLayout if that helps organize the layout better.
RelativeLayouts do not support weight. You need to use a LinearLayout as a parent container if you want to use weights.
Solution is very simple. I have been looking for weight distribution in relative layout.
It's a small trick for all these kind situations.
Use LinearLayout with android:orientation="horizontal"
You can use Horizontally oriented LinearLayout Manager in the Recycler View, and place each RelativeLayout in each item, of its Adapter.
The Link: How to build a Horizontal ListView with RecyclerView?
If your RelativeLayouts are set to a fixed width and height, that is to the size of the Screen, that you can get from DisplayMatrics, that will be OK.
The Link: Get Screen width and height
If the contents of your RelativeLayouts are different, then you can use getItemViewType() method.
Please see: How to create RecyclerView with multiple view type?
Happy Coding :-)

Categories

Resources