I am creating an Android app that consists mainly of a form. This form needs to have EditText and Spinners side-by-side (for this I chose a LinearLayout). My final goal is to have the text in the Spinner align vertically with the text in the EditText; however, I also want to have padding on the options in the expanded Spinner. This padding messes up the Spinner alignment as it appears in the form.
Here is my code for a custom Spinner list item:
<TextView
android:id="#+id/transportation_spinner_item_textView"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp"
android:textColor="#android:color/black"
android:textSize="18dp"/>
Here is my code for the main form:
<LinearLayout
android:id="#+id/linearLayout6"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/divider3"
android:orientation="horizontal">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="100"
android:orientation="vertical">
<TextView
android:id="#+id/ip_minutes_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="#string/ip_minutes"
android:layout_marginTop="4dp"
android:textSize="12sp"/>
<Spinner
android:id="#+id/ip_minutes_spinner"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:spinnerMode="dialog"
android:gravity="bottom"/>
</RelativeLayout>
<android.support.design.widget.TextInputLayout
android:id="#+id/ip_charge"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="100"
android:layout_gravity="bottom">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="100"
android:editable="false"
android:hint="#string/ip_charge"/>
</android.support.design.widget.TextInputLayout>
</LinearLayout>
And here is an image of how it looks:
Image of alignment with above code
I have been Googling and trying to adjust the padding/margins of different views for hours, so if anyone has any suggestions, that would be great. Thanks!
I'm not sure I fully understand, when you say,
This padding messes up the Spinner alignment as it appears in the
form.
Do you mean the DropDownView? that shows when the Spinner is clicked?
If so, simply create a separate layout for the DropDownView.
In your ArrayAdapter you will have the following methods,
public View getDropDownView(int position, View cnvtView, ViewGroup prnt)
public View getView(int pos, View cnvtView, ViewGroup prnt)
Just have them return two different Views, e.g
#Override
public View getDropDownView(int position, View cnvtView, ViewGroup prnt) {
return getCustomDropDownView(position, cnvtView, prnt);
}
#Override
public View getView(int pos, View cnvtView, ViewGroup prnt) {
return getCustomView(pos, cnvtView, prnt);
}
and
public View getCustomView(int position, View convertView, ViewGroup parent) {
LayoutInflater inflater = (LayoutInflater) context.getSystemService( Context.LAYOUT_INFLATER_SERVICE );
View mySpinner = inflater.inflate(R.layout.custom_spinner, parent, false);
TextView main_text = (TextView) mySpinner.findViewById(R.id.spinner_text);
main_text.setText(spinnerValues[position]);
return mySpinner;
}
public View getCustomDropDownView(int position, View convertView, ViewGroup parent) {
LayoutInflater inflater = (LayoutInflater) context.getSystemService( Context.LAYOUT_INFLATER_SERVICE );
View mySpinner = inflater.inflate(R.layout.custom_dropdown_spinner, parent, false);
TextView main_text = (TextView) mySpinner.findViewById(R.id.spinner_text);
main_text.setText(spinnerValues[position]);
return mySpinner;
}
Related
How can I remove the padding from around the Spinner's text?
My layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
tools:context=".MainActivity">
<Spinner
android:id="#+id/spinner"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:background="#ff00ff"
android:spinnerMode="dropdown" />
<TextView
android:id="#+id/textLabel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Label"
android:layout_marginStart="8dp"
android:background="#0000ff"
android:textColor="#ffffff"
android:textAppearance="?android:attr/textAppearanceMedium" />
</LinearLayout>
Activity does not do anything special just put some content into the Spinner. Please let me know if you need it, I'll attach it then.
I'd like to make the Spinner's text to be exactly aligned to Label while the purple box also aligned to blue one. I tried to set padding to 0dp, but it does not change anything. Also tried removing the background, but it also does not change this padding.
And of course if I mess with margins, I can make the texts to be in line, but then the boxes will not stay where they are now.
How shall I do this?
Using a custom overridden View seems to work but why are padding on the top and bottom?
I tried even changing all padding to 0, but still.
Here is my actual adapter:
public class MyAdapter extends ArrayAdapter {
public MyAdapter(#NonNull Context context, int resource, String[] params) {
super(context, resource, params);
}
#Override
public View getView(int position, View convertView, ViewGroup parent) {
View view = super.getView(position, convertView, parent);
view.setPadding(0, 0, 0, 0);
return view;
}
}
You can try adding this to the adapter.
#Override
public View getView(int position, View convertView, ViewGroup parent) {
View view = super.getView(position, convertView, parent);
view.setPadding(0, view.getPaddingTop(), view.getPaddingRight(), view.getPaddingBottom());
return view;
}
I have an ExpandableListView that I'm populating with items. I'd like to have the header (here, "meat") be wider than the list items.
However, ExpandableListView doesn't seem to respect margins/padding defined in XML, and also fails to respect programatically-set padding for the items. It does modify the parent ("meat") but the same code doesn't work for the items.
How can I do this?
Here's the relevant part of my custom adapter:
#Override
public View getGroupView(int position, boolean isExpanded, View view, ViewGroup parent) {
if (view == null) {
LayoutInflater layoutInflater = (LayoutInflater) this.context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
view = layoutInflater.inflate(R.layout.list_category, null);
}
view.setPadding(10, 0, 10, 0); //RESPECTED
initializeGroupComponents(view, getGroup(position));
return view;
}
#Override
public View getChildView(int position, int expandedPosition, boolean isLastChild, View view, ViewGroup parent) {
if (view == null) {
LayoutInflater layoutInflater = (LayoutInflater) this.context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
view = layoutInflater.inflate(R.layout.list_ingredient, parent, false);
}
view.setPadding(10, 2, 10, 2); //DOES NOT WORK
initializeChildComponents(view, getChild(position, expandedPosition));
return view;
}
The relevant portions of my XML:
The group:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/layout_categoryContainer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="2dp"
android:orientation="vertical">
The item:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/row"
android:layout_width="match_parent"
android:layout_height="62dp"
android:layout_marginBottom="1dp"
android:layout_marginEnd="6dp"
android:layout_marginStart="6dp"
android:background="#android:color/white"
android:gravity="center_vertical"
android:orientation="horizontal"
android:padding="10dp">
Take one extra layout for header and add margin
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/layout_categoryContainer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_marginTop="5dp"
android:layout_marginEnd="5dp"
android:layout_marginStart="5dp">
//other content
</LinearLayout>
</LinearLayout>
I am passing my custom layout in constructor of ArrayAdapter<String>:
private static class ActionSpinnerAdapter extends ArrayAdapter<String> {
public ActionSpinnerAdapter(final Context context) {
super(context,
R.layout.action_spinner_text, //This is my own layout
//R.id.action_text,
Lists.newArrayList(ACTION_REPLY, ACTION_REPLY_ALL, ACTION_FORWARD));
action_spinner_text.xml
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/action_text"
android:layout_width="90dp"
android:layout_height="wrap_content"
android:paddingBottom="10dp"
android:paddingLeft="8dip"
android:paddingStart="8dp"
android:paddingTop="10dp"
android:paddingRight="8dp"
android:paddingEnd="8dp"
android:text="#string/reply_all_action"
android:textSize="18sp" />
And these are my getView() and getDropDownView() methods:
#Override
public View getDropDownView(int position, View convertView, ViewGroup parent) {
View result = super.getDropDownView(position, convertView, parent);
result.setBackgroundColor(mContext.getResources().getColor(R.color.white));
TextView textView = ((TextView) result.findViewById(R.id.action_text));
textView.setTextColor(mContext.getResources().getColor(R.color.dark_grey));
textView.setText(getDisplayValue(position));
return result;
}
#Override
public View getView(int position, View convertView, ViewGroup parent) {
View result = super.getView(position, convertView, parent);
TextView textView = ((TextView) result.findViewById(R.id.action_text));
textView.setTextColor(mContext.getResources().getColor(R.color.white));
textView.setText(getDisplayValue(position));
return result;
}
But When I click on DropDown from Toolbar it shows text values with black background on right side.
What went wrong?
I had exactly the same problem, and it seems like there's a bug in Pre-Lollipop devices when you specify a size in the dropdown view that is not "match_parent" on "android:layout_width", basically all you need to do is
this:
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/action_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="10dp"
android:paddingLeft="8dip"
android:paddingStart="8dp"
android:paddingTop="10dp"
android:paddingRight="8dp"
android:paddingEnd="8dp"
android:text="#string/reply_all_action"
android:textSize="18sp" />
Hope it Helps!
I have a custom layout for spinner. Its both selected and dropdown list item's background color will change depending on user demand. So i am changing depending on their values.. so far so good. But the problem is since i am using custom layout or changing background color, there is no arrow to show that it is a spinner. When i add arrow from layout then all even dropdown list have that arrow with them. I can manipulate it by setting arrow's background to null for drop down items but it is not a good way and dont always work. So how can i show spinner default arrow with my custom spinner without using spinner style. Dont forget that i am changing background of every item.
Here is my custom_spinner.xml
<?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:weightSum="6" android:id="#+id/spinnerMainLayout"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="horizontal" android:layout_width="match_parent"
android:weightSum="14"
android:layout_height="wrap_content">
<TextView
android:layout_width="0dp" android:layout_marginTop="8dp"
android:layout_height="wrap_content" android:layout_marginLeft="10dp"
android:text="New Text" android:textSize="19sp" android:layout_weight="5"
android:layout_gravity="center" android:layout_marginBottom="8dp"
android:gravity="center" android:layout_marginRight="4dp"
android:id="#+id/type" android:typeface="serif"/>
<View
android:layout_width="1dp" android:layout_marginLeft="8dp" android:layout_marginTop="4dp"
android:layout_height="match_parent" android:layout_marginBottom="4dp"
android:background="#666666" />
<TextView
android:layout_width="0dp" android:layout_height="wrap_content"
android:layout_marginTop="8dp" android:layout_weight="9"
android:typeface="serif" android:maxLines="3" android:minLines="2"
android:layout_gravity="center" android:layout_marginBottom="8dp"
android:layout_marginLeft="10dp" android:layout_marginRight="5dp"
android:text="sd" android:textSize="18sp" android:gravity="center_vertical"
android:id="#+id/history" />
</LinearLayout>
</LinearLayout>
and here is my custom spinner class
class CustomSpinner extends ArrayAdapter<String> {
private String[] fixStrs = new String[]{"Definition","Result","Error"};
public CustomSpinner(Context ctx, int txtViewResourceId, String[] objects) {
super(ctx, txtViewResourceId, objects);
//fixStrs = objects;
}
#Override public View getDropDownView(int position, View cnvtView, ViewGroup prnt) {
return getCustomView(position, cnvtView, prnt);
}
#Override public View getView(int pos, View cnvtView, ViewGroup prnt) {
return getCustomView(pos, cnvtView, prnt);
}
public View getCustomView(int position, View convertView, ViewGroup parent) {
LayoutInflater inflater = getLayoutInflater();
View mySpinner = inflater.inflate(R.layout.custom_spinner, parent, false);
/*LinearLayout spinnerMain = (LinearLayout) mySpinner.findViewById(R.id.spinnerMainLayout);
spinnerMain.setBackgroundColor(Color.parseColor(colors[0]));*/
TextView fixText = (TextView) mySpinner.findViewById(R.id.type);
fixText.setText(fixStrs[position]);
fixText.setTextColor(Color.parseColor(colors[1]));
TextView historyText = (TextView) mySpinner.findViewById(R.id.history);
historyText.setText(history[position]);
historyText.setTextColor(Color.parseColor(colors[1]));
return mySpinner;
}
}
Create a different layout for the spinner dropdown and pass it to the .setDropDownViewResource method of the ArrayAdapter, then you must specify the id of the textview in this layout in the constructor call of your adapter
I have a background image set for my spinner, but when I select an item from the drop-down list of the spinner, my spinner background image is replaced by the selected item, I want my background image to remain there and I don't want the selected item to be shown instead of the background image of spinner. How do I do that?
Code for my custom adapter:
public class MyAdapter extends ArrayAdapter<String> {
public MyAdapter(Context ctx, int txtViewResourceId, String[] objects) {
super(ctx, txtViewResourceId, objects);
}
#Override
public View getDropDownView(int position, View cnvtView, ViewGroup prnt) {
return getCustomView(position, cnvtView, prnt);
}
#Override
public View getView(int pos, View cnvtView, ViewGroup prnt) {
return getCustomView(pos, cnvtView, prnt);
}
public View getCustomView(int position, View convertView,
ViewGroup parent) {
LayoutInflater inflater = getLayoutInflater();
View mySpinner = inflater.inflate(R.layout.custom_spinner, parent,
false);
TextView main_text = (TextView) mySpinner
.findViewById(R.id.text_main_seen);
main_text.setText(spinnerValues[position]);
return mySpinner;
}
}
Code for my custom spinner 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="wrap_content"
android:orientation="vertical"
>
<TextView
android:id="#+id/text_main_seen"
android:layout_width="fill_parent"
android:layout_height="30sp"
android:background="#008000"
android:gravity="center"
android:textColor="#ffffff"
android:textSize="30px" />
</RelativeLayout>
Code for my actual spinner.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<Spinner
android:id="#+id/planets_spinner"
android:layout_width="100dp"
android:layout_height="50sp"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:background="#008000"
android:layout_weight="0.08"
android:drawSelectorOnTop="true" />
</RelativeLayout
and code of my mainActivity where i am calling the spinner is
Spinner mySpinner = (Spinner) findViewById(R.id.planets_spinner);
mySpinner.setAdapter(new MyAdapter(this, R.layout.custom_spinner,
spinnerValues));
I wouldn't use a spinner at all for this. Just use a Button made to look like a Spinner or whatever else you want it to look like. You can make a regular Button look like a Spinner with this attribute:
android:background="#android:drawable/btn_dropdown"
Or, make your own background that looks like a Spinner and use that.
Then, have the onClick event of your Button open up a "single-item-select" Dialog.