how to make stylish spinner? - android

I try to create a stylish small width spinner in my Android application instead of default thick spinner.
I tried to change item's background but then downward arrow disappears from spinner - as on this image
How can I get small width spinner?
<Spinner
android:id="#+id/lgnspinner"
android:prompt="#string/network_prompt"
android:layout_weight="1"
android:layout_width="0dp"
android:background="#ffffff"
android:layout_marginRight="45dp"
android:layout_marginLeft="45dp"
android:layout_height="wrap_content"
android:textColor="#000000"
/>

Try this,
cityadapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);

Related

Edittext background color issue

I have a linear layout with two child items, an edittext fied and button. I set the background color of the linear layout to a shade of blue. On android api 8 the the edittext field has a white background which is how i want it to be, however on android api 17+ the edittext background is the same as the linear layout and thus makes the text input a little difficult to read since it is black.
When i change the edittext background to white (#ffffff) from the default value "?android:attr/editTextBackground", the height of the edittext becomes smaller and doesn't maintain its previous look. My question is how can i maintain the edittext's background as white without altering other attributes that are effected by "?android:attr/editTextBackground" throughout all api levels?
And also i failed to figure out which file the attribute "?android:attr/editTextBackground" points to so i could perhaps look there and edit. Thanks in advance.
The code:
<LinearLayout
android:id="#+id/llSearch"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#color/search_layout_color"
android:orientation="horizontal"
android:paddingLeft="6dp"
android:paddingRight="6dp"
android:paddingTop="6dp"
android:shadowColor="#77000000"
android:shadowDx="-2.4"
android:shadowDy="2.4"
android:shadowRadius="1.2" >
<EditText
android:id="#+id/etSearch"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:hint="#string/hint_search"
android:scrollHorizontally="true"
android:singleLine="true"
android:textSize="#dimen/tv_textSize" >
<requestFocus />
</EditText>
<ImageButton
android:id="#+id/bSearch"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/search"
android:src="#drawable/ic_action_search" />
</LinearLayout>

Changing background color of spinner hides dropdown arrow

I have a spinnder and set its background color to white. The problem is, the arrow's gone. I don't know why. Is there something wrong?
I'm using this code.
drivers = (Spinner) findViewById(R.id.spinner1);
drivers.setBackgroundColor(Color.WHITE);
ArrayAdapter<String> adp1=new ArrayAdapter<String>(this,
android.R.layout.simple_spinner_item , driverList);
adp1.setDropDownViewResource(android.R.layout.select_dialog_singlechoice);
drivers.setAdapter(adp1);
drivers.setPrompt("Select Driver");
Here's my layout:
<Spinner
android:id="#+id/spinner1"
android:layout_width="330dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="10dp"
android:ellipsize="marquee"/>
Any ideas? I want to retain the white background but the dropdown arrow should show.
I solved this problem wrapping spinner by RelativeLayOut and using background for RelativeLayOut.Then arrow does not disappears.
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#f00" >
<Spinner
android:id="#+id/spinner1"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
Set background image (with arrow) instead of color.
Code
drivers.setBackgroundResource(R.drawable.spinner_img);

spacing for checkmark image of the check box in android

Hi i am trying to create a check box list which should looks like in the below image which will have space before and after checkmark image.
but when i am trying to create check box its is showing like the below image.
there is no space surrounds to check-mark image like i am showing the first image. If i use padding to check box component its like "android:padding=50dp" its giving space between check-mark image and text. But not giving space in the starting .i.e before Check-Mark image.
below is my xml layout for check box
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:padding="15dp">
<CheckBox android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:button="#drawable/btn_check_square"
android:background="#drawable/filter_item_background"
android:textColor="#android:color/black"
android:padding="5dp"
android:text="check box text"/>
</LinearLayout>
Any help to solve this issue is appreciated.
this is resolved with below code.
<CheckBox
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/filter_item_background"
android:button="#android:color/transparent" //Make button null
android:drawableLeft="#drawable/btn_check_square" //Create button in drawable
android:drawablePadding="20dp" //Set space between Text & CB
android:padding="5dp"
android:text="check box text"
android:textColor="#android:color/black" />
Try this (without custom graphics):
<CheckBox
android:id="#+id/checkBox1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableLeft="#android:color/transparent"
android:drawablePadding="8dp"
android:text="CheckBox" />
It uses a little trick: As Checkbox is derived from Button, we can add a drawable and can now set a padding between label and drawable. As we do not acutally need a real icon, we use the transparent color instead.
<CheckBox
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/filter_item_background"
android:button="#null" //Make button null
android:drawableLeft="#drawable/btn_check_square" //Create button in drawable
android:drawablePadding="20dp" //Set space between Text & CB
android:padding="5dp"
android:text="check box text"
android:textColor="#android:color/black" />
Use the below code
final float scale = this.getResources().getDisplayMetrics().density;
checkbox.setPadding(checkbox.getPaddingLeft()
+ (int) (10.0f * scale + 0.5f),
checkbox.getPaddingTop(),
checkbox.getPaddingRight(),
checkbox.getPaddingBottom());
Add this to your checkbox:
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"

Why button is big?

I have the below layout which contains a button, I'm trying to reduce the size, mainly height, of button, but button height allows stays the same
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/buttonlayout2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:gravity="right"
android:orientation="horizontal"
android:background="#FFDBE2ED"
android:paddingBottom="0dp"
android:paddingTop="0dp" >
<!--Button
android:id="#+id/btnSave"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="2px"
android:layout_marginLeft="10px"
android:layout_marginRight="10px"
android:layout_marginTop="2px"
android:height="15dp"
android:text="Save"
android:textSize="15sp"
android:width="70dp" >
</Button -->
<Button
android:id="#+id/btnClear"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="0px"
android:layout_marginLeft="10px"
android:layout_marginRight="3px"
android:layout_marginTop="2px"
android:height="0dp"
android:text="Clear"
android:textSize="15sp"
android:width="70dp"
>
</Button>
</LinearLayout>
any idea?
You're using android:layout_height="wrap_content" which means it will always be as tall as the content inside it. Try playing around with that value to change the height.
Just tried your code and button looks fine. What do you want to look it like? Button as small(short) as it defined by current android theme. You have to change button style to custom one, to make spacing inside of the button different to make it shorter.
When you place standard android button android will use its theme style, including 9-patch image for button background. That image has internal paddings for the text. If you need a different look of the button then you need to create a custom Button control inherited from the Button and overwrite styles.
android:layout_width="wrap_content"
android:layout_height="wrap_content"
Instead of using wrap_content you can specify a view's width or height using DP (Density Independant Pixels) Try changing wrap_content to 50dp or whatever value that suits your needs.

Android custom spinner

I have a custom spinner that uses two custom views, one for the drop down and one for the currently selected item.
My problem is, the custom view for the currently selected item is always at least as wide as the longest item in the spinner list and it leaves a sizeable gap on the left hand side of my custom view. If I select the longest item from the spinner, the gap disappears. I have tried android:gravity="left" for my custom view. Also note that this only seems to be an issue with Android 3.0+.
Here is the code for my custom spinner view:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="#+id/folder_detail" android:layout_height="wrap_content" android:orientation="horizontal" android:layout_width="wrap_content">
<TextView android:text="Folder Name"
android:id="#+id/folder_name" android:textColor="#ffffff"
android:layout_width="wrap_content" android:textSize="16sp"
android:textStyle="bold"
android:layout_height="wrap_content" android:layout_marginTop="0dp">
</TextView>
<TextView android:id="#+id/folder_count" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textSize="13sp" android:text="(0) " android:textColor="#color/light_blue" android:layout_marginLeft="2dp"/>
<ImageView android:id="#+id/icon" android:src="#android:drawable/arrow_down_float"
android:layout_marginRight="1dp" android:scaleType="fitXY"
android:layout_gravity="bottom" android:layout_width="wrap_content" android:layout_height="wrap_content"/>
</LinearLayout>
This is intentional. It prevents the spinner from drastically changing size as the selection changes.
You're not meant to include an arrow as part of the item view; this is normally included as part of the background 9-patch of the spinner itself. The gravity setting on the spinner itself controls the alignment of the selected item view within the spinner. The Holo theme aligns it to the left, while the legacy themes horizontally center.

Categories

Resources