Why does my spinner not look like a spinner? - android

I have a spinner that looks like extremly ugly like this:
When I click on it looks a little bit better:
But still, in the default it doesn't even looks like a spinner. Any idea how can I improve its looks?
Here is the code:
adapter=new SpinAdapter(this,com.Orange.R.layout.spinnerrowlist,spinnerInfo);
adapter.setDropDownViewResource(com.Orange.R.layout.multiline_spinner_dropdown_item);
previousVisitCommentsSpinner.setAdapter(adapter);
spinnerrowlist.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:background="#FFFFFF"
android:orientation="horizontal" >
<TextView
android:id="#+id/textview_spinner1"
style="?android:attr/spinnerItemStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="5dp"
android:layout_alignParentLeft="true"
android:textColor="#drawable/textorange_selected" />
<TextView
android:id="#+id/textview_spinner2"
style="?android:attr/spinnerItemStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_toRightOf="#+id/textview_spinner1"
android:paddingLeft="5dp"
android:textColor="#drawable/textorange_selected" />
<TextView
android:id="#+id/textview_spinner3"
style="?android:attr/spinnerItemStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:paddingLeft="5dp"
android:textColor="#drawable/textorange_selected" />
</RelativeLayout>
And here is the spinner:
<Spinner
android:id="#+id/previousVisitComments"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_below="#+id/previousvisit"
android:layout_marginTop="15dp"
android:background="#drawable/spinner_selector"
android:textColor="#color/medium_orange"
android:textAppearance="?android:attr/textAppearanceMedium"
/>
The items in the spinner should be on the same line, that's why I use a horizontal layout!
Thank you for your answers!

try adding this
android:layout_toRightOf="#+id/textview_spinner1
and you can also add the following just to see if it makes a difference
android:layout_below
and let me know how it goes :)

The items in the spinner should be on the same line, that's why I use a horizontal layout!
The problem is that you are trying to squeeze a lot of text into a narrow area. However you have two options:
First using what you have, simply add the layout_toLeftOf attribute to textview_spinner2:
<TextView
android:id="#+id/textview_spinner2"
style="?android:attr/spinnerItemStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_toLeftOf="#+id/textview_spinner3"
android:layout_toRightOf="#+id/textview_spinner1"
android:paddingLeft="5dp" />
Also you said that you are using a horizontal layout but a RelativeLayout does not have the attribute orientation, so this line does nothing:
android:orientation="horizontal"
The organization of the child elements is determined by individual attributes like: layout_toLeftOf, layout_toRightOf, layout_above, etc.
Second if you a RelativeLayout behaves in unruly ways and you have a simple layout like this, you can always switch to a LinearLayout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp" >
<TextView
android:id="#+id/textview_spinner1"
style="?android:attr/spinnerItemStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0"
android:textColor="#drawable/textorange_selected" />
<TextView
android:id="#+id/textview_spinner2"
style="?android:attr/spinnerItemStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:paddingLeft="5dp"
android:textColor="#drawable/textorange_selected" />
<TextView
android:id="#+id/textview_spinner3"
style="?android:attr/spinnerItemStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0"
android:paddingLeft="5dp"
android:textColor="#drawable/textorange_selected" />
</LinearLayout>
Now none of the columns in your Spinner overlap.

You could try (android.R.layout.simple_spinner_dropdown_item) in your Java code. Instead of this (com.Orange.R.layout.multiline_spinner_dropdown_item) Hope this helps.

Related

How do I right justify a TextView in a Linear Layout?

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.

Unwanted padding in android

I have an imageview and textview in a LinearLayout with horizontal orientation. Do not know why the textview has a space on the left that I can not remove ...
I tested with padding, gravities, etc. ...
This is my xml and result in an image
Any idea?
Thank you!
<?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:gravity="left|center_vertical"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/dot" />
<TextView
android:id="#+id/text_resultado"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="sans-serif-light"
android:gravity="center"
android:padding="3dp"
android:text="TextView"
android:textColor="#color/negroLetras"
android:textSize="#dimen/titles" />
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="sans-serif-light"
android:paddingBottom="3dp"
android:paddingRight="3dp"
android:paddingTop="3dp"
android:text="%"
android:textColor="#color/negroLetras"
android:textSize="#dimen/titles" />
</LinearLayout>
Propably you have something wrong with you drawable "dot" or other values like dimen etc.
I think that because I used your code without this values with other sample values and layout was ok.
There is no problem in your code. Your code is perfect. May your problem be in image. Check it or replace it with other and then check it.
May i suggest you to change a little bit your layout?
Delete second LinearLayout and use a TextView like this:
<TextView
android:id="#+id/text_resultado"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableLeft="#drawable/dot"
android:fontFamily="sans-serif-light"
android:gravity="center"
android:padding="3dp"
android:text="TextView"
android:textColor="#color/negroLetras"
android:textSize="#dimen/titles" />

RelativeLayout margin problem, text bleeding into other "fields"

been trying to figure out Android layouts and having a bit of an issue. i got as far as figuring out how to get the objects in the places i want, using a RelativeLayout (tried LinearLayout and TableLayout combinations, only to find that gravity and attributes weren't doing things i thought they would...) but i've run into an issue with text bleeding behind other text.
the second item demonstrates the problem. i'd like to have this same layout without the text bleeding. here is my code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="?android:attr/listPreferredItemHeight"
android:layout_width="wrap_content"
android:padding="6dip">
<TextView android:id="#+id/item_text_product"
android:layout_alignParentLeft="true"
android:textSize="24sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView android:id="#+id/item_text_total"
android:layout_alignParentRight="true"
android:textSize="18sp"
android:textStyle="bold"
android:textColor="#00aa00"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView android:id="#+id/item_text_count"
android:layout_alignParentRight="true"
android:layout_below="#id/item_text_total"
android:textSize="12sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView android:id="#+id/text_count"
android:text="Count: "
android:textSize="12sp"
android:layout_toLeftOf="#id/item_text_count"
android:layout_alignBaseline="#id/item_text_count"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</RelativeLayout>
Put first your item_text_count and text_count items (I mean, put them above the text_count in the XML)... then:
<TextView android:id="#+id/item_text_total"
android:layout_alignParentRight="true"
android:layout_toLeftOf="#id/text_count"
android:textSize="18sp"
android:textStyle="bold"
android:textColor="#00aa00"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
As you see, the difference is android:layout_toLeftOf="#id/text_count".
Set a maxEms attribute on the product TextView so that it's width can never exceed n ems.
That way should be the best solution.
I think you just have to add android:layout_toRightOf="#id/item_text_product" to the second textView, but can't try it right now.
The issue is with wrap_content, with it the view is going to expand to fit its content.
What about shrinking the text and using nested Linear Layouts?
You might try and use a LinearLayout if you don't want overlapping behavior.
Something like:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="?android:attr/listPreferredItemHeight"
android:layout_width="wrap_content"
android:padding="6dip">
<TextView android:id="#+id/item_text_product"
android:textSize="24sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"/>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView android:id="#+id/item_text_total"
android:layout_alignParentRight="true"
android:textSize="18sp"
android:textStyle="bold"
android:textColor="#00aa00"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView android:id="#+id/item_text_count"
android:layout_alignParentRight="true"
android:layout_below="#id/item_text_total"
android:textSize="12sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView android:id="#+id/text_count"
android:text="Count: "
android:textSize="12sp"
android:layout_toLeftOf="#id/item_text_count"
android:layout_alignBaseline="#id/item_text_count"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</RelativeLayout>
</LinearLayout>
layout_weight="1" causes that view to expand to fill the available space not taken up by the right-hand views.

How to get Side by Side textviews with one that wraps

I have a listview with a custom adapter in which I have 3 textviews, two are next to each other and one is below the others. The problem I am running into though, is when the first textview extends, it pushes the other textview off the screen.
I have not been able to successfully get this to work, here is an example of what's happening:
As you can see when the first textview gets too long, it then pushes the other text off the screen. I would like it so it wraps but the date textview is also showing. It should also be functional in horizontal view.
Here's the listview adapter code:
<RelativeLayout android:id="#+id/vw1" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:orientation="horizontal"
android:descendantFocusability="blocksDescendants" xmlns:android="http://schemas.android.com/apk/res/android">
<TextView android:id="#+id/liName" android:textSize="17sp"
android:textColor="#333" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:gravity="left"
android:layout_gravity="left" />
<TextView android:id="#+id/liDate" android:textSize="12sp"
android:textColor="#666" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:gravity="right"
android:layout_gravity="right" android:width="60sp" android:layout_toRightOf="#+id/liName" />
<TextView android:id="#+id/liNum" android:textSize="12sp"
android:textColor="#666" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:layout_below="#+id/liName" />
</RelativeLayout>
I am assuming that the text view being pushed is the liDate one.
You need to put this one before the liName in your layout and set the width to "wrap_content" and align it right. Then you lace the liName to the left of it with "fill_parent" width
So it would look like this:
<RelativeLayout android:id="#+id/vw1" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:orientation="horizontal"
android:descendantFocusability="blocksDescendants" xmlns:android="http://schemas.android.com/apk/res/android">
<TextView android:id="#+id/liDate" android:textSize="12sp"
android:textColor="#666" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:width="60sp"
android:layout_alignParentRight="true" />
<TextView android:id="#+id/liName" android:textSize="17sp"
android:textColor="#333" android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_toLeftOf="#id/liDate" />
<TextView android:id="#+id/liNum" android:textSize="12sp"
android:textColor="#666" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:layout_below="#+id/liName" />
Hope this is what you meant
The key was using "#+id/" for the first textview instead of "#id/"
This worked for me:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/listEventTypeText"
android:layout_toLeftOf="#+id/listEventDateText"
android:layout_alignParentLeft="true"
/>
<TextView
android:id="#+id/listEventDateText"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignBaseline="#id/listEventTypeText"
/>
</RelativeLayout>

android, cannot align icons on the right in listview's row

I am currently working on my first android app. In a listview, I need to have the following organisation in each row:
On the left: one main icon on which takes the whole height of the row
On the middle: 2 texts, one below the other
On the right: 2 icons, one below the other
I end up with a row.xml file like this, but that does not work as I expect.
Do you know if something obvious is missing in this file ?
Thanks a lot,
Luc
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="?android:attr/listPreferredItemHeight"
android:padding="6dip">
<ImageView
android:id="#+id/icon"
android:layout_width="48px"
android:layout_height="48px"
android:layout_marginRight="0dip"
android:src="#drawable/icon" />
<LinearLayout
android:orientation="vertical"
android:layout_width="0dip"
android:layout_weight="1"
android:layout_height="wrap_content">
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textSize="16dp"
android:textStyle="bold"
android:text="TITLE"
android:paddingLeft="5dp"
/>
<TextView
android:id="#+id/description"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textSize="14dp"
android:text="DESCRIPTION"
android:paddingLeft="5dp"
/>
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_weight="1"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_gravity="right">
<ImageButton
android:id="#+id/button_modify"
android:layout_width="16px"
android:layout_height="16px"
android:src="#drawable/deleteicon"
/>
<ImageButton
android:id="#+id/button_delete"
android:layout_width="16px"
android:layout_height="16px"
android:src="#drawable/modifyicon"
/>
</LinearLayout>
In the right-hand-column LinearLayout, add
android:layout_width="wrap_content"
android:gravity="right"
That should make the icons should fall to the right (because of the gravity setting.)
Consider switching to RelativeLayout for a rule set like you describe. Using LinearLayouts may not work in all cases and will be less efficient than the RelativeLayout in terms of stack consumption.

Categories

Resources