I am making a screen for the addition of a contact.
For the phones and phone types I have an EditText and a Spinner type and these are included in a LinearLayout
If I add my Layout on a xml and inflate it to reuse it as many times as required, the result is quite different.
LinearLayout phoneLayout= (LinearLayout) inflater.from(ctx).inflate(R.layout.add_contact_phone_element, container, false);
Specifically, there are 3 differences I need help with how to solve them, and if possible why they happen.
On the first image you can see one field how it seems at the original xml and how it looks when added programmatically from another xml.
The text color is white at the inflated field
Spinner color is white at the inflated field when non expanded
When expanded, the spinner is different from the original (photos 2,3). On the expanded, its black background with white color on the text.
What is wrong and they appear so differently?
You can see the code here. The same code is included at the original xml, its just copy-pasted to another so it can be reused.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/phone1Cont"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_toRightOf="#id/phoneImg"
android:orientation="horizontal">
<EditText
android:id="#+id/InputPhoneValue"
style="#style/Dialog.Contact.AddText"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1.5"
android:hint="#string/JournalDetailViewPhoneLabel"
android:inputType="phone" />
<Spinner
android:id="#+id/phoneTypeSpinner"
style="#style/Widget.AppCompat.Spinner.Underlined"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_gravity="center_vertical"
android:layout_toRightOf="#+id/InputPhoneValue"
android:layout_weight="1"
android:backgroundTint="#color/grey"
android:entries="#array/phone_type" />
</LinearLayout>
Related
How do I apply an ellipsis to the spinner instead of the dropdown views? When I search for terms like spinner custom view, spinner ellipsis or spinner long text I get results for the views in the dropdown.
For example:
Spinner with long text not working fine
How to wrap lengthy text in a spinner
Spinner does not wrap text -- is this an Android bug?
I have Spinner with some items, some of which have long text
This is not what I'm looking for, I'm looking for the actual spinner text.
An image to illustrate my problem
The content is Recipe for disaster/Freeing king awowogei but the spinner tries to place it on the next line, which is what I do not want. Instead it should add ellipsis at the end and displaying Recipe for disaster/Freeing king awo... or something.
The spinner content is loaded from a string array and a custom adapter, this all works fine.
I've tried adding
android:ellipsize="marquee"
android:singleLine="true"
To my custom dropdown view, but that's not working. The spinner does not have properties regarding text wrapping so I cannot find out how to achieve this.
The container for the Spinner has a height of 50dp because I do not want the spinner to be higher than that.
And in case it's relevant the simplified xml code of the views
quest_row.xml the view that I use in my adapter
<?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="#color/input_background_color"
android:orientation="horizontal"
android:padding="5dp">
<TextView
android:id="#+id/quest_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:textColor="#color/text"
android:textSize="18sp"/>
</LinearLayout>
quest.xml the main layout
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
android:gravity="center_vertical"
android:orientation="horizontal">
<Spinner
android:id="#+id/quest_selector_spinner"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:dropDownWidth="wrap_content"
android:padding="5dp"/>
</LinearLayout>
Put android:ellipsize="end" on the TextView that you are using in your SpinnerAdapter (quest_row.xml, I assume).
Your question shows that you tried android:ellipsize="marquee", which will not work and isn't what you are looking for anyway ("it should add ellipsis at the end").
While working with ListViews I ran into an interesting issue. So my goal was to write an xml layout for a custom ListView item design.
First of all, here is the problematic xml layout (problem described below):
<?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="?android:attr/activatedBackgroundIndicator" >
<TextView
android:id="#+id/notebook_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:textAppearanceLarge"
android:layout_toRightOf="#+id/notebook_color_tag"
/>
<View
android:id="#+id/notebook_color_tag"
android:layout_width="20dp"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
/>
</RelativeLayout>
The layout is fairly basic, just a View, that's used to display a color, and a TextView.
I have a subclass of ListFragment which uses an instance of a subclass of CursorAdapter in its setListAdapter() method. In that custom CursorAdpater's bindView() I set the View's color and the TextView's text (that code is not the problem, you can ignore it, it's just here for referrence):
#Override
public void bindView(View view, Context context, Cursor cursor) {
TextView notebookName = (TextView) view.findViewById(R.id.notebook_title);
View colorTag = view.findViewById(R.id.notebook_color_tag);
String name = cursor.getString(NOTEBOOK_NAME_POS);
int color = cursor.getInt(NOTEBOOK_COLOR_POS);
notebookName.setText(name);
colorTag.setBackgroundColor(color);
}
Now, the problem is that if the View's android:layout_height is set to match_parent or wrap_content, the View simply does not appear in the ListView's items. It seems as it has some margin at the top. If a concrete width value is specified, for example: android:layout_height="40dp", everything works fine.
Here is how the bogus layout looks:
Here is how it should look:
As explained above, the blue rectangle does not seem to be inside the ListView's item container at all (but the element is there, it's accessible via findViewById() and it's color does get changed via the setBackgroundColor()call, the View simply seems not to be displayed).
The follwoing change to the layout fixes the problem:
<?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="horizontal"
android:background="?android:attr/activatedBackgroundIndicator" >
<View
android:id="#+id/notebook_color_tag"
android:layout_marginTop="0dp"
android:layout_width="20dp"
android:layout_height="match_parent"
/>
<TextView
android:id="#+id/notebook_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:textAppearanceLarge"
/>
</LinearLayout>
I understand that LinearLayout makes more sense here than the RelativeLayout, but I'm curious what was wrong in the RelativeLayout's case.
You have duplicate 'notebook_color_tag' ID's. You are adding it twice in the first layout XML (as a parameter in the TextView and also as a child of the layout).
Also, I would reverse the order, like so:
<View
android:id="#+id/notebook_color_tag"
android:layout_width="20dp"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
/>
<TextView
android:id="#+id/notebook_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:textAppearanceLarge"
android:layout_toRightOf="#id/notebook_color_tag"
/>
Since the RelativeLayout will create and place in the order of the XML, this is more efficient (it does not have to remeasure to place the views correctly.
I have just started learning Android. Few confusions I have regarding layouts in XML
Are all views that I define in my layout are essentially inflated or they are optional? Suppose I have two different views in a view-group but I want to
use only first or only second conditionally. Is it possible?
How dynamically created views deal with layout.XML
file?
If I want received messages to be shown in red and sent messages in black how can I do that?
You can include views in the XML layout file that are invisible until you programatically display them. Just use "android:visible="gone" or "android:visible="invisible" in the XML file.
For instance, I include the following in my layout file initially but it's not visible:
<LinearLayout
android:id="#+id/pnlLatLong"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:visibility="gone"
>
<TextView
android:id="#+id/lblLatLng"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/lat_long"
/>
<EditText
android:id="#+id/txtLatitude"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="numberDecimal|numberSigned"
/>
<EditText
android:id="#+id/txtLongitude"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="numberDecimal|numberSigned"
/>
</LinearLayout>
In Java code, when the code logic dictates it should be visible, I change the visibility programatically to:
View v = findViewById(R.id.pnlLatLng);
v.setVisibility(View.VISIBLE);
you can set android:visibility="gone" in xml or by code setVisibility(View.gone); for change text color you can set android:text color="#000000" or by code setTextColor();
This question is in a way a continuation of my last question.
My problem now is pretty much the same, except that instead of separating the image and text in differend views (namely ImageView and TextView) I learned I can use the attribute android:drawableLeft to set an image "for" my text (the suggestion was pointed to me by Eclipse with a warning icon on the LinearLayout line).
I thought the only difference would be that instead of setting the ImageView with setImageResource() method I would simply set the TextView's drawableLeft attributed with the setCompoundDrawablesWithIntrinsicBounds() method. Instead, when I made the change, I was taken back to my original issue: the text aligns with the top edge of the view rather than the center.
This is what my TextView looks like:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
>
<TextView
android:id="#+id/account_login"
android:layout_marginTop="10dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:drawableLeft="#drawable/pm_gmail"
android:drawablePadding="8dp"
android:text="example#gmail.com"
android:paddingLeft="16dp"
android:layout_gravity="left|center_vertical" />
<View
android:layout_width="fill_parent"
android:layout_height="1dip"
android:layout_centerVertical="true"
android:layout_below="#id/account_login"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_marginTop="5dp"
android:background="#DDDDDD" />
</RelativeLayout>
The second View is just a separator.
... and this is what the layout looks like after setting the above mentioned attributes:
(I don't have enough reputation to post images yet, so here's the link to it)
(Just to be clear, this is only a static example. My text and image are both set dynamically in the code at runtime).
Any help is greatly appreciated.
Change android:layout_gravity="left|center_vertical" to android:gravity="center_vertical".
layout_gravity is for positioning a View inside a container (layout), while gravity is referred to
the View contents (that is, in this case, the text inside the TextView).
I am having a problem getting the ListView to display properly. It currently looks like this with the following xml code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/favs_main">
<Button
android:text="Return to Home"
android:id="#+id/return_button"
android:layout_width="150dp"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:layout_centerHorizontal="true"
android:layout_alignParentBottom="true"
android:textSize="15sp"/>
<ListView
android:id="#+id/favsListView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="180dp"
android:layout_above="#id/return_button"/>
</RelativeLayout>
If you notice the list is down on the screen. I want it to be just below the favorites text instead of just above the return to home button. The catch however is that I always want the button to show and the list view to just occupy the space between the favorites text and the button. The text is from the background image so I can't just align below that. So even with 100 items I would still like to show the button.
Thanks for the help
If the word "favorites" is part of a background image as suggested in the RelativeLayout's background attribute, then you won't be able to align an element below it without using hacky margins or something to that effect. If you want to align an element below the word, separate that into a different ImageView and set the layout_below of the ListView to the id of that ImageView. To get an element to align properly in between two other elements, use a combination of layout_above and layout_below.
Couldn't you just align the ListView to the Parents' Top and set a margin for the ListView so that it is below the Text of the Background?
Also you could change the background to provide the Text in an ImageView and align the ListView to be below the ImageView.
Instead of trying to make a persistent View always show up under the ListView and align it (which you can do, see other suggestions), you might want to take a look at using a footerView:
http://developer.android.com/intl/de/reference/android/widget/ListView.html#addFooterView
"Add a fixed view to appear at the bottom of the list."
Note that it can be another layout too if you eventually need to do more than just one Button.
this my listview which have multiple entries and textview and button fixed in the botton. i haven't inserted background. try this hope it will help.
http://www.techuv.com/layout-with-butoon-and-textview-fixed-in-bottom/
You could use a simple LinearLayout and use the weight attribute on the ListView :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:background="#drawable/favs_main">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<ListView
android:id="#+id/favsListView"
android:layout_width="wrap_content"
android:layout_weight="1"
android:layout_height="wrap_content"
android:layout_marginTop="180dp"/>
<Button
android:text="Return to Home"
android:id="#+id/return_button"
android:layout_width="150dp"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:layout_centerHorizontal="true"
android:textSize="15sp"/>
</LinearLayout>